The blog describes the creation of JavaScript variables . The variables in JavaScript are like containers which helps in sorting the data values.
How to define a JavaScript Variable ?
The below points need to be considered when creating JavaScript variables
- A variable name must start with a letter (a to z or A to Z), underscore( _ ), or dollar( $ ) sign
- Digits can be used after the first letter of the variable name
- A variable name is case sensitive
JavaScript Variable Types
The JavaScript variables can be broadly classified into 2 types
- Local Variables : The local variables are defined within a specific block or function and their scope also remains within the block or function defined.
- Global Variables: The global variables are those variables which are defined outside the block or function so that they can be accessible in any block or function to execute the value at run-time
<script> var length=10; // global variable for length var height=20; // global variable for height function area(){ var area= length * height // local variable to calculate area document.writeln(area); } </script>
ES2015 Keyword let in JavaScript
The JavaScript provides the Function Scope and Global Scope but in 2015 ES2015 introduced 2 new JavaScript keywords – let and const.
The keyword let and keyword const allows to create the Block Scope variables and constants in JavaScript. The below given example clarifies how Block Scope is different from Function Scope and Global Scope.
Global Scope: The variables which are defined outside the function provides global scope due to its accessibility
Function Scope: The local variables which are defined within a function provides Function scope within the function only .
Variable Re-declaration: If the variables defined in the Function Scope are redeclared outside the function with different value, then it allows to update/ override the value for that variable. In the below given example , the local variable and global variables are defined currently and are within their scope but redeclaration of carColor changes the color to “grey”
<script> var carModel ="Toyota" ; // Global Variable declaration var carColor = "Grey"; // local variable value ovrrides function carFeatures(){ var carCylinder = "4"; // local variable / function scope var carAirBags = "2"; // local variable / function scope var carColor = "Red"; // local variable / function scope } // Redeclaring same variable outside function scope, changes carColor values to "Red" </script>
Block Scope provides the solution to the variable redeclaration problem as this might lead to issues if not properly handled. ES2015 provides the keyword let which helps in creating local variables who access remains within the scope of the function.
<script> var carModel ="Toyota" ; // Global Variable declaration var carColor = "Grey"; // consider function carFeatures(){ var carCylinder = "4"; // local variable / function scope var carAirBags = "2"; // local variable / function scope let carColor = "Red"; // local variable / function scope } // carColor remains as "grey" //access global variable </script>
Thus when used var, the variable declared in the Function Scope redeclares the variable value outside the function.
When used keyword let, the variable declared in the Function Scope does not redeclare the variable outside the function
ES2015 Keyword Const in JavaScript
ES2015 Keyword Const does not provide the constant value rather it provides the constant reference to the value which means we cannot change the constant primitive values but it allows to change the constant properties for it.
The below given example is NOT ALLOED as it changes the constant TV Array elements
const tv = {brand:"Samsung", model:"Plasma", color:"Black"}; / Redefinifn the Car elements for the Const Car Object is not allowed tv = {brand:"Samsung", model:"QLED", color:"Grey"};
The below example IS ALLOWED as it adds New element without changing the constant TV array elements
const tv = {"Samsung", "Sony", "TCL"}; car[2] = "Panasonic" // allowed, as it adds the New element wihtout changing the exisitng TV Array elements
The keyword Const can be used to declare the variable or redeclare the variables. The below points need to be considered when using const for declaring variables
Variable Declaration | Scope |
---|---|
Redeclaration or reassignment for var or let variable to const within the same scope ( local or global) | NOT ALLOWED |
Redeclaration or reassignment for const variable within the same scope ( local or global) | NOT ALLOWED |
Redeclaration or reassignment for const variable in another scope | ALLOWED |
3 thoughts on “create variables in JavaScript”
Comments are closed.