ES6-数组的解构赋值

一、数组的解构赋值的规律

- 只要等号两边的模式相同,左边的变量就会被赋予对应的值

二、数组的解构赋值的例子讲解

1)简单的示例(完整的解构赋值)

  • 示例
//基本的模式匹配
// a,b,c依次和1,2,3对应let [a, b, c] = [1, 2, 3];console.log("a=" + a);console.log("b=" + b);console.log("c=" + c);
  • 效果
    在这里插入图片描述

2)简单的示例(部分的解构赋值)

  • 示例一(逗号占位符)
      let [, , c] = [1, 2, 3];console.log("c=" + c);
  • 效果
    在这里插入图片描述
  • 示例二(前者部分赋值)
      let [a, b] = [1, 2, 3];console.log("a=" + a);console.log("b=" + b);
  • 效果
    在这里插入图片描述

3)过度解构赋值

  • 如果解构不成功,一般变量的值就等于undefined
      let [a, b, c, d] = [1, 2, 3];console.log("a=" + a);console.log("b=" + b);console.log("c=" + c);console.log("d=" + d);
  • 效果
    在这里插入图片描述

4)较为复杂的解构赋值

  • 嵌套示例
      //模式匹配//令arr_end=[[b],c],arr_init=[[2],3]//则[a,[[b],c]]=[a,arr_end]=[1,[[2],3]]=[1,arr_init]//即[a,arr_end]=[1,arr_init]//即a和1对应,arr_end和arr_init对应//同理b和2对应,c和3对应let [a, [[b], c]] = [1, [[2], 3]];console.log("a=" + a);console.log("b=" + b);console.log("c=" + c);
  • 效果
    在这里插入图片描述

5)剩余运算符

  • 示例
      let [first, ...other] = [1, 2, 3, 4];console.log("first=" + first);console.log("other=" + other);
  • 效果
    在这里插入图片描述

6)默认值

- 解构赋值允许指定默认值
  • 示例
      //有对应的值let [a, b = 1] = [1, 2, 3];console.log("a=" + a + ",b=" + b);//无对应的值let [a1, b1 = 1] = [1];console.log("a1=" + a1 + ",b1=" + b1);//对应的值为nulllet [a2 = 1] = [null];console.log("a2=" + a2);//对应的值为undefinedlet [a3 = 1] = [undefined];console.log("a3=" + a3);
  • 效果
    在这里插入图片描述
  • 问题
- 大家可能有个疑惑
- 问题:为什么语句let [a3 = 1] = [undefined];中a3对应的值为undefined,为什么运行结果a3=1?
- 答案:ES6 内部使用严格相等运算符(===),判断一个位置是否有值,当一个数组成员严格等于undefined,默认值就会生效
  • 注意
- 默认值可以引用解构赋值的其他变量,但该变量必须已经声明
let [x = 1, y = x] = [];     // x=1; y=1
let [x = 1, y = x] = [2];    // x=2; y=2
let [x = 1, y = x] = [1, 2]; // x=1; y=2
let [x = y, y = 1] = [];     // ReferenceError: y is not defined

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/450930.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

freeswitch对接FunASR实时语音听写

1、镜像启动 通过下述命令拉取并启动FunASR软件包的docker镜像: sudo docker pull \registry.cn-hangzhou.aliyuncs.com/funasr_repo/funasr:funasr-runtime-sdk-online-cpu-0.1.7 mkdir -p ./funasr-runtime-resources/models sudo docker run -p 10096:10095 -i…

ctfshow web-77

开启环境: 先直接用伪协议获取 flag 位置。 c?><?php $anew DirectoryIterator("glob:///*"); foreach($a as $f) {echo($f->__toString(). );} exit(0); ?> 发现 flag36x.txt 文件。同时根目录下还有 readflag&#xff0c;估计需要调用 readflag 获…

java hutool工具类实现将数据下载到excel

通过hutool工具类&#xff0c;对于excel的操作变得非常简单&#xff0c;上篇介绍的是excel的上传&#xff0c;对excel的操作&#xff0c;核心代码只有一行。本篇的excel的下载&#xff0c;核心数据也不超过两行&#xff0c;简洁方便&#xff0c;特别适合当下的低代码操作。 下载…

