数组的解构赋值
1:基本用法:
ES6允许按照一定的模式从数组对象中提取值,然后对变量进行赋值,该操作即为结构。
let a=1;
let b=2;
let c=3;
等价于
let [a,b,c]=[1,2,3];
本质上,这种写法属于“匹配模式”,只要等号左右两边的模式相同,左边的变量就会被被赋予对应的值。
let [foo,[[bar],baz]]=[1,[[2],3]];
若结构不成功,变量的值就等于undefined。
没有变量接受的解构值会被忽视掉
let [a,[b],c]=[1,[2,3],4];
如果两边的模式不一样则会报错
let [foo]=1;
2:事实上,只要某种数据接口具有Iterator(迭代器)接口,都可以采用数组形式的解构赋值。let[x,y,z] = new Set(['a','b','c']);
function* fibs(){ //Generator函数,原生具有Iterator接口。
let a=0;
let b=1;
while(true){
yield a;
[a,b]=[b,a+b];
}
}
let [first,second,third,fourth,fifth,sixth]=fibs();
3:默认值
解构赋值允许指定默认值
let [foo=true]=[];
let [x,y='b']=['a'];
let [m,n='b']=['a',undefined];
ES6内部使用严格相等运算符(===)判断一个位置是否有值,若一个数组成员不严格等于undefined,默认值不会生效。
let [x=1]=[undefined];
let [y=1]=[null];
如果默认值是一个表达式,则会采用惰性求值,只有在用到的时候才会求值。
function f(){
console.log('act');
return 200;
}
let [x=f()]=[1];
默认值可以引用解构赋值的其他变量,但该变量必须已经声明,否则会报错
let [x=1,y=x]=[];
let [x=1,y=x]=[2];
let [x=1,y=x]=[1,2];
let [x=y,y=1]=[];
对象的解构赋值
1:对象解构赋值与数组不同,数组是通过位置来决定变量值的,但是对象里面的值是无序的,变量必须与属性同名才能取到正确的值
let {bar,foo}={foo:"aaa",bar:"bbb"};
let {bar}={foo:"aaa",bar:"bbb"}
若变量名与属性名不一致,则需明确对应关系
let {baz}={foo:"aaa",bar:"bbb"};
let {foo:"baz"}={foo:"aaa",bar:"bbb"};
事实上,对象解构赋值内部机制是先找到同名属性,然后再赋值给相应的变量,真正被赋值的是后者。
let {foo:foo,bar:bar}={foo:'aaa',bar:'bbb'}
前一个foo只是用来匹配的,后一个foo才是变量。
对象的解构赋值也可以用嵌套结构,只要属性名或相应位置对应正确,就可以正确赋值。
let obj={
p:[
'Hello',
{y:'world'}
]
};
let {p,p:[x,{y}]}=obj;
2:对象结构赋值也可以指定默认值,且默认值生效的条件是对象的属性严格等于undefined。 var{x,y=5}={x:1}
若结构失败,则变量的值等于undefined。如果结构模式是嵌套的对象,且子对象所在副属性存在,将会报错。`let {foo:{bar}}={baz:‘bbb’};
若将一个已声明的变量用于解构赋值,则需要将解构赋值视为一个表达式,用括号括起里。
let x;
({x}={x:});
对象解构赋值也可以很方便地把现有对象的方法赋值给某个变量let { log,sin,cos}= Math
由于数组是特殊的对象,因此可以可以对数组进行对象属性的结构。
let arr = [1,2,3];
let {0:first,[arr.length-1]:last}=arr;
字符串解构赋值
字符串解构赋值,将字符串看作一个类似于数组的对象。const [a,b,c,d] = 'hello'
数值和布尔值的解构赋值
解构赋值的原则是,若等号右边不是对象,则先转换对象,如果不能转换为对象,则会报错,如null和undefined。
函数参数的解构赋值
其规则与数组、对象的解构赋值一致,关键是看参数采用哪种解构赋值方式。
function add([x,y=10]){
return x+y;
}
let r = add([1]);
function add({x,y=10}){
return x+y;
}
let r = add({x:20});
解构赋值的用途
1:交换变量的值
let x = 1,y = 3;
[x,y] = [y,x];
2:从函数返回多个值
function func(){
return [1,2,3]
}
let [a,b,c] = func();
3:函数参数的定义
function f({x,y,z}){
return x+y+z;
}
f({1,2,3})
4:提取JSON数据