JavaScript functions explained

Functions are the basic building blocks in JavaScript. They can be used everywhere, can be passed as parameters, attached as event handlers, overridden, deleted, etc. Functions can be anonymous or not.

// In the example below, dont forget the semicolon!
// However, its name will not appear in the debugger
var anonymous = function() {
    console.log('anonymous function!');
};
 
// This the classic syntax, without a semicolon at the end!
function nonAnonymous() {
    console.log('non anonymous!');
}
 
// This is similar to the above, but is more
// debugger-friendly, as the name of the function
// will be printed in the debugger.
var nonAnonymous2 = function nonAnonymous2() {
    console.log('non anonymous too!');
};
 
// This is the syntax for adding event handlers in jQuery
$('field').bind('tap', 
                function(event, data) {
                    console.log('binding an anonymous function!');
                    event.preventDefault();
                });
 

Differentiate between alert(), prompt() and confirm() methods

Although jQuery is the new craze, traditional javascript knowledge is still required and forms a core part of a web developer interview. One of the common questions is about making sure the interviewee understands the different mechanisms of communicating with the user. The javascript window object uses dialog boxes to interact with the user. The dialog boxes are created with three methods:
• alert()
• prompt()
• confirm()

alert() dialog

The alert() dialog box is used to communicate a message to the user (generally warnings of missed actions). For example, if the email address entered is wrong, you can use the alert() message to warn the user about it. Developers also use alerts() as a quick and dirty way to debug their applications.

// warning
alert("Invalid email address. Please enter again.");
// debugging
alert(currentCounter);

The alert() method creates a new pop-up window (dialog box) which contains the user message and an
OK button. This is a modal window and all execution is stopped until the user clicks the OK button in the pop-up box.

prompt() dialog

The prompt() method asks the user for some small input such as a password, completion of a form input, or personal information, such as nickname or title. The prompt dialog box pops up with a simple text box. After the user enters text into the prompt dialog box, its value is returned (or null in case the user hit cancel).

prompt("Please enter your nickname", "nickname");

The prompt method takes in 2 arguments – the prompt message and a default value. The default value is optional and if provided is filled in the text box and is selected by default.

confirm() dialog

The confirm dialog box is used to confirm a user’s answer to a question. This method takes only one argument, the question you will ask the user. A question mark will appear in the box with an OK button and a Cancel button. If the user clicks the OK button, true is returned; if he or she clicks the Cancel button, false is returned. This is also a modal dialog  - the user must agree before the action is completed. You often see this in shopping cart applications just before placing the order or on file sharing sites just before you delete a file.  

if (confirm("Are you sure you want to delete your profile photo?") == true) {
    alert("Deleting photo...");
}
else {
    alert("Glad you decided against deleting the photo!");
}

To summarize, the different mechanisms that javascript provides you to interact with the user are alert, prompt and confirm. Hopefully with the explanation, code and screenshots, this is clear to you.