JavaScript Statements
Learn via video course
Statements in Javascript
Overview
A computer program is a list of instructions to be executed by a computer. In a programming language, these programming instructions are called statements. A JavaScript program is a list of programming statements. JavaScript statements are composed of: Values, Operators, Expressions, Keywords, and Comments.
Scope
- This article extensively discusses Javascript statements.
- We'll learn how to declare statements in javascript.
- This article also covers the categorized division of javascript statements.
Introduction
JavaScript statements are the set of keywords that commands the browser to perform the desired action. Javascript statements are used to control the program flow. A Javascript program is made up of statements. The Javascript statements are separated by semicolons(;).
What are Statements
JavaScript is a lightweight language that is not compiled but is translated by the browser.
Javascript statements are commands that contain the JavaScript code, which is translated by the browser line by line. The Javascript statements are made up of expressions.
An expression is a code component that can be evaluated to a value. An expression can be present anywhere in the program. Arithmetic expressions, string expressions, logical expressions are some common examples of expressions in Javascript.
Javascript statements are used to control its program flow, thus, they are also known as control statements in Javascript. Javascript statements are designed to work independently of any Javascript object. This property of Javascript allows us to use a statement whether we are working with the document object, the window object, the history object, or some other object.
Declarations of Statements
Javascript statements are declared by their syntax. The keywords are arranged in a syntactical manner to be read by the translator. The Javascript statements are separated by semicolons (;).
A Javascript statement can be written in multiple lines as well as a single line can have multiple Javascript statements.
Note: Javascript provides several types of statements like block, break, and return to perform different operations. In the further sections, we will go through each of the statements with an example.
Takeaway:
- Javascript statements are declared by their syntax followed by a semicolon (;)
- We can write multiple Javascript statements in a single line as well as a single Javascript statement can be written in multiple lines.
Statements and Declarations by Category
Javascript statements are broadly divided into the following five categories:
Note: It's completely fine if you couldn't understand a statement completely. Some sections in the article are a little above beginner's level and could be difficult to grasp at once, although they will be more clear once they learn more. (refer to dedicated articles on our website for such topics).
Control Flow
Control flow refers to the order in which the instructions would be executed in the program.
Block
The block statement in Javascript is used to group a set of statements. The block statement in Javascript is declared by a pair of braces (or curly brackets).
Declaration:
Break
The break statement in Javascript is used to stop the flow of a program. The break statement is often used with loops (loops are discussed later in the article) to terminate their execution once a particular condition is met.
Declaration:
Continue
The continue statement in Javascript is often used to skip the iteration in a loop. When the program encounters the continue statement while executing the loop, it skips the rest of the statements in the block and jumps to the next iteration.
Declaration:
Empty
An empty statement in Javascript is used to layout no statement, i.e., it indicates that no statement will be executed. It is represented by a semicolon.
Declaration
If...else
The if..else statements in Javascript are conditional statements that are used to execute the if code block when the specified condition holds true otherwise, the else block gets executed.
Declaration:
Switch
The switch statement in Javascript is used to compare an expression with one or more cases. The switch statement executes the statement associated with the case that holds true for the given expression.
Declaration:
Throw
The throw statement in Javascript is used to throw customized errors. The program, upon encountering the throw statement, ceases the program execution and jumps to the try-catch block(If the try-catch block is not present, the program terminates).
Declaration:
try...catch
The try..catch statement in Javascript is used to execute statements with possibilities of error. It is an error-handling approach in Javascript. The try statement defines the code block to be executed, and the catch statement is used to handle the error during the execution of the code block.
Declarations
The declaration statement in Javascript is used to assign a value to a variable name. There are 3 ways to write declaration statements in Javascript:
Var
The Javascript statement var is used to declare a variable. The var statement declares a variable globally, and the variable values can be updated or deleted.
Note: The var statement should be used carefully because if a variable is defined in a loop or in an if statement using var, it can be accessed outside the block and accidentally redefined which may lead to a buggy program.
Declaration:
Let
The Javascript statement let is also used to declare a variable. It was introduced to tackle the buggy nature of the var. The let statement declares a variable in the block scope and the variable values can be updated or deleted.
Declaration:
Const
The Javascript statement const is used to declare a constant value. The const statement declares a value in the block scope and the values can not be updated or deleted.
Declaration:
Functions and Classes
Function
The Javascript statement function is used to define a block of code to perform specific tasks. The function statement is often defined with parameters, though the choice of using parameters is optional.
Declaration:
Function
The Javascript statement Generator Functions are special functions that can be paused to return a value. The generator functions can be exited and later re-entered. These are used to write iterators more effectively.
Note: Iterator in JavaScript is an object that is used to define a sequence and could return value a sequence of values upon its termination
Declaration:
Async function
The Javascript async function aids us to write promises, and it makes sure that the promise is returned. In case of any error, unlike regular functions that terminate the execution, the async function automatically gets wrapped in a promise which is resolved with its value.
The Javascript statement async function is used to declare an async function. The async function statement is often defined with parameters, though the choice of using parameter is optional.
Declaration:
return
The Javascript statement return is used to stop the execution of a function and return a specified value.
The return is important to get a response from the function. For e.g., imagine we have a function to add two numbers. The function would take two numbers (as parameters) and store the sum in a third variable. Although the sum operation is performed, to get the sum, we need to return that variable.
Declaration:
Class
The Javascript statement class is used to declare a class in javascript.
class in javascript is a template used to create an object. They act as a blueprint with methods and parameters to create multiple objects of the same kind.
Declaration:
Iterations
Iteration in Javascript is basically the process of going through the elements of a container. It is mostly used when there is a need to access the elements of a container (e.g. an array).
do...while
The Javascript statement do...while is used to create a loop that first executes a particular statement (the do block). Once the do-block is executed, it jumps to the while block. If the condition of the while block is true, is again executes the do-block, otherwise, the loop terminates.
Declaration:
For
The Javascript statement for creates a loop that consists of three expressions, the initialization, the condition, and the final-expression. The loop stops executing when the condition becomes false.
Declaration:
for...in
The Javascript statement for...in is used to loop through the enumerable properties of an object that are keyed by string. The iteration over enumerable objects happens in random order.
Declaration:
for...of
The Javascript statement for...of is used to adjure a custom iteration with the statements to be executed. The for...of statement can be used to loop through the values of iterable objects. It lets us iterate over data structures like arrays, array-like objects etc.
Declaration:
For await...of
The javascript statement for await...of is used to adjure a custom iteration with the statements to be executed. The for await...of statement can be used to loop through async iterable objects as well as through sync iterable objects.
Declaration:
While
The Javascript statement while is used to create a loop that executes a code block till the condition passed to it holds true. If the condition is false, the loop terminates.
Declaration:
Others
Debugger
The javascript statement debugger is used to trigger the debugging functionalities available in the program. In case there are no debugging functionalities present, this statement remains inadequate.
Note: Debugging is the process of finding and eliminating bugs and possible errors in order to achieve an error-free program.
Declaration:
Export
A module in JavaScript is a file containing one or more units of code. Modules are mainly used to group functions or object definitions together in order to make the code more structured and manageable.
The Javascript statement export is used to export objects, variables, or functions so that is can be accessed by external modules or other scripts.
Declaration:
Import
The Javascript statement import is used to import the variables, functions, or objects that are exported from a module or other scripts.
Declaration:
Import.meta
The Javascript statement import.meta provides the information about the environment in which the module runs. It is used to expose context-specific metadata to a JavaScript module.
Declaration:
Label
The Javascript statement label is an identifier followed by a colon (:), often applied to a code block. It is used to define a statement with an identifier which can be used along with continue or break statement.
Declaration:
With
The Javascript statement with is used to extend the scope of an object. When the javascript statements are being evaluated, the with statement adds the given statement to the head of the scope chain.
The with statement is used to specify the default object, so we can use the properties inside of that object without the dot notation.
Note: The with statement is not recommended, as it may be the source of confusing bugs and compatibility issues.
Declaration:
Takeaway:
- The javascript statements are broadly divided into five categories: control flow, declaration, functions and classes, iteration and others.
Browser Compatibility
Javascript Statements | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
async function | 55 | 15 | 52 | n/a | 42 | 10.1 |
Block | 1 | 12 | 1 | 11 | 3 | 1 |
break | 1 | 12 | 1 | 3 | 4 | 1 |
class | 49 | 13 | 45 | n/a | 36 | 10.1 |
const | 21 | 12 | 36 | 11 | 9 | 5.1 |
continue | 1 | 12 | 1 | 3 | 4 | 1 |
debugger | 5 | 12 | 1 | 4 | 10 | 5 |
do while | 1 | 12 | 1 | 4 | 4 | 1 |
empty statement | 3 | 12 | 1 | 3 | 3 | 5 |
export | 61 | 16 | 60 | n/a | 48 | 10.1 |
for | 1 | 12 | 1 | 3 | 3 | 1 |
for..in | 63 | 79 | 57 | n/a | 50 | 11 |
for..of | 1 | 12 | 1 | 6 | 2 | 1 |
if...else | 38 | 12 | 13 | n/a | 25 | 7 |
import | 61 | 16 | 60 | n/a | 48 | 10.1 |
switch | 1 | 12 | 1 | 4 | 4 | 1 |
-
The columns have the web browser names while the rows have the javascript statements.
-
The version of the browser mentioned means that it is the minimum version of that browser required to support that tag/attribute.
-
n/a means that the browser doesn't support the statement.
Conclusion
- Javascript statements are commands that tell the browser what action to perform.
- Javascript statements can be used independently of any Javascript object.
- Javascript statements are separated by semicolons(;)
- Multiple javascript statements can be written in a single line.
- A javascript statement can be written in multiple lines.