数组的解构赋值：
-
let [a,b,c]=[1,2,3]; ==>let a=1;let b=2;let c=3;
-
let [head,...tail]=[1,2,3,4]; ==> head = 1 , tail = [2,3,4]
-
let [x,y,...z]=['a']; ==> x = "a" y=undefined z=[]
-
分析：因为解构赋值是依次对应的，x对应"a"，y没有对应值，为undefined，...z表示剩余内容，剩余为空，因此为空数组[]
-
let [a,[b],d]=[1,[2,3],4]; a==>1,b==>2,d==>4
-
分析：a和d不必哆嗦，[b]=[2,3],解构赋值,b=2；3没有对应值，忽略
-
...运算符两种用法：
-
展开运算符(用在array和object上)：let a = [1,2,3]; let b = [0,...a,4]; ==>[0,1,2,3,4]
-
剩余操作符(结构的一种，一般只针对array)，举例就是上面的。解构不成功，变量的值就是undefined。如果等号右边不是数组或不可遍历，会报错。比如：
-
let [foo]=1; let [foo]=false; let [foo]=NaN; let [foo]=undefined; let [foo]=null; let [foo]={};这些等号右边的值都不可遍历，因此都会报错
-
解构允许赋默认值： let [x,y = 'b']=['a',undefined]; x==>'a',y==>'b'
-
如果数组成员不严格为undefined，默认值不会生效：let [x,y = 'b']=['a',null]; x==>'a',y==>null
对象的解构赋值：
-
对象的解构赋值是按名称对应来的，名称不对应值就为undefined。而数组是按次序排列的
-
let [bar,foo]={foo:"aaa",bar:"bbb"}; ==>foo:aaa,bar:bbb
-
对象的解构赋值是下面形式的简写：let {foo:foo,bar:bar}={foo:'aaa',bar:'bbb'}
-
var {foo:baz}={foo:'aaa',bar:'bbb'}; ==>baz:aaa
-
foo称为模式，baz称为变量
-
let {foo:baz}={foo:'aaa',bar:'bbb'}; ==>baz:aaa,foo:foo is not defined
-
对象的解构也可以赋默认值:var {x:y=3}={x:5}; ==> y:5
-
默认值生效的条件也是对象的属性值严格等于undefined
-
已经声明的变量不能用于解构赋值:let x; {x}={x:1}; ==>报错。因为这里JavaScript引擎会将{x}解析为代码块，通过({x}={x:1}); 则能正确解析
-
解构赋值左边可以不放任何东西
-
字符串也可以解构赋值，类似数组的对象都有length属性，也可以对其解构赋值：let {length:len}='hello'; ==> len:5
-
解构赋值时，如果等号右边是数值和布尔值，则会先转为对象
-
let {prop:x}=undefined; ==>TypeError undefined和Null不能转化为对象
-
let {prop:x}=null; ==>TypeError
-
注意：模式不能使用圆括号
解构赋值的用途
-
交换变量的值:let x=1; let y=2; [x,y]=[y,x];
-
从函数返回多个值:
function example(){
return [1,2,3];
}
let [a,b,c]=example(); //返回数组
function example(){
return {foo:1,bar:2};
}
let {foo,bar}=example(); //返回对象
- 函数参数的定义：
functoin f([x,y,z]){
...
}
f([1,2,3]); //有次序的参数
function f({x,y,z}){
...
}
f({z:3,y:2,x:1}); //无次序的参数
- 提取json数据：
let jsonData={
id:42,
status:"ok",
data:[132,456]
};
let {id,status,data}=jsonData;
- 函数参数的默认值：
jQuery.ajax=function(url,{
async=true,
beforeSend=function(){},
cache=true}){...}
- 遍历Map结构：
var map=new Map();
map.set('first','hello');
map.set('second','world');
for (let [key,value] of map){
console.log(key,value)
}
for (let [key] of map){
console.log(key)
}
for (let [,value] of map){
console.log(key)
}
- 输入模块的指定方法：
const { SourceMapConsumer, SourceNode } = require("source-map");
最后注意一点:解构赋值的参数必须在最右边
例如:
const [a,...b]=[1,2,3,4]能正确解构，而const [...a,b]=[1,2,3,4]会报错，如果是三个参数,const [a,...b,...c]=[1,2,3,4]也是错误的
网友评论