JavaScript Statements Tutorial

In this section, we will learn what the statement is and how to use it in JavaScript.

Define Statements in JavaScript

A computer program is a series of instructions for computers to run. Each of these instructions is called a statement.

A statement is composed of:

  • Values (of type String, Number and other data types mentioned in the data type section.)
  • Operators: In a later section you’ll see these operators in a greater detail but in short it is mathematical operators like multiplication, subtraction, addition, division etc., comparison operators in order to see if two values are equal or one is greater than the other, and other types of operators that are used for a different matter in a program.
  • Expression: combining values and operators in order to reach a new value is called expression. For example, 2 * 2 is an expression because it has an operator and values and obviously it resolves to a new value. For the majority of times, a statement includes expression as well.

Note: But remember, a statement can be also assigning just a single value to a variable as well.

JavaScript Semicolons `;`

In JavaScript, in order to separate each statement from the other, we use a semicolon `;` at the end of each statement.

Note: if two statements are in two separate lines, then the use of semicolon becomes optional. That means we can ignore the semicolon altogether.

Example: creating JavaScript Statements

      let num = typeof 10
      let str = typeof num
      document.getElementById("link").innerText = `${num}, ${str}`

Here we have 3 statements as each of them is set in a separate line. Here, because they are in a separate line, we didn’t use the semicolon. But if they all were in one line, in that situation we needed to separate each statement from the other via the semicolon `;`. Otherwise we could get a compile time error.

Considering the fact that in the future, other developers or even ourselves might come back and read our old source code, it’s a good practice to always add the semicolon at the end of our statements even if they are not necessary. This helps the readability of the source code.

Example: JavaScript statement without semicolon

      let name = "John Doe" document.getElementById("link").innerText =`Hi, My name is ${name}`;

As you can see, this time, we didn’t get an output! This is mainly because there are two statements, but both are in the same line and we didn’t separate them via a semicolon `;`. In a situation like this, the compiler doesn’t know where one statement ends and the other begins. For this reason, we get a compile time error.

If you open your browser’s console, you’ll see the error mentioned below:

Uncaught SyntaxError: Unexpected identifier

Again, this is mainly because the compiler couldn’t separate the two statements from each other.

Now, if we add a semicolon between the two statements, the error will be resolved and we get the correct output.

Example: JavaScript statement with semicolon

      let name = "John Doe"; document.getElementById("link").innerText = `${name}`;

JavaScript White Space

So far, our examples were designed in a way that each statement takes only one line. But in JavaScript we’re allowed to break a statement to take multiple lines if that statement is lengthy. This is mainly done to increase the readability of a source code. 

Example: JavaScript statement with white space

      let name = "John Doe"; 
      document.getElementById("link").innerText = 
      `Hi, My name is ${name}`;

The second statement in this example is taking two lines of code, but the compiler will ignore this new line space and consider it as only one statement.

Leave a Reply