Es6 解构赋值和扩展运算符

最新推荐文章于 2023-09-07 09:23:48 发布

Yang Qi(Warm 白羊)

最新推荐文章于 2023-09-07 09:23:48 发布

阅读量398

点赞数

文章标签： es6

本文链接：https://blog.csdn.net/weixin_45974687/article/details/107428301

版权

本文详细介绍了ES6中的解构赋值和扩展运算符。解构赋值是一种按照特定模式从数组中提取值并赋给变量的技术，要求模式匹配。文章提到了完全解构、不完全解构和解构失败的情况，并强调了解构赋值的默认值设定。扩展运算符用于合并和拷贝数组，同时在函数调用和参数传递中发挥作用，且不会影响原始数组。

摘要由CSDN通过智能技术生成

在ES6中按照一定的模式从数组中提取数值对应的变量进行赋值的操作就叫做解构赋值
本质上讲 解构赋值就是模式匹配

1. 解构赋值

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

在这里插入图片描述

如果想要解构赋值成功那么就必须保证两边的模式完全一样

var [a, b, c] = [1,[2],{
   name : "lucy"}];
// console.log(a, b, c);

在这里插入图片描述

在这里插入图片描述
2. 解构不成功

如果想要解构不成功那么变量的值就等于undefined

  let [r] = [];
  // console.log(r);  // undefined

这个就像var 声明了变量之后不进行赋值 var a;

解构不成功 :

  let [s, t] = [3];
  // console.log(s, t);

这个就是属于解构不成功因为数值不够 3 , undefined

3. 不完全解构
不完全解构的情况下也可以进行解构赋值只是后面放数值的数组都有多的数字
不完全解构 : 指得就是等号左右两边模式一样但是只匹配到右边得一部分数据

  let [x, y] = [1, 2 ,3];
  console.log(x , y);

在这里插入图片描述
4. 如果等号右边不是数组那么就会报错因为模式一样

 let [m] = 1;
 let [m] = false;
 let [m] = null;
 let [m] = {
   };
 console.log(m);  // {}  is not iterable  因为{}不可使用下标进行迭代

注意点
1. 解构赋值是允设置默认得但是如果要启用默认值那么这个变量得值就必须严格等于undefined

// let [a, b] = [1, 2];

 let [a, b = "abc"] = [1, 2];
 console

关注