码迷,mamicode.com
首页 > 其他好文 > 详细

变量的解构赋值

时间:2019-09-12 23:22:51      阅读:99      评论:0      收藏:0      [点我收藏+]

标签:交换变量   cti   变量声明   ber   一个   问题   用处   func   turn   

---恢复内容开始---

从按照一定的模式从象或数组中提取值,然后对变量进行赋值就是解构

1.数组的解构赋值

数组的解构赋值本质上是模式匹配

左边多,多出来即为undefined

let [a,b,c]=[1,2];
console.log(a, b, c);//1,2,undefine

 

右边多,则省略即可

let [a,b]=[1,2,3];
console.log(a, b);//1,2

数组的解构赋值可以嵌套,也可以有默认值,解构时,变量的取值由它们所在的位置决定

实际上只要数组右边的模式有Iterator接口就可赋值

2.对象的解构赋值

对象解构时,因为对象的属性没有次序,所以值跟变量的次序不对应也行,但是变量必须与属性同名才能取到值

实际上属性只是作为匹配模式,真正被赋值的是属性的值

左右两边数量不等的情形同数组一样,(但是左边可以是个空对象,虽然这样毫无意义,但是是合法的)

可以嵌套,可以有默认值

3.字符串的解构赋值

字符串被转换成了一个类似数组的对象,类似数组的对象都有一个length属性,可以进行进行解构赋值

 let [a,b,c,d,e,f,g]="hello";
console.log(a, b, c, d,e);//h e l l o

左右两边数量不等时如上所述

4.数值和布尔值的解构赋值

解构赋值时,如果右边为数值或者布尔值,则先将其转换为对象Number和Boolean

解构赋值的规则是,只要右边的值不是数组或对象,就先将其转换为对象,由于undefined和null无法转换为对象,所以对它们进行解构赋值会报错

5.函数参数的解构赋值

function move({x = 0, y = 0} = {}) {
  return [x, y];
}

move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, 0]
move({}); // [0, 0]
move(); // [0, 0]
function move({x, y} = { x: 0, y: 0 }) {
  return [x, y];
}

move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, undefined]
move({}); // [undefined, undefined]
move(); // [0, 0]

 好好感受上面这两个,差点被绕晕了,实际上跟前面对象的解构赋值一样,再来一个例子看看

  function move({x=1,y=2}={x:3,y:4}){
        console.log(x,y)
    }
    a()//1,2

6.圆括号问题

6.1不能使用圆括号的情况

变量声明语句

函数参数

赋值语句的模式

6.2可以使用圆括号的情况

赋值语句的非模式部分

7.用途

交换变量的值

从函数返回多个值

函数参数的定义

提取JSON 的数据

函数参数的默认值

遍历Map结构

输入模块的指定方法

 

ps:我感觉最大的用处就在于提取东西

变量的解构赋值

标签:交换变量   cti   变量声明   ber   一个   问题   用处   func   turn   

原文地址:https://www.cnblogs.com/donutkiki/p/11515423.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!