美文网首页ES6
2.解构赋值

2.解构赋值

作者: Easy_Dream | 来源:发表于2019-01-08 09:01 被阅读0次

ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构赋值。

例:let [a, b, c] = [1, 2, 3]

本质上,这种写法属于‘模式匹配’,只要等号两边的模式相同,左边的变量就会被赋予对应的值(如果解构不成功,变量的值就等于undefined)。

例:let [x, y] = [1, 2, 3]

这种情况是不完全解构,即等号左边的模式,只匹配一部分等号右边的数组。

默认值

解构赋值允许指定默认值。

例:let [x, y = 2] = [1]   // y = 2

对象的解构赋值

对象的解构赋值与数组有一个重要的不同。数组的元素按次序排列,变量的值由它的位置决定;而对象的属性没有次序,变量必须与属性同名。

例1:let {a, b} = {a: 1, b: 2}

例2:let obj = {a: 1, b: 2}; let {a, b} = obj

字符串的解构赋值

字符串也可以解构赋值,字符串被转换成类似数组的对象

例:const [a, b, c, d, e] = 'hello'  // a = 'h' b = 'e' ......

数值和布尔值的解构赋值

解构赋值时,如果等号右边是数值和布尔值,则会先转为对象,由于undefined和null无法转为对象,所以对它们解构赋值会报错。

函数的解构赋值

函数的参数也可以使用解构赋值

例1:function add([x, y]) {return x + y}; add([1, 2])

例2:[[1, 2], [3, 4]].map(([a, b]) => a +b);  //[3, 7]

相关文章

  • ES6 变量的解构赋值

    1.数组的解构赋值 2.对象的解构赋值 3.字符串的解构赋值 4.数值和布尔值的解构赋值 5.函数参数的解构赋值 ...

  • 第三章 变量的解构赋值

    1.数组的解构赋值2.对象的解构赋值3.字符串的解构赋值4.数值和布尔值的解构赋值5.函数参数的解构赋值6.圆括号...

  • 20.JavaScript-数组解构赋值

    1.什么是解构赋值 解构赋值是ES6中新增的一种赋值方式 2.数组解构赋值注意点 2.1 在数组的解构赋值中,等号...

  • JS基础:ES6关于基本语法的一些扩展

    目录一. 解构赋值 1. 数组的解构赋值 2. JS对象的解构赋值 3. 解构赋值的应用场景二. 字符串的扩展 1...

  • ES6 2.解构赋值

    解构赋值 解构赋值的分类 数组解构赋值 对象解构赋值 字符串解构赋值 布尔值解构赋值 函数参数解构赋值 数值解构赋...

  • 2. 解构赋值

    ES6允许按照一定模式从数组和对象中提取值,对变量进行赋值,这被称作解构,之前我们为变量进行赋值,只能直接指定 E...

  • 2.解构赋值

    ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构赋值。 例:let [a, b, c] ...

  • ES6 语法(解构赋值)

    什么是解构赋值及用法 解构赋值分类:数组解构赋值对象解构赋值字符串解构赋值布尔值解构赋值函数参数解构赋值数值解构赋...

  • ECMAScript6--3.解构赋值

    1.什么是解构赋值解构赋值的语法上就是一个赋值;解构:左边一种结构,右边一种结构,左右一一对应进行赋值; 2.解构...

  • ES6解构赋值、交换两个变量的值、设置函数默认值、模板字符串、箭

    1,解构赋值 解构赋值主要包括数组的解构赋值、对象的解构赋值、字符串的解构赋值、函数参数的解构赋值。 (1)数组的...

网友评论

    本文标题:2.解构赋值

    本文链接:https://www.haomeiwen.com/subject/zkgyrqtx.html