ES6中的变量的解构赋值2

函数参数的解构赋值

函数的参数也可以使用解构赋值。

function add([x, y]){ return x + y; } add([1, 2]); // 3

同时函数参数的解构也可以使用默认值

但是注意写的位置一定要写正确，下面第一种写法是为变量为指定默认值，而第二种写法是为函数的参数指定默认值，这两种写法得到的结果不相同！

function move1({x = 0, y = 0} = {}) { return [x, y]; } function move2({x, y} = { x: 0, y: 0 }) { return [x, y]; } move1({x: 3}); // [3, 0] move2({x: 3}); // [3, undefined] move1({}); // [0, 0] move1(); // [0, 0] move2({}); // [undefined, undefined] move2(); // [0, 0]

圆括号的问题

圆括号的使用一定要规范，尽量不要多使用圆括号，如果会导致解构中的歧义，则不要使用圆括号。

不得使用圆括号的情况

变量声明语句

变量声明语句，模式不得使用圆括号。以下语句全部都会报错。

// 全部报错 let [(a)] = [1]; let {x: (c)} = {}; let ({x: c}) = {}; let {(x: c)} = {}; let {(x): c} = {}; let { o: ({ p: p }) } = { o: { p: 2 } };

函数参数

因为函数参数也属于变量声明，因此不能带有圆括号。以下情况也都会报错

// 报错 function f([(z)]) { return z; } // 报错 function f([z,(x)]) { return x; }

赋值语句的模式

代码的整个模式或者部分模式放在圆括号中，都会导致报错

// 全部报错 ({ p: a }) = { p: 42 }; [({ p: a }), { x: c }] = [{}, {}];

可以使用圆括号的情况

可以使用圆括号的情况就只有一种：赋值语句的非模式部分，可以使用圆括号。

[(b)] = [3]; // 正确 ({ p: (d) } = {}); // 正确 [(parseInt.prop)] = [3]; // 正确

解构复制的用途

交换变量的值

[x,y]=[y,x]

从函数返回多个值

函数参数的定义

提取JSON数据

let jsonData = { id: 42, status: "OK", data: [867, 5309] }; let { id, status, data: number } = jsonData;

函数参数默认值

遍历Map结构

任何部署了 Iterator 接口的对象，都可以用for...of循环遍历。Map 结构原生支持 Iterator 接口，配合变量的解构赋值，获取键名和键值就非常方便。

const map = new Map(); map.set('first', 'hello'); map.set('second', 'world'); for (let [key, value] of map) { console.log(key + " is " + value); } // first is hello // second is world

输入模块的指定方法

如需详细学习，请继续查看官方文档

本文仅为个人学习总结，如有错误，欢迎指出。