数组的解构赋值

个人习惯在js中这个样子给变量赋值:

< script>
let test1 = "test1";
let test2 = "test2";
let test3 = "test3";
let test4 = "test4";
</ script>



在es6中,我们可以这样子实现赋值:

< script>
let[test1,test2,test3,test4] =[ "test1", "test2", "test3", "test4"];
console. log(test1);
console. log(test2);
console. log(test3);
console. log(test4);
</ script>


上面这种利用数组进行赋值的方式就是数组解构赋值;


数组中缺少项也是可以进行解构赋值的:

< script>
let[test1,,test3,test4] =[ "test1", "test2", "test3", "test4"];
console. log(test1);
// console.log(test2);
console. log(test3);
console. log(test4);
</ script>


从输出可以看出,是可以进行的;


或者这样的数组也是可以的:

< script>
let[test1,[test2,test3],test4] =[ "test1",[ "test2", "test3"], "test4"];
console. log(test1);
console. log(test2);
console. log(test3);
console. log(test4);
</ script>


对数组进行嵌套然后进行解构赋值;


上面的情况都是左右相互匹配的情况下可以进行,那如果不匹配呢?

看看下面这个:

< script>
let[test1,test2,test3] =[ "test1", "test2", "test3", "test4"];
console. log(test1);
console. log(test2);
console. log(test3);
// console.log(test4);
</ script>


左边有三个变量,右边有四个值,这样是可以进行赋值的;

但是,我们再次修改一下,左边四个变量,右边三个变量会怎么样呢?

< script>
let[test1,test2,test3,test4] =[ "test1", "test2", "test3"];
console. log(test1);
console. log(test2);
console. log(test3);
console. log(test4);
</ script>


看看结果:

test1
temp.html:20
test2
temp.html:21
test3
temp.html:22
undefined


最后一个test4并没有赋值成功,我们的解构失败了,而失败的情况下回返回 undefined ;


数组的解构赋值也是可以设置默认值的:

< script>
let[test1 = "test1",test2,test3,test4] =[ undefined, "test2", "test3", "test4"];
console. log(test1);
console. log(test2);
console. log(test3);
console. log(test4);
</ script>


为什么设置默认值的变量的对应值写成 undefined 呢,因为只有这个值为undefined,前面的默认值才会起作用;

猜你喜欢

转载自blog.csdn.net/cvper/article/details/80296574