Javascript Simple Actions alert, prompt, confirm

In this chapter of the tutorial, you will get familiar with the browser functions. JavaScript has three kinds of boxes: alert, prompt, confirm and console.log. Let’s talk about them in details.

JavaScript Alert: Definition and Usage¶

alert() method shows an alert dialog with the optional detailed content and an OK button.

An alert box usually used in case we want to make sure information comes through to the user. Thealert() method shows a box with a message and an “OK” button.

When an alert box appears, the user will have to click "OK" to begin.

Syntax

alert(message);

Example of the alert():

alert("Welcome to Web");

The window with the message is called a “modal” window. It means that the visitor can’t interact with the rest of the page or press other buttons until they have dealt with the window (press “OK”).

The alert box takes the focus away from the window, and forces the browser to read the message. You shouldn’t overuse this method, because it prevents the user from accessing other parts of the page until the box is closed.

The alert dialog can be used for messages that do not require any reply on the part of the user, other than the acknowledgement of the message.

JavaScript Prompt: Definition and Usage¶

The prompt() method displays a dialog with an optional message reminding the user to input some text. It is often used in case the user wants to input a value before entering a page.

The function prompt accepts two arguments: title and default.

Syntax

prompt(text, defaultText)

result = prompt(title, [default]);

Prompt shows a modal window with a text message, an input field for the visitor, and the buttons OK/Cancel.

Title - is the text to show the visitor, and default - an optional second parameter, the initial value for the input field.

The visitor can type something in the prompt input field and press OK or cancel the input by pressing Cancel or hitting the Esc key. If the input was canceled, the call to prompt returns the text from the input field or null.

Example of the prompt():

let name = prompt("Please enter your name", "Web");

alert(`Welcome to ${name} !`); // Welcome to Web!

Javascript Confirm: Definition and Usage¶

The confirm() method displays a modal window with an optional message and buttons OK and Cancel. The result will be true if OK is pressed, otherwise it will be false.

The confirm box takes the focus away from the current window, forcing the browser to read the message. You shouldn’t overuse this method, because it prevents the user from accessing other parts of the page until the box is closed.

let result = confirm("Do you want to save changes?");

alert(result); // true if OK is pressed

Javascript console.log¶

The console.log() method outputs a message to the web console. The message can be a single string, or anyone or more JavaScript objects. It's useful to use the console for testing purposes.

Syntax:

console.log(message);

Parameters: Accept a parameter that can be an object, an array, or any message.

Return value: Returns the value of the given parameter.

console.log() prints the component in an HTML-like tree

Example of the console.log():

console.log("Welcome to Web");