ES6数据解构

ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构,解构的本质属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。如果解构不成功,变量的值就等于undefined。

1.数组解构
等号左边的变量放到中括号内部,匹配右侧数组中的元素。

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

    2.let [a,b,c,d,e]=[1,2,3,[4,5],6];
    console.log(a,b,c,d,e);

    3.不完全解构
    let [a,b,c,[d],e]=[1,2,3,[4,5,6],7];
    console.log(a,b,c,d,e);

    4.集合解构 ...扩展运算符
    let [a,...b]=[1,2,3,4,5];
    console.log(a,b);

    5.默认值解构(当匹配值严格等于undefined时,默认值生效)
    let [a=1,b=2,c=3]=[4,5,6];
    console.log(a,b,c);
    let [a=1,b=2,c=3]=[];
    console.log(a,b,c);

    6.默认值也可以是函数
    function test(){console.log('hello')}
    let [a=test()]=[1];
    console.log(a);
    let [a=test()]=[];
    console.log(a);
    
    7.let arr=[1,2,3,4];
     let [...a]=arr;
     console.log(a===arr);//false

2.对象解构
    等号左边的变量放到大括号内部,匹配右侧对象中的元素。对象的属性没有次序,变量必须与属性同名,才能取到正确的值
    1.let {foo,bar}={foo:'hello',bar:"world"};
    console.log(foo,bar);

    2.如果变量名和属性名不一致,需要重命名
    let {foo:baz}={foo:"hello",bar:"world"};   baz:hello
    
    3.对象的解构赋值是下面形式的简写 前面属性名后边变量名
    let {foo:foo,bar:bar}={foo:'hello',bar:"world"};

    4.嵌套结构
    let obj={p:['hello',{y:"world"}]};
    let {p:[a,{y:b}]}=obj;
    console.log(a,b);hello world
    
    5.默认值结构
    let {x:y=3}={};
    console.log(y);3

    经典面试题:
    const [a, b, c, ...d] = [1, 2, 3, 11, 999];
    const { e, f,f1, g, ...h } = { f: 4, g: 5, i: 6, j: 7 };
    console.log(a, b, c, d, e, f1, g, h);
3.字符串解构
    1.可以使用对象解构或者是数组解构,使用数组结构可以获取指定字符;使用对象结构可以获取实例属性方法;
    let [a,b,c]='hello';
    console.log(a,b,c);h e l
    
    2.也可以将string字符串转换为数组
    let [...arr]='hello';
    console.log(arr);
    
    3.使用对象解构
      let {toString,valueOf,length}='hello';//相当于把‘hello’当成String基本包装器类型
        console.log(toString,valueOf,length)

4.数值解构  可以获取到数值包装器构造函数原型中指定的方法。
     let {toString,valueOf}=10;
    console.log(toString,valueOf)
5.布尔值解构
    let {toString,valueOf}=true;
     console.log(toString,valueOf);

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

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

相关文章

Flyway 数据库版本管理 | 专业解决方案

前言 目前很多公司都是通过人工去维护、同步数据库脚本,但经常会遇到疏忽而遗漏的情况,同时也是非常费力耗时 比如说我们在开发环境对某个表新增了一个字段,而提交测试时却忘了提交该 SQL 脚本,导致出现 bug 而测试中断&#xf…

【Linux】进程替换

单进程版的进程替换: 现象: 运行结果: 没有执行execl后面的代码; 基本原理: 其实就相当于我自己对应的程序在运行的时候, 这个可乘程序一旦用execl来加载起来,做法特别简单粗暴,…

java--多态

1.什么是多态 多态是在继承/实现的情况下的一种现象,表现为:对象多态、行为多态。 2.多态的具体代码体现 编译看左边,运行看右边 3.多态的前提 有继承/实现关系;存在父类引用子类对象;存在方法重写 4.多态的一个注…

基于SSM乡镇自来水收费系统的设计与实现

摘 要 互联网发展至今,无论是其理论还是技术都已经成熟,而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播,搭配信息管理工具可以很好地为人们提供服务。针对乡镇自来水收费信息管理混乱,出错率高,信息安…

ARMV8 - 汇编指令 - 存储器读写指令

说明 存储器读写指令是用来读写内存/SRAM/外设寄存器等存储器的汇编指令。ARM指令集属于RISC指令集,RISC指令集采用典型的加载/存储体系结构,CPU无法对内存里的数据直接操作,只能通过Load/Store指令来实现,当我们需要对内存中的数…

Windows10找不到hosts文件的解决办法

正常情况下hosts文件在目录C:\Windows\System32\drivers\etc中,最近新装的Windows10系统发现该目录下没有hosts文件。 如下操作显示隐藏文件发现还是没有。 执行如下命令hosts文件出现: for /f %P in (dir %windir%\WinSxS\hosts /b /s) do copy %P …

