ES6.md 3.2 KB

ECMAScript 6 语法

1.let 命令

代码作用域

ES6新增 let 命令,用来声明变量,用法类似于 var。 但其声明的变量,只在let命令所在的代码块有效。

{
  let a = 10;
  var b = 1;
}

a // ReferenceError: a is not defined.
b // 1

for循环的计数器,就很合适使用let命令。

for (let i = 0; i < arr.length; i++) {}
console.log(i); //ReferenceError: i is not defined
不存在变量提升

let不像var那样会发生“变量提升”现象。所以,变量一定要在声明后使用,否则报错。

console.log(foo); // 输出undefined
console.log(bar); // 报错ReferenceError
var foo = 2;
let bar = 2;
不允许重复声明

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

// 报错
function () {
  let a = 10;
  var a = 1;
}

2.const命令

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

'use strict';
const PI = 3.1415;
PI // 3.1415  
PI = 3; // TypeError: "PI" is read-only

3.数组解构赋值

[参考链接](http://es6.ruanyifeng.com/#docs/destructuring)

ES6允许以下方式赋值变量 var [a, b, c] = [1, 2, 3];

嵌套解构

下面是一些使用嵌套数组进行解构的例子。

let [foo, [[bar], baz]] = [1, [[2], 3]];
let [ , , third] = ["foo", "bar", "baz"];
let [x, , y] = [1, 2, 3];
x // 1
y // 3
let [head, ...tail] = [1, 2, 3, 4];
head // 1
tail // [2, 3, 4]
解析缺少

如果解构不成功,变量的值就等于undefined。

var [foo] = [];
var [bar, foo] = [1];
// 以上两种情况都属于解构不成功,foo的值都会等于undefined。
不完全解析

等号左边的模式,只匹配一部分的等号右边的数组。这种情况下,解构依然可以成功。

let [x, y] = [1, 2, 3];
x // 1
y // 2

let [a, [b], d] = [1, [2, 3], 4];
a // 1
b // 2
d // 4

4. 对象的解构赋值

解构不仅可以用于数组,还可以用于对象。
var { foo, bar } = { foo: "aaa", bar: "bbb" };
foo // "aaa"  ; bar // "bbb"

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

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

如果变量名与属性名不一致,必须写成下面这样。

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

这实际上说明, 对象的解构赋值是下面形式的简写 对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者。 var { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };


5. 字符串的解构赋值

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

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