ES6知识整理(2)-变量的解构赋值

ES6知识整理(二)--变量的解构赋值

最近准备在业余空闲时间里一边学习ES6,一边整理相关知识。只有整理过的学习才是有效的学习。也就是学习之后要使用和整理成文,才是正在的学到了。。。

上一篇是一个试水,现在接上。

变量提升

看了下朋友回复,上篇还少讲了个变量提升,其实也是搜索之后才看到的,于是现在这里说下,所谓变量提升是es5中才有的,es6中已经去除了。

这里写个栗子:

变量的先使用后定义场景

var声明,这样

let声明,这样

查了一下,基本可以理解为:es5容忍这种写法,即使是先使用,后面才声明,也不会报错。但es6就无法容忍了,你前面没声明,你就不能使用,即使后面声明了。得有个先后顺序。

解构赋值

现在我们来说说,es6的解构赋值,比起es5有什么不同呢?都是一种赋值方式。(解构赋值的场景很多)

这是es5的多个变量赋值方式:

这是es6的多个变量赋值方式(当然es6中也能用es5的语法):

分别赋值了,一一对应的。

你甚至可以这样,只要左右两边的解构一样就可以。

es6允许这样:(,左右可以是空的)声明的变量对应后面的值

还有这种操作:(...变量,把后面的值以数组形式都赋值给后面的变量)

当然,这样就报错了:(...变量必须是解构赋值的最后一个变量)

这种情况,只有一个值,第二个值就没有了,就是undefined,...变量就是个空数组

不完全解构

这里只去前面的对应

b只取了2

这样子b取的就是数组了

默认值解构

表示赋的值为不写或undefined,那就会取默认值

严格相等运算符(===)

对象的解构赋值

可以这样子,赋值时:后面给出变量的值

位置是可以调换的,值一样

没赋值到的变量会是undefined,不报错

字符串解构赋值

只取单个字符串

这表示es6的取字符串长度,{}中,:前面就是es5的.操作,:后面是变量(但这种方式很少用,也不是所有的方法和属性都支持)

函数参数的解构赋值

1和2对应赋值给x和y

解构赋值的用途场景

互相赋值

函数中返回多个值

变量map:

打印是这样

前期知识点比较简单,所以爆肝做下也花不了多少时间,到后期难的话更新时间可以定长一些。学习+练习+整理=文章

——海瑞菌

  • 发表于:
  • 原文链接:https://kuaibao.qq.com/s/20180519G1J0SA00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券