Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to create many Javascript variables in a single statement?
We can create many JavaScript variables in a single statement using the var, let, and const keywords that are used for declaring variables in JavaScript. Instead of declaring every variable individually, we can chain many variables together with commas (,) in a single statement. Since JavaScript is a loosely typed language, variables of many data types can be declared in the same sentence as well.
Syntax
var variable1 = value1, variable2 = value2, variable3 = value3;
Here, var is the keyword used for declaring the variables viz: variable1, variable2, variable3 and assigning them the respective values.
Example 1
In the below code snippet, we are going to declare three variables a, b and c in a single statement and assign them values of 3, 9 and 5 respectively.
<!DOCTYPE html> <html> <head> <title>Creating multiple variables in a single statement</title> </head> <body> <div id="result"></div> <script> var a = 3, b = 9, c = 5; document.getElementById("result").innerHTML = "value of a is :" + a + "<br/>value of b is :" + b + "<br/>value of c is :" + c; </script> </body> </html>
But this pattern of declaration is not bound to data of only the same type. We can declare integers, floating point numbers, strings, arrays as well as objects in the same manner.
Example 2
In the below code snippet we are going to create three variables viz: a which is an integer, b which is a string and c which is an array all in the same statement.
<!DOCTYPE html> <html> <head> <title>Creating multiple variables of different data types in a single statement</title> </head> <body> <div id = "result"> </div> <script> var a = 10, b = "name", c = [1,2,3]; document.getElementById("result").innerHTML = "value of a is :" + a + "<br/>value of b is :" + b + "<br/>value of c is :" + c; </script> </body> </html>
Even expressions can be used to initialize boolean variables chained with other data type variables.
Example 3
In the below code snippet we are going to create 4 variables that hold different types of values viz: integer, boolean, and array.
<!DOCTYPE html> <html> <head> <title>Creating multiple variables using expressions in a single statement</title> </head> <body> <div id = "result"> </div> <script> var a = 10, b = (10 > 5) , c = [1,2,3] , d = ("five" < "animal"); document.getElementById("result").innerHTML = "value of a is :" + a + "<br/>value of b is :" + b + "<br/>value of c is :" + c + "<br/>value of d is :" + d; </script> </body> </html>
Similarly, other keywords like let and const can be used to declare multiple locally scoped variables in a single statement.
Note − however that const variables cannot be modified once initialized.
Example 4
In the below code snippet, an error will be thrown because we are trying to modify a const variable.
<!DOCTYPE html> <html> <head> <title>Creating multiple objects in a single statement</title> </head> <body> <div id = "result"> </div> <script> const a = 5, b = 9; document.getElementById("result").innerHTML = "value of a is " + a + "<br/>value of b is " + b; // the below line will generate an error. a = 10; // this line does not execute document.getElementById("result").innerHTML = "value of a is " + a + "<br/>value of b is " + b; </script> </body> </html>
One such example of using const is to declare objects. Multiple objects can be declared in the same statement as well.
Example 5
In the below code snippet, we are creating two objects person1 and person2 with properties name and age.
Note however that the elements of every object don't have to be the same.
<!DOCTYPE html> <html> <head> <title>Creating multiple objects in a single statement</title> </head> <body> <div id = "result"> </div> <script> const person1 = {name : "jhon",age : 15}, person2 = {name: "doe", age:21}; var output = document.getElementById("result"); output.innerHTML += "First person has name " + person1.name + "<br/>First person has age " + person1.age + "<br/>"; output.innerHTML += "<br/>Second person has name " + person2.name + "<br/>Second person has age " + person2.age; </script> </body> </html>
Conclusion
Both types of the declaration have their own use cases. Declaring variables individually offers us the flexibility to quickly change the scope of variables by changing the keyword used to declare it while declaring many variables in the same sentence reduces redundant code.
6K+ Views
