ES6——解构赋值

解构赋值

解构赋值说白了就是一种模式匹配,等号左右两边对应变量和值。解构赋值可以是完全解构赋值,即每个值与右边一一对应,也可以是不完全解构赋值,即只取等号右边值的一部分。解构赋值可以对变量取默认值。

解构赋值取默认值的条件是,对应值不全等于undefined,ES6全都是用 === 即全等来判定是否为对等

数组的解构赋值

数组的解构赋值比较简单,即[]两边匹配即可

let [x,y] = [1,2] // x =1,y=2
let [z,m=1] = [1] // x = 1,m=1
let [a,[b,c],d] = [1,[2,3],4] // a = 1,b=2,c=3,d=4

对象的解构赋值

对象的解构赋值是有模式的

let {foo,foo:{a},foo:{a:[x,y,z=4]}} = {foo:{a:[1,2]}}
// foo:{a:[1,2,3]}
// a:[1,2,3]
// x=1,y=2,z=4

每个逗号都是一个模式,变量的属性值必须跟对象的属性值相一致,否则无法成功为 undefined

对象的解构本质上是下面的简写

let {foo:foo,baz:baz} = {foo:1,baz:2}
// foo:1,baz:2

对于已经声明的变量进行赋值解构,要注意花括号的方式,系统会把它当作块级作用域,所以我们要非匹配模式的部分增加括号。

let foo
{foo} = {foo:1}
// 报错 Uncaught SyntaxError
let foo 
({foo} = {foo:1})
// foo : 1

数组本质是特殊的对象,所以可以这样取值:

let arr = [1, 2, 3];
let {0 : first, [arr.length - 1] : last} = arr;
first // 1
last // 3

字符串的解构

在字符串的解构过程中,首先会把字符串转变成数组,当然,会有一个length属性。

数值和布尔值

赋值解构只要等号右边不是数组跟对象,都会优先转换为对象

用途

交换变量的值

[x,y] = [y,x]

从函数返回多个值

函数参数的定义和默认值

提取JSON的值

遍历map解构

指定模块的输出方法

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 解构 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值 数组解构赋值 本质上这种写法相当于模式匹配如...
    heheheyuanqing阅读 398评论 0 0
  • 1.在指定默认值时,赋值为<code>null</code>和<code>undefined</code>是不同的...
    请输入其他名字阅读 1,770评论 0 0
  • 基本用法可以从数组中提取值,按照对应的位置,对变量赋值 嵌套数组进行结构 不完全解构即等号左边的模式只匹配一部分等...
    _by_w_z阅读 294评论 0 2
  • 解构赋值,也称“模式匹配”,即赋值的左右两边模式相同,则等号右边的值赋给左边的变量。 解构赋值 适用 let va...
    jingzizi阅读 3,139评论 2 0
  • 数据库中,如果用SQL语言进行多个表的查询,就需要用到连接操作。这里对SQL中的连接类型进行简单的介绍。本文内容可...
    SpaceCat阅读 4,191评论 1 11