ES6之解构
2017-04-02 本文已影响0人
芒僧
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)
数组的解构赋值
ES5给变量赋值
let a=1;
let b=2;
let c=3;
ES6的数组解构赋值
let [a,b,c]=[1,2,3]
//没有相互对应会造成解构失败或者解构不完全
//同时,解构支持默认值
let[a,b=1]=[2] //a=2,b=1
let [x = 1, y = x] = []; // x=1; y=1
let [x = 1, y = x] = [2]; // x=2; y=2
let [x = 1, y = x] = [1, 2]; // x=1; y=2
let [x = y, y = 1] = []; // ReferenceError原因是x去寻找y的值得时候,y还没被声明。
如果默认值是一个表达式,那么这个表达式是惰性求值的,即只有在用到的时候,才会求值。
--
对象的解构赋值
let { foo, bar } = { foo: "aaa", bar: "bbb" };
foo // "aaa"
bar // "bbb"
//顺序可以不在意,但必须变量得相互对应
//如果变量名与属性名不一致,必须写成下面这样。
var { foo: baz } = { foo: 'aaa', bar: 'bbb' };
baz // "aaa"
//这里的foo相当于是一个中间变量(代理)使得baz的值代表foo的值,支持嵌套。
let obj = {
p: [
'Hello',
{ y: 'World' }
]
};
let { p: [x, { y }] } = obj;
x // "Hello"
y // "World"
//嵌套之后,p被叫做模式,x,y被叫做真正的变量
常用方式
交换变量的值
let x = 1;
let y = 2;
[x, y] = [y, x];
提取JSON数据
let jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
};
let { id, status, data: number } = jsonData;
console.log(id, status, number);
// 42, "OK", [867, 5309]