Hello JavaScript Devs, I am back with another blog which will introduce you to some very basic features of JavaScript. In this article, I have discussed statements, semicolons and comments in JavaScript. Before diving right into our main topic, we will study about alert() function. Let's get started…

alert() function

alert() function is used to display popup box with ok button in the browser. alert() function shows an alert box when it is executed. This function is maily used to gain user's attention on a very important topic. Popups generated by this function looks different on different browsers. below image shows popup generated in Google Chrome.

Here's the code which generared above popup window.

alert("Hello");

alert(parameter) takes data as a parameter which you want to show on the alert box. Data which you pass in alert() can be of any type, it can be a string, boolean, number, object or even a function!

Let's see the behavior of alert() when we pass an anonymous function as an argument.

alert(
   (function() {
      return "Hey";
   })()
);

In this example, we have passed an anonymous function as an argument. If you are familiar with IIFE (Immediately Invoked Function Expression) in JavaScript, then you will understand this.

If you are not familiar with IIFEs, then don't worry. I will be covering this concept in the next articles. You can simply ignore this example for now.

Statements

Statements are nothing than but a set of instructions that are needed to be executed. JavaScript programs are just a set of instructions that are called statements. 

A simple picture of statements:

var a = "I m'a statement";
alert(a);
alert("I am also a statement");
alert("Me too");

Isn't is simple?

Javscript also allows Multiple whitespaces. JavaScript interpreter removes all the extra whitespace from code. That is why both of below statements are the same.

// Both of these statements are same

var name = "Pumpkin";
var name    =      "Pumpkin";

It is recommended to use proper spaces around operators, keywords, variable name etc because proper spaces make a code easy to read.

Semicolons (;)

A semicolon is an operator which is used to separate two or multiple statements. In JavaScript, it is not mandatory to use semicolons but it's a good practice to use them.

JavaScript engine adds a semicolon at the end of a line but this is not the case every time. Like in the following example, JS engine doesn't insert a semicolon at the end of a line.

alert("Hey" + 
"Pumpkin" +
"!");

This code works completely fine. In this case, the JavaScript engine is not inserting a semicolon at the end of a line.

Be careful, omitting semicolons can lead you to some annoying errors. Like in this case

// I am not using semicolons here

alert("Yo")  // stataement 1
[4,49,78,7].forEach(x => alert(x))  // statement 2

There's an error in this code. This looks valid JavaScript, but it's not!

Statement 1 gets executed but statement 2 has some serious issues with it. Actually, the javascript engine is not seeing the code in the same way as we are seeing it.

JavaScript engine is seeing this code like this:

// JavaScipt engine is treating statement 1 and 2 as single statement.
// We can remove this issue by using a semicolon

alert("Yo")[4,49,78,7].forEach(x => alert(x));

This is clearly an error. In this case, the JS engine is treating statement 1 and 2 as a single statement, that's why we were getting an error. This issue can be resolved by simply inserting semicolons at the end of each statement.

Many developers make this mistake and spend hours slapping their keyboard. It would be better if you use a semicolon at the end of a statement. This practice can save a lot of hours of debugging.

comments

I must say comments are a life saver functionality in any language. When code becomes lengthy and complicated than it is difficult to understand the work and objective of a certain part of a code, to resolve this issue, we have comments.

All the comments are ignored by the JavaScript interpreter. A well-commented code is always easy to read and understand. 

There are two ways by which we can make comments in JavaScript:

1. Single-line comments
2. Multi-line comments

Single-line comments

Single-line comments start with the double forward slash // . These types of comments are good for writing short comments. But for lengthy and multiple comments, we have multi-line comments.

// I am ignored by the interpreter.
alert("Hello Coder"); // This is also a comment

Multi-line comments

Multi-line comments start with a forward slash and asterisk /*  and end with */. 

/*
  This is a comment 
  This is a comment too
  Last line
*/
alert("Hello JavaScript");

Comments are a great feature for making your code readable. Every developer should use comments so that a code can easily be understood by other collaborators in a project.

Nested Comments

Nested multi-line comments are not possible in JavaScript. This following syntax is not possible

/*
 I am a comment
 /* 
   This is not possible
 */
*/

But a single-line comment inside a multi-line comment is a valid practice. 

/*
  // This is valid
*/

It is not possible to define a multi-line comment inside a multi-line comment but it is totally valid to defined a single comment inside a multi-line comment.