个人习惯在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,前面的默认值才会起作用;