解构赋值

object destructuring

• 默认值

let {a, b = 'b'} = {a: 'a'}

• 别名

let node = {
        type: "Identifier",
        name: "foo"
    };

let { type: localType, name: localName } = node;

• 别名设置默认值

let node = {
        type: "Identifier"
    };

let { type: localType, name: localName = "bar" } = node;

注意，这个默认值仅为undefined的值进行赋值。

const obj = {name: null, age: false, fullname: undefined}
const {name = 'xiaohesong', age = 18, fullname = 'xiaohesong'} = obj

所以你试试结果论证一把。

如果不只是想对undefined解构，可以使用译者写的一个插件： babel-plugin-use-or-operator-for-destructuring-default-value

• 嵌套的玩法

let node = {
        type: "Identifier",
        name: "foo",
        loc: {
            start: {
                line: 1,
                column: 1
            },
            end: {
                line: 1,
                column: 4
            }
        }
    };

let { loc: { start }} = node;

console.log(start.line);        // 1
console.log(start.column);      // 1

array destructuring

• 赋值

let users = ['xiaocai', 'xiaozhang', 'xiaohesong']
let [,,xhs] = users
console.log(xhs) //xiaohesong

• 拷贝

在构造函数之前，是其他方式。

// cloning an array in ECMAScript 5
var colors = [ "red", "green", "blue" ];
var clonedColors = colors.concat();

console.log(clonedColors);      //"[red,green,blue]"

es6

// cloning an array in ECMAScript 6
let colors = [ "red", "green", "blue" ];
let [ ...clonedColors ] = colors;

console.log(clonedColors);      //"[red,green,blue]"

object and array destructuting

混合型的解构

let node = {
        type: "Identifier",
        name: "foo",
        loc: {
            start: {
                line: 1,
                column: 1
            },
            end: {
                line: 1,
                column: 4
            }
        },
        range: [0, 3]
    };

let {
    loc: { start },
    range: [ startIndex ]
} = node;

console.log(start.line);        // 1
console.log(start.column);      // 1
console.log(startIndex);        // 0

function default params destructuring

函数的参数的默认值的解构

function say({name, age, sex}) {
  #do smt
}

say()

这样会出错，为什么。 在引擎执行的时候，他是会这么解析

function say({name, age, sex}) {
   let {name, age, sex} = options
}

所以如果想控制参数必填，这样是很好的。但是如果你想要参数是可选，那就可以给参数设置默认参数.

function say({name, age, sex} = {}) {
  #do smt
}
say()

这样就不会报错.