ES6学习-4 解构赋值（1）数组的解构赋值

2021-05-23 22:03:31 阅读：133 来源： 互联网

解构赋值是ES6很大的一个提升，为我们带来了很多方便，但用不好，会使程序的可读性变差，所以用时要注意，尽量保持程序的易读性。

数组解构赋值

在JS没有支持解构赋值之前，我们声明几个变量并赋值通常都是像下面这样：

1 var a=0;
2 var b=0;
3 var c=0;

有了解构赋值就可以写成这样了

1 var [a,b,c]=[0,0,0]

确实简单了许多，左边与右边能一一对应的这种用解构赋值是既简单又易读。我之前为啥说用不好会使程序的可读性变差呢，因为解构在不是一对一对时候也会成功，下面举一些栗子：

1 let [ , , third] = ["foo", "bar", "baz"]; //前边两个跳过，直接用第三个元素给 third赋值，third:"baz" 
2 let [x, , y] = [1, 2, 3]; //中间的跳过，用1给X赋值，3给Y赋值 x：1 y:3
3 let [x, y] = [1, 2, 3]; //用1给X赋值，2给y赋值，3没啥用处， x:1 y:2

虽然这些方式也会赋值成功，但可读性差很多，实际应用中尽量还是少用或不用。

解构赋值时的默认值

解析赋值允许指定默认值，如下面的栗子：

1 let [x, y = 'b'] = ['a']; // x='a', y='b',没有给y赋值，所以y使用了默认值
2 let [x, y = 'b'] = ['a', undefined]; //x='a', y='b', undefined相当于没人给y赋值，所以y使用了默认值
3 let [x, y = 'b'] = ['a', 'c']; //x='a',y='c' 用'c'给y赋值了，所以y变成了'c'，没有使用默认值

ES6 内部使用严格相等运算符（===），判断一个位置是否有值。所以，只有当一个数组成员严格等于undefined，默认值才会生效。

1 let [x = 1] = [null]; // x = null  null不是undefined，所以x没有使用默认值

一个很好用，也很有意思的代码，交换两个变量的值：

1 let [a,b]=[1,2];
2 console.log(a); //1
3 console.log(b); //2
4 
5 [a,b]=[b,a]
6 
7 console.log(a); //2
8 console.log(b); //1

标签：ES6,console,log,解构,let,默认值,赋值
来源： https://www.cnblogs.com/daguoguo/p/14802319.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

ES6学习-4 解构赋值（1）数组的解构赋值