分布式技术(一)分布式的架构的演进

💌 所属专栏:【微服务】😀 作 者:长安不及十里💻 工作:目前从事电力行业开发🌈 目标:全栈开发🚀 个人简介:一个正在努力学技术的Java工程师,专注基…

实现校园网开机自启动部署

❤️博客主页: iknow181🔥系列专栏: Python、JavaSE、JavaWeb、CCNP🎉欢迎大家点赞👍收藏⭐评论✍ 目录 一.准备工作 1、IDE安装 2、安装Selenium 1.介绍 2.下载 3、安装pywifi 1.介绍 2.下载 4、下载浏览器驱…

毫无基础的人如何入门 Python ?--找对学习入口是关键!

1.行百里者半三十 不少学生或职场人士总面临这样一种窘境:数字化转型大背景、大趋势下,感觉非常有必要学习Python等分析工具,但在真正学习Python的各种语言规则时,往往体验不到知识的乐趣,翻看个别章节后即束之高阁。…

7.golang指针

指针是存储另一个变量的内存地址的变量。 指针的声明 func main() {a : 255b : &afmt.Println(b)fmt.Println(*b) }& 操作符获取一个变量的指针地址。* 操作符获取指针地址的值。程序的输出为: 0xc00000a0d8 255

VUE2+THREE.JS辉光设定和解决辉光导致背景变暗的问题

THREE.JS辉光设定和解决辉光导致背景变暗的问题 THREE.JS 辉光设定THREE.JS 辉光导致背景变暗的问题1.设定背景图片2.初始化辉光3. animate 一直渲染辉光 THREE.JS 辉光设定 给我的设计好的fbx模型,已经设定好了模型发光材质,所以直接添加辉光效果,就可以自动发光 blender模型生…

前馈全连接层

B站教学视频链接:2.3.4前馈全连接层-part2_哔哩哔哩_bilibili

力扣1089题 复写零 双指针解法

2. 复写零 给你一个长度固定的整数数组 arr ,请你将该数组中出现的每个零都复写一遍,并将其余的元素向右平移。 注意:请不要在超过该数组长度的位置写入元素。请对输入的数组 就地 进行上述修改,不要从函数返回任何东西。 示例 1&…

微信小程序input type=nickname不能触发隐私政策?小程序隐私协议开发指南之nickname权限篇

小程序隐私协议开发指南之nickname权限篇 涉及处理用户个人信息的小程序开发者,需通过弹窗等明显方式提示用户阅读隐私政策等收集使用规则。 为规范开发者的用户个人信息处理行为,保障用户合法权益,微信要求开发者主动同步微信当前用户已阅读并同意小程序的隐私政策等收集使…

docker 推送tar包到远程仓库

tar 包 推送到远程仓库的步骤 - 导入镜像(docker load -i 镜像名称)示例:docker load -i yiyi-admin.tar- 打标签(docker tag 镜像id registry.cn-hangzhou.aliyuncs.com/空间名称/镜像名称:版本号)示例:docker tag $image_id reg…

Android 12.0 修改Android系统的通知自动成组的数量

场景: Android 系统对显示在通知列表中的同一个应用的通知进行分组管理,即相同的packageName中,当通知数量达到系统默认指定的数量时,会自动成一组. Android 12.0 中系统默认的自动成组数如下所示: 核心路径 : frameworks/base/core/res/res/values/config.xml<!-- 来自同…

AI 编程如何助力开发者高效完成架构设计工作?

▼最近直播超级多&#xff0c;预约保你有收获 今晚直播&#xff1a;《AI 编程技术架构剖析和案例开发实战》 —1— AI 编程能帮我们完成哪些工作&#xff1f; 从目前企业级种种现实场景应用来看&#xff0c;AI 编程已经成为一种帮助开发者解决架构设计复杂问题、提高编程效率以…

adb 命令获取当前页面的包名

adb shell "dumpsys window | grep mCurrentFocus"

使用OpenCompass评测rwkv模型教程

0x0. 前言 继续MLC-LLM 支持RWKV-5推理以及对RWKV-5的一些思考文章里面提到的想法&#xff0c;探索一下使用OpenCompass来评测RWKV模型&#xff0c;对模型的实际表现有一个更客观的了解。我在尝试的过程中也碰到了一些问题&#xff0c;所以这里记录一下使用OpenCompass评测的流…

Node【工具 01】Node Version Manager nvm安装使用(Node.js版本管理工具)

1.介绍 非专业前端开发工程师在构建项目时遇到如下问题&#xff1a; ERROR: This version of pnpm requires at least Node.js v16.14 The current version of Node.js is v14.17.0 Visit https://r.pnpm.io/comp to see the list of past pnpm versions with respective Nod…