变量的解构赋值

Posted 2022-10-21 donutkiki

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

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

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:我感觉最大的用处就在于提取东西