ES6中的let、const

╰半夏微凉° 2021-07-25 17:23 435阅读 0赞

let和const是ES6中新增声明变量的关键字,

# var #

1.  可以重复声明。声明时可以不用赋值，默认为undefined
2.  存在变量提升
3.  有函数作用域，但没有块级作用域（因为块级作用域在ES6才出来）

# let #

1.  不能重复声明。声明时可以不用赋值，默认为undefined
2.  变量-可以修改
3.  不存在变量提升
4.  有块级作用域

# const #

1.  不能重复声明。声明时必须赋值
2.  变量-不能修改（声明的简单数据类型相当于常量，如声明π。声明的复杂数据类型只是引用的地址不可更改，但是堆里面的对象的具体的值是可以更改的）
3.  有块级作用域

# 实验如下： #

# var #

### 可以重复声明。声明时可以不用赋值，默认为undefined ###

![20201031123545473.png][]

### 存在变量提升 ###

![20201031123348707.png][] 这个就相当于：![20201031123648473.png][]

### 有函数作用域，但没有块级作用域（因为块级作用域在ES6才出来） ###

在ES6 之前, JavaScript中有全局作用域和函数作用域，而ES6则新增了一个作用域: **块级作用域**

函数作用域：在一个函数内利用var声明一个变量，则这个变量只在这个函数内有效。相当于私有变量  
块级作用域：如if () \{\}，switch () \{\}，for () \{\}，while () \{\}，try () catch (err) \{\}， 单大括号\{\}。**注意: **对象的大括号内不是一个块级                            作用域, 因为它里面不能直接声明变量;

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70][]

由于var没有块级作用域，因此它可以无视块级作用域，可以直接访问块级作用域中声明的变量

![20201031124744593.png][]![2020103112463297.png][]

# let #

### 不能重复声明。声明时可以不用赋值，默认为undefined ###

![20201031124040313.png][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 1][]

### 变量-可以修改 ###

![2020103112423123.png][]

### 不存在变量提升 ###

![20201031124312594.png][]

### 有块级作用域 ###

![20201031124434330.png][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 2][]

# const #

### 不能重复声明。声明时必须赋值 ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 3][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 4][]

### 变量-不能修改（声明的简单数据类型相当于常量，如声明π。声明的复杂数据类型只是引用的地址不可更改，但是堆里面的对象的具体的值是可以更改的） ###

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 5][]

用const定义的常量只要是引用类型数据，改变这个引用类型数据的结构或属性，都是允许的。如下：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 6][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 7][]

其实 const 其实保证的不是变量的值不变，而是保证变量指向的内存地址所保存的数据不允许改动。此时，你可能已经想到，简单类型和复合类型保存值的方式是不同的。是的，对于简单类型（数值 number、字符串 string 、布尔值 boolean）,值就保存在变量指向的那个内存地址，因此 const 声明的简单类型变量等同于常量。而复杂类型（对象 object，数组 array，函数 function），变量指向的内存地址其实是保存了一个指向实际数据的指针，所以 const 只能保证指针是固定的，至于指针指向的数据结构变不变就无法控制了，所以使用 const 声明复杂类型对象时要慎重。

### 有块级作用域 ###

![20201031125833238.png][]

[20201031123545473.png]: /images/20210725/4c58b5a272144a0fab45c315f4f25c4a.png
[20201031123348707.png]: https://img-blog.csdnimg.cn/20201031123348707.png
[20201031123648473.png]: /images/20210725/97b06149a31c489f9331fe2067c1da2e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70]: /images/20210725/9e531633f2c748d6b44fdc960ba1c783.png
[20201031124744593.png]: https://img-blog.csdnimg.cn/20201031124744593.png
[2020103112463297.png]: /images/20210725/805a6b4d6b3a4f3e83ea922a8d69f0db.png
[20201031124040313.png]: https://img-blog.csdnimg.cn/20201031124040313.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 1]: /images/20210725/8a42dbadb22045b2ab56c1d3f9273ee8.png
[2020103112423123.png]: /images/20210725/7a148cb368a74f3c99864526aa6bb0ca.png
[20201031124312594.png]: /images/20210725/4a44305410a94265835891e26a43f27b.png
[20201031124434330.png]: https://img-blog.csdnimg.cn/20201031124434330.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 2]: /images/20210725/b6da6a58866746c38e10c6367fff64b6.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20201031125107916.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 4]: /images/20210725/aa28c62655a649e29e4cdc8b69667c0a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 5]: /images/20210725/02324c01d6eb4c33a1eb95ac6e6f0597.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 6]: https://img-blog.csdnimg.cn/20201031125507272.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQwMzIzMjU2_size_16_color_FFFFFF_t_70 7]: /images/20210725/6064c3f49ed14dafadaa39e075712fbf.png
[20201031125833238.png]: /images/20210725/a004e33abf0c463380fd695a03a53f73.png