Literals and Loops in JavaScript

Literals and Loops are the integral parts of the JavaScript Language so they become very important to know as they are the building blocks of JavaScript. I will be explaining them step by step with very simple language as I am learning in my JavaScript course here in this institute.

Let’s start with Literals in JavaScript without wasting the time.

What are the Literals in JavaScript?

We use Literals in JavaScript to represent the values. There are some fixed values that we need to describe in our script. Here are many types of Literals in JavaScript:

Types of Literals

• Array Literal
• Object Literal
• Boolean Literal
• String Literal
• Integer Literal
• Floating-point Literal

I want to make this blog very practical as my instructor told me to do so. I will be going to discuss first two literals only because other ones are easy to understand and self-explanatory.

Array Literal

An Array Literal can be described as a list of zero or more expressions, and each of those represents an Array element enclosed in square brackets []. By using array literal, we can create an array and is initialized with the specified values as its elements. Its length is set as number of arguments passed. Array Literals can also be called as Array Object.

Syntax

var pens = [‘Finegrip’, ‘Cello’, ‘Octane’];

Features of Array Literals:

• Spacing and line breaks are not considered important in JavaScript.
• An Array object allows us to store multiple values to store in a single variable.
• Arrays use numbers to access its elements in JavaScript.
• We do not need to specify all elements in the Array Literal, if we put two commas in a row an undefined array is created.

Object Literals

An object literal is a list of property names and associated values separated by commas and enclosed by a pair of curly braces {}.

Syntax

var student = {
     first-name : “Sakshi”,
     last-name : “Bansal”,
     roll-no : 15
}

Features of Object Literals

• A colon is placed between property name and value.
• We cannot use object literal at the beginning of the block.
• Object property name can be any string along with empty string.

Loops in JavaScript

Loops offer us a quick and easy way to access something repeatedly. Loops help us in executing the same code for number of times. If you didn’t get what I said, please wait I will explain with few examples too to clear my point below here.

Types of Loops

There are many kinds of loops but they all do the same thing that is repetition of some action for numbers of times.

Note: all the loops are although solve the same purpose but they are little different in various ways. You will know them when you will be using them.

• for…loop – it loops the block of code for number of times
• for…in – it loops the properties of an object and array.
• while…loop – it loops a block of code when a specified condition is true.
• do…while – it also loops a block of code while a specified condition is true.
• for…of – it loops the properties of an array.

For Loop

For Loop is often used when we want to create a loop. A for loop continues until a specified condition evaluates to false.

Syntax

The following is the syntax of for loop:

for (statement1, statement2, statement3) {
     //code to be executed
}

Here, Statement1 is executed before the loop is started.

Statement2 defines the condition to run the loop.

Then, Statement3 is executed every time after the loop is executed.

Example of for…loop

for (i = 0; I < 5; i++ ) {
     console.log(“the number is ” + i );
}

For-in Loop

In JavaScript For-in loop is executed through the properties of an object.

Syntax

for (variable name in object ) {
     statement or code to be executed
}

In each step one property is assigned to variable name from object till the last property of the object is executed.

Example of for…in loop

var person = { fname : “Sunita”, lname : “Sharma”, age :23 };
var text = “”;
var x;
for (x in person) { 
   console.log(person[x]); 
}

While Loop

While loop is executed till a specified condition is true.

Syntax

while ( condition ) {
     Code to be executed
}

Example of while loop

while ( i < 10 ) {
     console.log( “The number is ” + i) ;
     i++;
}

The code in the loop will run again and again till the variable (i) is less than 10.

Do While Loop

The Do-While loop is as same as the While loop except that the condition is checked at the end of the loop.

Syntax

do {
    statement to be executed; 
} while ( expression );

Example of do…while loop

do {
     console.log( “The number is ” +i) ;
     i++;
}
while ( i < 10 );

One thing should be kept in mind that we should not forget to increase the variable in the condition otherwise the loop will not end its course.

Note:

• There is only one loop i.e. for..in loop which can be applied on object literal only.
• For..in and for..of both loops work on array as others are working above.

Loops and literals are the most important part in the advanced JavaScript learning those always work together because if you use array when you want to store multiple values and then you feel the need of loops to pick dynamically them. There are thousands of assignments which can be developed using their combination in websites and web applications user interfaces using JavaScript.

I Hope! my small effort help you in understanding literals and loops in JavaScript. Read more JavaScript Blogs and please do share and leave your questions and comments in below given comment area.

Thanks