ECMAScript6 block-level scope and new variable Declaration (let), ecmascript6let

ECMAScript6 block-level scope and new variable Declaration (let), ecmascript6let

Many languages have block-level scopes, but JS does not. It uses var to declare variables and uses functions to divide scopes. the braces "{}" cannot limit the scope of var. Variables declared with var have the effect of variable increase (declaration hoisting.

ES6 adds a let, which can be declared in {}, if,. The usage is the same as var, but the scope is limited to the block level. The variables declared by let do not have variables to be promoted.

Example 1: block-level scope if

Function getVal (boo) {if (boo) {var val = 'red '//... return val} else {// here you can access val return null} // here you can also access val}

The variable val is declared in the if block, but can be accessed outside the else block and if.

Change var to let.

Function getVal (boo) {if (boo) {let val = 'red '//... return val} else {// there is no access to val return null} // there is no access to val}

Example 2: block-level scope

Function func (arr) {for (var I = 0; I <arr. length; I ++) {// I...} // You can also access I} here}

Variable I is declared in the for block, but can be accessed outside the for block.

If you change var to let, you cannot access

Function func (arr) {for (let I = 0; I <arr. length; I ++) {// I...} // I cannot be accessed here}

Example 3: Variable escalation (use first and then declare)

Function func () {// val is used first and then declared. alert (val) // undefined var val;} is not reported ;}

The variable val is used first and then declared, and the output is undefined. No error is reported.

If you change var to let, an error is returned.

Function func () {// val is used first and then declared. The syntax error alert (val) let val ;}

Example 4: Variable escalation (first judgment and then Declaration)

function func() {  if (typeof val == 'undefined') {    // ...  }  var val = ''}

When using typeof to judge, you can also use the preceding var statement

However, if you replace var WITH let, a syntax error is reported.

function func() {  if (typeof val == 'undefined') {    // ...  }  let val = '';}

ES6 stipulates that, if the code block contains let, this block has formed a closed scope from the very beginning. If you use it before the declaration, an error is reported. That is, variables used before let Declaration are unavailable in the code block. The syntax is called temporal dead zone (TDZ. Of course, TDZ does not appear in the ES specification. It is only used for image description.

Let precautions

1. repeated declarations cannot be made.

// The var and let statements are repeated. var name = 'jack'; let name = 'john'; // let age = 24; let age = 30;

Syntax Error reported during execution

2. With let, the anonymous function can be removed after self-execution.

// Write an anonymous function () {var jQuery = function (){};//... window. $ = jQuery}) (); // block-level scope syntax {let jQuery = function (){};//... window. $ = jQuery ;}

The above is all the content of this article. I hope you will like it.