JavaScript let keywordIn JavaScript, let is a keyword that is used to declare a block scoped variable. Usually, the var keyword is used to declare a variable in JavaScript which is treated as a normal variable, but the variables declared using the let keyword are block scoped. JavaScript provides three ways to declare a variable: var, const, and let. These keywords deliver different functionality from each other. Var is a traditional method to declare a variable while const and let keyword was introduced later by the ES2015/ES6, which creae block scope variable. Earlier, there were only two types of variable scopes in JavaScript: Global scope and Function scope. Syntax of letHere is the syntax to declare a variable using the let keyword: ExamplesBelow are various examples discussed to help you understand how the let variable works inside and outside the block or function. These are the simple examples to use the variable declared using the let in different scopes. Example 1: Global ScopeHere, you can see that a variable declared in main body or outside the function has global scope. So, it can be accessed from anywhere inside or outside the function. Copy Code Test it NowOutput Outside the function x = 20 Inside the function x = 20 Screenshot Here is the web output for the above program: Example 2: Function ScopeIn this example, you will see that a variable declared inside the function that only has function scope. So, it is not allowed to access outside the function. Copy Code Test it NowOutput Here, you will see that only the first statement that lies inside the function has been printed and second statement has not been displayed. It treated num is undefined outside the function scope. Inside the function num = 15 Screenshot Here is the web output for the above program: Console View See the console output for the above program to know the problem why the second statement does not print. In your browser, click on the three dots and go to the More tool -> Developer tool -> Console, and see the error in console as shown below: UncaughtReferenceError: num is not defined Example 3: Block ScopeIn this example, you will see that a variable declared inside the block cannot be used outside the block because it has block scope. Copy Code Test it NowOutput Here, only the block statement will display the value of the num variable declared using let keyword. Second statement will not display the value of num variable. Inside the function num = 30 Screenshot Here is the web output for the above program: Console View See the console output for the above program to know the problem why the second statement does not print. In your browser, click on the three dots and go to the More tool -> Developer tool -> Console, and see the error in console as shown below: UncaughtReferenceError: num is not defined Example 4: Redeclaring variable in different blocksIn this example, we will a declare variable with the same name in different blocks and display its value. Copy Code Test it NowOutput On executing the above code, this will generate an error because redeclaration is not allowed using let variable. So, it will not display any output on the browser. Screenshot Here is the blank web output for the above program: Console View If you see the console output, this will show the error generated on executing this program. SyntaxError: redeclaration of let x note: Previously declared at line 2, column 5 How let is different from the var keyword?In the below example, you can examine that the variable declared using the let and var keyword have different variable scope and power. The key difference between let and var is their scopes. Var has global scope whereas let is block scope. Consider the below examples to understand the difference: Variable ScopeIn these examples, we will show you the variable scope for the variables declared using both var and let. Var: Global Scope Example Copy Code Test it NowOutput Value of x before the block: undefined Value of x after the block: 28 Screenshot See the web screenshot for the above program: let: Block Scope Example Copy Code Test it NowOutput Initial value of x: 30 Value of x inside the block: 37 Screenshot See the web screenshot for the above program: These above examples will show you how variables have different scopes inside and outside the block when declared using the var and let keyword. Loop ScopeIn these examples, we will show you the variable scope for the variables declared using both var and let. let: Loop Scope Example Copy Code Test it NowOutput Here, you will see that the initial value of i will display because redeclaration is not allowed using the let keyword. Final value of x outside of the loop: 4 Screenshot See the web screenshot for the above program: var: Loop Scope Example Copy Code Test it NowOutput Here, you will see that the updated value of i will display because redeclaration is allowed using var keyword. Final value of x outside of the loop: 10 Screenshot See the web screenshot for the above program: RedeclarationSee the below examples to understand which variable declaration is allowed and which one is not. The variable declaration is allowed anywhere in the program using var. Example 1 Example 2 Example 3 Example 4
Next TopicRandom String Generator using JavaScript
|