Kettle 解决数据同步缓慢及性能效率问题 (数据同步利用时间戳解耦,性能通过配置优化提升90%)

一. 介绍 在数据同步过程中&#xff0c;缓慢的同步速度和低效率的性能往往是令人头痛的问题。本文将介绍如何通过Kettle解决数据同步缓慢及性能效率问题&#xff0c;其中主要涉及数据同步利用时间戳解耦和通过配置优化提升性能高达90%的方法 。 在先前的博客文章中&#xff0c…

LabVIEW风力发电机在线监测

LabVIEW风力发电机在线监测 随着可再生能源的发展&#xff0c;风力发电成为越来越重要的能源形式。设计了一个基于控制器局域网&#xff08;CAN&#xff09;总线和LabVIEW的风力发电机在线监测系统&#xff0c;实现风力发电机的实时监控和故障诊断&#xff0c;以提高风力发电的…

Vue.js设计与实现(霍春阳)

Vue.js设计与实现 (霍春阳) 电子版获取链接&#xff1a;Vue.js设计与实现(霍春阳) 编辑推荐 适读人群 &#xff1a;1.对Vue.js 2/3具有上手经验&#xff0c;且希望进一步理解Vue.js框架设计原理的开发人员&#xff1b; 2.没有使用过Vue.js&#xff0c;但对Vue.js框架设计感兴趣…

个性化DIY制作硬模空心耳机壳使用什么?

制作硬模空心耳机壳需要使用到以下工具和材料&#xff1a; 硬质材料&#xff1a;如金属、塑料、UV树脂胶液等&#xff0c;用于制作耳机壳的硬质部分。模具&#xff1a;用于制作耳机壳的形状和尺寸&#xff0c;可以使用塑料、金属等材料制作模具。连接器和线材&#xff1a;用于…

AES加密原理

AES是一个迭代的、分组密码加密方式&#xff0c;可以使用128 、192和256位密钥。与 公共密钥密码使用密钥对不同&#xff0c;对称密钥密码使用相同的密钥加密和解密数据。 通过分组密码返回的加密数据的位数与输入数据相同。迭代加密使用一个循环结 构&#xff0c;在该循环中重…

vue3项目中如何实现图片的二次处理

在说这个之前&#xff0c;我们要先理解图片的二次处理与图片压缩之间的差异。 图片的二次处理除了对图片进行压缩&#xff0c;还可以进行更多特效的处理&#xff0c;可以对图片进行宽高的重设&#xff0c;图像位置适应性调整&#xff0c;清晰的的控制&#xff0c;背景颜色的添…

90.网游逆向分析与插件开发-游戏窗口化助手-项目需求与需求拆解

内容参考于&#xff1a;易道云信息技术研究院VIP课 上一个内容&#xff1a;实现物品使用策略的功能-CSDN博客 项目需求&#xff1a; 在游戏窗口化时&#xff0c;可以在游戏之外弹出一个窗口&#xff0c;可以隐藏或者显示游戏窗口&#xff0c;显示游戏人物的基本状态&#xff…

CMake生成osg的FFMPEG插件及Windows下不生成VS工程问题解决

在Windows下&#xff0c;如何利用CMake生成osg的FFMPEG插件&#xff0c;请参考如下博文&#xff0c;同生成jpeg插件类似&#xff1a; osg第三方插件的编译方法&#xff08;以jpeg插件来讲解&#xff09;。 如下为生成FFMPEG时必要的设置&#xff1a; 注意&#xff1a; 一定要…

【蓝桥杯】环形链表的约瑟夫问题

目录 题目描述&#xff1a; 输入描述&#xff1a; 输出描述&#xff1a; 示例1 解法一&#xff08;C&#xff09;&#xff1a; 解法二&#xff08;Cpp&#xff09;&#xff1a; 正文开始&#xff1a; 题目描述&#xff1a; 据说著名犹太历史学家 Josephus 有过以下故事&a…