es6解构(destructuring)

1 数组的解构

let [a, b, c] = [1, 2, 3]   // 1, 2, 3
let [a, b, c] = [1, , 3]    // 1, undefined, 3

// 默认值
let [a, b, c = 3] = [1, 2]      // 1, 2, 3
let [a, b, c = 3] = [1, 2, 4]   // 1, 2, 4
let [a, b, c = a + b] = [1, 2]  // 1, 2, 3

// 复杂点
let [a, [b, [c, d]]] = [1, [2, [3, 4]]]     // 1, 2, 3, 4

// rest参数
let [a, ...b] = [1, 2, 3]       // 1, [2, 3]
let [a, ...b, c] = [1, 2, 3]    // 报错：rest element must be the last element

// 变量赋值，对象的解构只能用于声明语句
let a, b
[a, b] = [1, 2]     // 1, 2

2 对象的解构

// 要求变量名和属性名相同
let o = {a: 1, b: 2, c: 3}

// 基本用法
let {a, b, c} = o           // 1, 2, 3，实质是简写形式
let {a: a, b: b} = o
let {a: x, b: y} = o        // x = 1, y = 2

// 默认值可用，要求右侧严格=undefined
let {x = 1} = {}            // x = 1
let {x: y = 1} = {}         // y = 1
let {x: y = 1} = {x: 2}     // y = 2
let {x = 1} = {x: null}     // x = null
let {a, d = a + 1, e} = o   // 1, 2, undefined

// 嵌套(nested)对象的解构
let o = {a: {b: {c: 3, d: 4}}}
let {a, a: {b}, a: {b: {c, d}}} = o
// a = {b: {c: 3, d: 4}}, b = {c: 3, d: 4}, c = 3, b = 4

// 下面的写法中，a/b是模式，不是变量，只能获取c/d的值
let {a: {b: {c, d}}} = o

// 已声明变量的解构报错
let a, b
{a, b} = {a: 1, b: 2}   // 报错：只能用于声明语句。认为"{}"打头的是代码块
({a, b} = {a: 1, b: 2}) // 正确

// 数组是特殊的对象
let arr = [1, 2, 3]
let {0: first, [arr.length - 1]: last} = arr
// first = 1, last = 3

3 string number boolean的解构

// string先转成了数组
let [a, b, c, d] = 'test'
// a = 't', b = 'e'

let {length: l} = 'test'
// l = 4

// right会先转成object
let {toString: s} = 4
s === Number.prototype.toString     // true

let {toString: s} = false
s === Boolean.prototype.toString    // true

// 不能转成object的会报一个常见的错误
let {p} = null
let {p} = undefined
// TypeError: Cannot destructure property `p` of 'undefined' or 'null'.