ES6入门教程笔记(2)-let、const和var的区别

矫情吗；* 2022-03-27 13:58 169阅读 0赞

## 1 let命令 ##

ES6新增了let命令，用来声明变量。它的用法和var类似，但有以下几点区别：

*  let声明的变量，只在所在的代码块内有效。
 *  let声明的变量，一定要在声明后才能使用，否则报错。
 *  不允许在相同作用域内，重复声明同一个变量。

## 2 块级作用域 ##

`ES5`只有全局作用域和函数作用域，没有块级作用域。

`let`实际上新增了块级作用域的概念，块作用域由 \{ \} 包括，`if`语句和`for`语句里面的\{ \}也属于块作用域。

function f1() {
        let n = 3;
        if (true) {
            let n = 100;
            console.log(n); // 100
        }
        console.log(n); // 3
    }

## 3 const命令 ##

`const`的用法和作用域和`let`一样，但是`const`用来声明一个只读的常量，而且在声明时就必须立即初始化，不能留到后面再赋值。

const PI = 3.14159;
    PI // 3.14159
    
    PI = 10; // TypeError

const实际上保证的，只是变量指向的内存地址不能改动。

对于简单类型的数据（数值、字符串），值就保存在那个内存地址，因此等同于常量。但对于复合类型的数据（对象和数组），变量保存的只是一个指向实际数据的指针，这个指针保证固定不变，但指针指向的数据内存是不是可以改变，就不能控制了。

const foo = {};
    
    // 成功添加一个属性
    foo.prop = 123;
    foo.prop // 123
    
    // 指向另一个对象，就会报错
    foo = {}; // TypeError

#### ES6声明变量的六种方法 ####

ES5 只有两种声明变量的方法：`var`命令和`function`命令。

ES6 除了添加`let`和`const`命令，还有另外两种声明变量的方法：`import`命令和`class`命令。所以，ES6 一共有 6 种声明变量的方法。

## 4 顶层对象的属性 ##

顶层对象，在浏览器环境指的是window对象，在 Node 指的是global对象。ES5 之中，顶层对象的属性与全局变量是等价的。

windows.a = 1;
    a // 1
    
    a = 2; 
    window.a // 2

ES6 为了改变这一点，一方面规定，为了保持兼容性，var命令和function命令声明的全局变量，依旧是顶层对象的属性；另一方面规定，let、const、class命令声明的全局变量，不属于顶层对象的属性。

也就是说，从 ES6 开始，全局变量将逐步与顶层对象的属性脱钩。

var a = 1;
    window.a // 1
    
    let b = 1;
    window.b // undefined

*注：本文原始内容来自 [ES6标准入门][ES6]，有修改。*

[ES6]: http://es6.ruanyifeng.com/

发表评论取消回复

表情：

评论列表（有 0 条评论，169人围观）

还没有评论，来说两句吧...

相关阅读

相关 ES6中let、const和var的区别

一，var定义的变量，作用域是整个封闭函数，是全域的；let定义的变量，作用域是在块级或者字块中；二，变量提升：不论通过var声明的变量处于当前作用于的第几行，都会提升到作

╰+哭是因爲堅強的太久メ/ 2023年03月04日 11:23/ 0 赞/ 16 阅读

相关 ES6（2）：关于 let、var、const，三者区别

一、`var`声明的变量会挂载在window上，而`let`和`const`声明的变量不会 var a = 521; console.log(a,wind

喜欢ヅ旅行/ 2022年12月08日 12:53/ 0 赞/ 130 阅读

相关 [ES6]var、let、const的区别

1.var 声明的变量属于函数作用域，let 和 const 声明的变量属于块级作用域； 2.var 存在变量提升现象，而 let 和 const 没有此类现象； 3.

迈不过友情╰/ 2022年12月07日 15:05/ 0 赞/ 190 阅读

相关 ES6入门教程

E6入门教程 let和const命令 let命令块级作用域 const命令顶层对象的属性 g

左手的ㄟ右手/ 2022年11月04日 01:51/ 0 赞/ 253 阅读

相关 es6中的let 和 var 的区别

好久没有更新博客了，![哭][cry.gif] 最近公司赶项目，天天熬夜加班......... 今天公司里一个小伙伴，偶然间提到了ES6中的let 和 var 的区

喜欢ヅ旅行/ 2022年06月02日 01:15/ 0 赞/ 247 阅读

相关 ES6笔记-let和var的区别

let基本用法 ES6新增了let命令，用来声明变量，用法类似于var，但它所声明的变量，只在let命令所在的代码块内有效。 { let a =

清疚/ 2022年04月22日 06:18/ 0 赞/ 264 阅读

相关 ES6入门教程笔记(1)-ECMAScript6简介

ECMAScript 6.0（简称`ES6`）是JavaScript语言的下一代标准，于2015年6月正式发布。它的目标，是使JavaScript语言可以用来编写复杂的大型应用

迈不过友情╰/ 2022年03月28日 07:40/ 0 赞/ 298 阅读

相关 ES6入门教程笔记(2)-let、const和var的区别

1 let命令 ES6新增了let命令，用来声明变量。它的用法和var类似，但有以下几点区别： let声明的变量，只在所在的代码块内有效。 let声明的变量

矫情吗；*/ 2022年03月27日 13:58/ 0 赞/ 170 阅读

相关 ES6入门教程笔记(6)-函数的扩展

1 函数参数的默认值基本用法 ES6之前，函数参数不能指定默认值，只能用变通的方法。 function print(x, y) { y

ゝ一世哀愁。/ 2022年03月21日 05:46/ 0 赞/ 308 阅读

相关 ES6入门教程笔记(10)-Set和Map

1. Set 基本用法 ES6新增了Set，它类似于数组，但是成员的值不会重复，都是唯一的。 const s = new Set(); [1, 2

傷城~/ 2022年03月11日 02:07/ 0 赞/ 238 阅读