JavaScript: Syntax, Statements, Variables, and Comments

In this JavaScript tutorial, we will learn about the language’s syntax and statements, how to declare variables, and how to create comments.

  • In short, statements are separated by semicolons (";"), but they do not have to when the statements are in separate lines.
  • Variables are mostly declared with either the keyword “const” or “let“.
  • Regarding comments, there are two ways to produce comments: one-line comments ("//") and multi-line comments “(/* * */“).

A great reference to read more about these topics can be found here.

Syntax and statements

The syntax of a programming language is a set of rules that describe how a program should be structured. We have got a sequence of instructions that we can execute.

πŸ’‘ In JavaScript, these instructions are called statements.

Let’s have a look at an example statement:

let x = 42;

Here, we declare the variable “x” with the keyword “let” and assign it the value “42“.

❓ Note: If you do not understand what “let“, “x“, and “42” mean here, don’t worry. We will look at variables in more detail in the next section.

The important thing here is the semicolon (“;“) at the end of the code line.

A semicolon determines the end of a statement.

However, if there is only one statement written in one code line, we do not necessarily have to set the semicolon:

let x = 42

That being said, if we put multiple statements into one line of code, the statements have to be separated by semicolons:

let x = 42; let y = 0;

Variables

As mentioned in the previous section, we will now shift our focus towards variables.

A variable is used to store data.

The name of a variable can be freely chosen but it has to start with a letter, an underscore, or a dollar sign.

Since JavaScript is case-sensitive, a variable called “jeff” is not the same as “Jeff” because the second “Jeff” starts with a capital letter and the other one does not.

In JavaScript there are four ways to declare variables:

  • with the keywords “var“,
  • let“,
  • const“, or
  • with no keyword at all.

When we declare a variable with no keyword, it looks like this:

a = 10;

The name of the variable here is “a” and we assign it the number “10” using the assignment operator “=“. However, using no keyword at all can lead to errors and should be avoided.

That’s why we should always use a keyword for the variable declaration.

One keyword is “var“:

var b = "Hello";

The “var” keyword is the original way to declare a variable in JavaScript. Using this keyword, we create function-scoped variables. Here, we declare a variable called “b” and assign it the string "Hello".

We can check the current value for “b” by outputting the value of the variable:

console.log(b);

Result: Hello

We use the “console.log()” statement for producing output. And as we can see, the value of “b” is "Hello".

However, when using “var” we can change the value of an existing variable.

b = 40;

We reassign the value of “b” to the number “40“. Let’s see what the output is now:

console.log(b);

Result: 40

We successfully reassigned the variable “b” to another value.

Also, when declaring a variable with “var“, we do not immediately have to set a value for that variable:

var c;

When we output “c“, this is what happens:

console.log(c);

Output: undefined

We get “undefined” as output because the variable does not hold any value yet. But we can, of course, give that variable a value now:

c = 5;
console.log(c);
// Output: 5

There are two remaining ways to declare a variable: “const” and “let“. These keywords were added to JavaScript a couple of years ago and they declare block-scoped variables.

Declaring a variable with “let” seems to be the same as declaring with “var“:

let d = true;
console.log(d);
// true

Here, we initially gave the new variable “d” the boolean value “true“. And as with “var“, we can change this variable’s value to another value:

d = false;
console.log(d);
// false

We can also declare a variable without an initial value:

let e;
console.log(e);
// undefined

So, we declare a variable that we optionally give a value and that we can change later just as we did with “var“.

The remaining keyword “const” is used to declare a constant:

const pi = 3.14;
console.log(pi);
// 3.14

We declare a variable called “pi” and give it the value “3.14“.

Compared to “var” and “let” we are not able to reassign another value to the variable because it is a constant.

In addition to that, we immediately have to give a “const” variable a value. We cannot declare it without a value.

When to use which variable declaration

We learned different ways to declare variables in JavaScript. So, when should we use which type of declaration?

A general rule of thumb is to always declare variables with the keyword “const” first. And if we think a variable’s value should be able to change and be reassigned, we declare this variable with “let“.

But why not with “var“?

var” and “let” seem to work the same way. However, the scoping behavior of “var” can lead to errors which is why “let” and “const” were created. Thus, it is not necessary to use “var” at all. Any variable declaration can be done with either “const” or “let“.

Comments

We always want to document what our code is doing and why our code is doing what it does. Comments are great for explaining our code and they are mandatory to use in any code project, especially in large ones.

We can insert comments anywhere in our code and that does not change our program in any way. They are just there for making the code easier to understand.

In JavaScript, we have got two types of comments:

  • one-line comments and
  • multi-line comments.

One-line comments start with two slashes:

//This is a one-line comment

As we stated above, comments can be inserted anywhere in our code:

const pi = 3.14; // declare variable "pi" as constant

The comment does not change the code in any way.

Multi-line comments, as the name suggests, extend over several lines.

They can be used to create a comment block where we explain something in more detail. They start like this “/*” and end like this “*/” and anything that stands between that will be treated as a comment:

/*
The following code will
calculate some values and 
assign these values to 
new variables.
*/

Summary

All in all, we learned the basics about the programming language JavaScript in this article. We learned about statements, how to declare variables, and how to apply comments to our code.

For more tutorials about other computer and data science-related topics, check out the Finxter email academy!

Happy Coding!


Related Tutorial: