学习笔记：ES6

Posted 2020-10-06 21270

http://es6.ruanyifeng.com/　　ECMAScript 6

 

---

以下是ES6排名前十的最佳特性列表（排名不分先后）：
Default Parameters（默认参数） in ES6
Template Literals （模板文本）in ES6
Multi-line Strings （多行字符串）in ES6
Destructuring Assignment （解构赋值）in ES6
Enhanced Object Literals （增强的对象文本）in ES6
Arrow Functions （箭头函数）in ES6
Promises in ES6
Block-Scoped Constructs Let and Const（块作用域构造Let and Const）
Classes（类） in ES6
Modules（模块） in ES6

 

 

---

笔记正文

ECMAScript 6.0（以下简称 ES6）是 javascript 语言的下一代标准，已经在2015年6月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。

 

let命令

它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。（for循环的计数器，就很合适使用let命令。）

在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”

不允许重复声明 ： let不允许在相同作用域内，重复声明同一个变量。

let实际上为 JavaScript 新增了块级作用域。

ES6 允许块级作用域的任意嵌套。

内层作用域可以定义外层作用域的同名变量。

ES6 引入了块级作用域，明确允许在块级作用域之中声明函数。ES6 规定，块级作用域之中，函数声明语句的行为类似于let，在块级作用域之外不可引用。

考虑到环境导致的行为差异太大，应该避免在块级作用域内声明函数。如果确实需要，也应该写成函数表达式，而不是函数声明语句。

// 函数声明语句
{
  let a = ‘secret‘;
  function f() {
    return a;
  }
}

// 函数表达式
{
  let a = ‘secret‘;
  let f = function () {
    return a;
  };
}

 

const 命令

const声明一个只读的常量。一旦声明，常量的值就不能改变。

const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。

const的作用域与let命令相同：只在声明所在的块级作用域内有效。

 

ES5和ES6

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

ES6 一共有6种声明变量的方法：var命令和function命令、let和const命令、import命令和class命令

顶层对象window的属性与全局变量挂钩，被认为是JavaScript语言最大的设计败笔之一。

ES6为了改变这一点，一方面为了保持兼容性，var命令和function命令声明的全局变量，依旧是顶层对象的属性；另一方面规定，let命令、const命令、class命令声明的全局变量，不属于顶层对象的属性。也就是说，从ES6开始，全局变量将逐步与顶层对象的属性脱钩。

var a = 1;
// 如果在Node的REPL环境，可以写成global.a
// 或者采用通用方法，写成this.a
window.a // 1

let b = 1;
window.b // undefined

 

变量的解构赋值

数组的解构赋值：

以前，为变量赋值，只能直接指定值。

let a = 1;
let b = 2;
let c = 3;

ES6 允许写成下面这样。

let [a, b, c] = [1, 2, 3];

上面代码表示，可以从数组中提取值，按照对应位置，对变量赋值。

解构赋值允许指定默认值

let [foo = true] = [];
foo // true

let [x, y = ‘b‘] = [‘a‘]; // x=‘a‘, y=‘b‘
let [x, y = ‘b‘] = [‘a‘, undefined]; // x=‘a‘, y=‘b‘

对象的解构赋值：

解构不仅可以用于数组，还可以用于对象。

对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

let { bar, foo } = {  bar: "bbb" , foo: "aaa"};
foo // "aaa"
bar // "bbb"

字符串的解构赋值：

字符串也可以解构赋值。这是因为此时，字符串被转换成了一个类似数组的对象。

const [a, b, c, d, e] = ‘hello‘;
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"

数值和布尔值的解构赋值（略）

函数参数的解构赋值（略）