Basic Syntax of JavaScript

In this lesson, we are going to introduce some basic concepts in JavaScript in order to prepare you for future lessons.

What is an expression

An expression is a piece of code that gives a value. It is a combination of values and operators that evaluates to another value.

javascript

11 + 2;
2
3true && false;
4
5"John" + " " + "Doe";

What is an operator

An operator is a special symbol that performs certain operations on different values. For example, the addition operator (+) adds two values together.

There are several other operators in JavaScript, and we will talk more about them later.

What is a statement

A statement is an instruction in the program that performs certain actions. It doesn't necessarily return a value. Most statements end with a semicolon (;).

javascript

1myFunc(); // -> A function call that doesn't return a value
2
3true && false;
4
5"John" + " " + "Doe";

Yes, sometimes, expressions can also be statements.

Statements can contain expressions. It can be the combination of multiple expressions, but expressions cannot contain statements. For example:

javascript

1console.log("John" + " " + "Doe");

In this case, console.log() is an expression, and "John" + " " + "Doe" is also an expression. Together, they form a statement.

More complex statements that can't be expressed in a single line, such as an if statement or a while loop, will be written in a more structured format:

javascript

1if (a === 0) {
2  a + 1;
3} else {
4  a + 2;
5}

These statements don't have to end with a semicolon. Instead, the square brackets ({}) are used to group other smaller statements inside.

What is a declaration

A declaration is an instruction in the program that declares something new, such as a variable or a function.

javascript

1let x = 10;
2
3let myFunc = function (num) {
4  console.log(num * num);
5};

In summary, expressions produce values, statements perform actions and don't have to produce a value, and declarations introduce new things into the program.

What is a variable

A variable is a way for the program to save a value so that it can be accessed and reused later. A variable declaration consists of a keyword, an identifier (variable name), an assignment operator, and a value.

javascript

1let x = 10;

In this example, let is the keyword that declares the variable, x is the identifier, also know as the variable name. = does not indicate equality here. It is the assignment operator that assigns the value 10 to the variable x.

The variable x can then be used later in the program:

javascript

1let x = 10;
2
3x + 10; // -> 20
4x * x; // -> 100

Variables can be declared in 3 different ways in JavaScript:

javascript

1let x = 10;

javascript

1const x = 10;

javascript

1var x = 10;

let declares a temporary variable bind, meaning the value can be changed later in the program.

javascript

1let x = 10;
2
3x + 10; // -> 20
4
5x = 5;
6
7x + 10; // -> 15

const declares a permanent variable binding. You will get an error message if you try to change its value after declaration.

javascript

1const x = 10;
2
3x + 10; // -> 20
4
5x = 5; // -> Error

text

1/Users/. . ./index.js:5
2x = 5; // -> Error
3  ^
4
5TypeError: Assignment to constant variable.
6    at Object.<anonymous> (/Users/. . ./index.js:5:3)
7    at Module._compile (node:internal/modules/cjs/loader:1378:14)
8    at Module._extensions..js (node:internal/modules/cjs/loader:1437:10)
9    at Module.load (node:internal/modules/cjs/loader:1212:32)
10    at Module._load (node:internal/modules/cjs/loader:1028:12)
11    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:142:12)
12    at node:internal/main/run_main_module:28:49
13
14Node.js v21.6.0

var is the legacy method of declaring a variable. It is rarely used these days, but you might still encounter it in some old software. It works differently in terms of scope compared to let and const. We will explain the details later.

What is a keyword

The keywords in JavaScript are a set of words with special meanings and purposes, such as the let, const, and var that are used to declare a new variable.

The keywords are case sensitive, meaning JavaScript will not treat LET or Let as a keyword.

What is an identifier

An identifier is a name for the declared variables or functions.

An identifier must start with either a letter, a dollar sign ($), or an underscore (_). Subsequent digits can also be numbers.

javascript

1let $name = "John";
2let _name = "John";
3let name = "John";
4let name123 = "John";

But remember that an identifier cannot start with a number.

Identifiers are also case sensitive, meaning JavaScript will treat name, Name, and NAME as different variables.

What is a comment

You probably already know what comments look like from our previous examples, but there is still something we must discuss.

javascript

1// Execute if <condition> returns true

This is a single-line comment. It is the part of your code that is intended for humans to read and will be ignored by the JavaScript compiler.

In practice, it is common for people to forget the purpose of the code they previously wrote, or the code was too cryptic to easily understand, such as how we've been testing the parity of a number (n % 2 === 0). You might not immediately recognize the purpose of this expression, so it is best to always write comments whenever you can.

There are two types of comments in JavaScript. Our previous example is a single-line comment defined by //. You can also define a section of texts as comments using /* and */.

javascript

1/*
2Lorem ipsum dolor sit amet, consectetur adipiscing elit.
3Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
4Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
5*/

All the enclosed texts will be ignored by JavaScript.

Prev Next