ES6 let命令

2020-09-29  本文已影响0人  暖A暖

ES6 中新增了 let 命令,可以用于声明变量。下面我们就一起来看一下 let 命令的使用。

使用let声明变量

let 命令是 ES6 中新增的用于声明变量的一个命令,声明变量时的用法和 JavaScript 中的 var 类似。

示例:

例如下面我们使用 let 命令来声明变量:

let a = 10;
let b = 20;
let c = 30;

let 声明的变量只在代码块内有效

let 命令的使用虽然和 var 类似,但是两者还是有区别的,例如使用 let 声明的变量,只在 let 所在的代码块内有效。这是什么意思呢,下面我们通过一个例子来讲解一下。

示例:

例如我们在一段代码块中同时使用 letvar 来声明一个变量,然后在代码块外使用这个变量:

{
    var a = 10;
    let b = 20;
}
console.log(a); 
console.log(b);

当我们我们执行这段代码时,输出结果会报错,下面为错误提示:

ReferenceError: b is not defined

这个错误告诉我们,变量 b 没有被声明,但是我们明明在 {} 中声明了变量 b ,这表示 let 声明的变量只在它所在的代码块有效,在代码块外使用变量 b 会报错。

let不允许重复声明变量

let 命令和 var 命令还有一个不同就是,let 命令只能声明同一个变量一次,而 var 可以声明一个变量多次。

示例:

例如我们使用 var 声明变量 a 两次:

var a = 1;
var a = 2;
console.log(a);

执行代码后输出结果为 “2”,这表示当声明一个变量多次时,后面会覆盖前面的。

接着我们再试一下使用 let 声明变量 a 两次:

let a = 1;
let a = 2;

当执行代码时会输出如下所示错误提示:

SyntaxError:Identifier 'a' has already been declared

其中 SyntaxError 表示这个一个语法错误,告诉我们变量 a 已经被声明,不能再次被声明。

let不支持变量提升

let 不存在变量提升的现象,而 var 命令会变量提升。变量提升是什么意思呢,就是变量可以在声明之前使用,值为 undefined

示例:

例如我们先使用变量 v,再通过 var 声明这个变量,执行代码后会输出 undefined

console.log(v);
var v = 100;

而如果先使用变量 l,再通过 let 命令声明这个变量:

console.log(l);
let l = 100;

当执行代码后会报错,报错内容如下所示:

ReferenceError: Cannot access 'l' before initialization

这表示通过 let 声明的变量,在被声明之前是不允许使用的,这就是说不存在变量提升的现象。

暂时性死区

当一个块级作用域内存在 let 命令时,它所声明的变量就“绑定”(binding)了这个区域,不再受外部的影响。

示例:

例如下面这段代码:

var a = 10;  // 声明全局变量a

if (true) {
  a = 20;  
  let a;     // 在代码块中声明局部变量a,此时变量 a 绑定了这个代码块
}

执行代码后会报如下所示:

ReferenceError: Cannot access 'a' before initialization

这段代码表示,如果我们在一个代码块中使用 let 声明一个变量,那么就形成了封闭作用域,就形成了封闭作用域,既然在之前声明了全局变量也一样。

所以要注意,如果使用 let 命令在代码块内声明变量,那么在声明变量之前,该变量都是不可用的。这在语法上称为 “暂时性死区”。

链接:https://www.9xkd.com/

上一篇下一篇

猜你喜欢

热点阅读