JavaScript中的let与var

时间:2022-11-26 14:49:32

       先来讲解一下JavaScript中的作用域

JavaScript中的作用域一般为函数作用域,在有let声明时会块级域。

语法

?
1
let variable1 = value1

参数
variable1
要声明的变量的名称。
value1
赋给变量的初始值。

备注
使用 let 语句声明一个变量,该变量的范围限于声明它的块中。  可以在声明变量时为变量赋值,也可以稍后在脚本中给变量赋值。  
使用 let 声明的变量,在声明前无法使用,否则将会导致错误。
如果未在 let 语句中初始化您的变量,则将自动为其分配 JavaScript 值 undefined。

示例:

?
1
2
3
4
5
6
7
8
9
10
11
12
var l = 10;
{
   let l = 2;
   // At this point, l = 2.
}
// At this point, l = 10.
 
// Additional ways to declare a variable using let.
let index;
let name = "Thomas Jefferson" ;
let answer = 42, counter, numpages = 10;
let myarray = new Array();

块级作用域

?
1
2
3
4
5
for ( var i = 0; i < 10; i++){}
console.log(i); //10
 
for (let j = 0; j < 10; j++){}
console.log(j); //"ReferenceError: j is not defined

不存在变量提升

?
1
2
3
4
5
console.log(a); // 输出undefined
console.log(b); // 报错ReferenceError
console.log(c); // 报错ReferenceError
var a = 2;
let b = 2;

注意区别undefined和ReferenceError

暂时性死区(TDZ)
只要进入当前块级作用域,所使用的变量已经存在了,但在声明之前都属于死区,不可进行操作。
注意: typeof不再是100%安全的操作

?
1
2
3
typeof x; // ReferenceError
typeof y // undefined
let x;

不允许重复声明

?
1
2
3
4
5
let x = 1;
let x; // "SyntaxError: Identifier 'x' has already been declared
 
var y = 2;
var y = 3; // y = 3

块级作用域

?
1
2
3
4
5
6
7
8
9
10
11
// 匿名函数写法
( function () {
  var tmp = ...;
  ...
}());
 
// 块级作用域写法
{
  let tmp = ...;
  ...
}

ES5的严格模式规定,函数只能在顶层作用域和函数内声明,其他情况(比如if代码块、循环代码块)的声明都会报错。

?
1
2
3
4
5
// ES5
'use strict' ;
if ( true ) {
  function f() {} // 报错
}

ES6由于引入了块级作用域,这种情况可以理解成函数在块级作用域内声明,因此不报错,但是构成区块的大括号不能少

?
1
2
3
4
// 报错
'use strict' ;
if ( true )
  function f() {}

声明的全局变量不再是window的属性

?
1
2
3
4
5
6
"use strict" ;
var a = 1;
console.log(window.a) // 1
 
let b = 1;
console.log(window.b) // undefined