Basic Syntax of JavaScript

In the previous article, I discussed what JavaScript and how to set up the environment. So today we'll be discussing the basic syntax and variables.

Syntax defines the set of rules for writing programs. Every language specification defines its own syntax.

A javascript program can be composed of

• Variables: Represents a named memory block that can store values for the program.

• Literals: Represents constant/fixed values.

• Operators: Symbols that define how the operands will be processed.

• Keywords: Words that have a special meaning in the context of a language.

The following table lists some keywords in JavaScript. Some commonly used keywords are listed in the following table.

• Modules: Represents code blocks that can be reused across different programs/scripts.

• Comments: Used to improve code readability. These are ignored by the JavaScript engine.

• Identifiers: These are the names given to elements in a program like variables, functions, etc. The rules of identifiers are -

i. Identifiers can include both characters and digits. However, the identifier cannot begin with a digit.

ii. Identifiers cannot include special symbols except for underscore (_) or a dollar sign ($).

iii. Identifiers cannot be keywords. They must be unique.

iv. Identifiers are case sensitive. Identifiers cannot contain spaces.

Examples of valid identifiers:

firstNamefirst_namenum1$result

Examples of invalid identifiers:

Var#first namefirst-name1number

Whitespace and Line Breaks

ES6 ignores spaces, tabs, and newlines that appear in programs. You can use spaces, tabs and newlines freely in your program and you are free to format and indent your programs in a neat and consistent way that makes the code easy to read and understand.

JavaScript is Case-sensitive.

JavaScript is case-sensitive. This means that javascript differentiates between the uppercase and the lowercase characters.

Semicolons are optional.

Each line of instruction is called a statement. Semicolons are optional.

Example:

console.log("hello world")

console.log("We are learning ES6")

A single line can contain multiple statements. However, these statements must be separated by a semicolon.

Comments in JavaScript

Comments are a way to improve the readability of a program. Comments can be used to include additional information about a program like the author of the code, hints about a function/construct, etc. Comments are ignored by the compiler.

JavaScript supports the following types of comments -

i. Single-line comments (//) - Any text between a // and the end of a line is treated as a comment.

ii. Multi-line comments (/**/) - These comments may span multiple lines.

Example:

//this is single line comment
/* this is a multi-line comment
*/

Your First JavaScript Code Let us start with the traditional "Hello World" example.

var message = "Hello World"
console.log(message)

The program can be analyzed as -

• Line 1 declares a variable by the name message. Variables are a mechanism to store values in a program.

• Line 2 prints the variable's value to the prompt. Here, the console refers to the terminal window. The function log() is used to display the text on the screen.

Executing the code

We're gonna use node.js to execute our code.

1. Step 1: Save the file as Test.js

2. Step 2: Right click the Test.js file under the working files option in the project explorer of the VS code.

3. Step 3: Select Open in command prompt option.

4. Step 4: Type the following command in Node's terminal window.

node Test.js

The following output is displayed on successful execution of the file.

Hello World

Node.Js and JS/ES6

ES6 features are classified into three groups -

• For Shipping: These are features that V8 considers stable.

• Staged Features: These are almost completed features but not considered stable by the V8 team.

• In Progress: These features should be used only for testing purposes.

The first category of features is fully supported and turned on by default by node. Staged features require a runtime -- harmony flag to execute.

You can find a list of component specific CLI flags for Node.js here

The Strict Mode

The fifth edition of the ECMAScript specification introduced the strict mode. The strict mode imposes a layer of constraint on JavaScript. It makes several changes to normal JavaScript semantics. The code can be transitioned to work in the strict mode by including the following-

// Whole-script strict mode syntax "use strict";
v = "Hi! I'm a strict mode script!";
//ERROR: Variable v is not declared

In the above snippet, any code outside the function will run in the non-strict mode. All statements within the function will be executed in the Strict Mode.

ES6 and hoisting

The JavaScript engine, by default, moves declarations to the top. This feature is termed as hoisting. This feature applies to variables and functions. Hoisting allows JavaScript to use a component before it has been declared. However, then concept of hoisting does not apply to scripts that run in the Strict Mode.

Variable Hoisting and Function Hoisting are explained in the subsequent chapters/articles.