对象的扩展运算符(...),用于取出参数对象中的所有可遍历属性,然后拷贝到当前对象之中

对象扩展运算符

1. 复制对象

let obj1 = { x: 1, y: 2, z: 3 }

let obj2 = { ...obj1 }

obj2 = { x: 1, y: 2, z: 3 }

2. 合并对象

let obj1 = { x: 1, y: 2, z: 3 }

let obj2 = { x: 4, y: 5, z: 6 }

let obj3 = { ...obj1, ...obj2 }

obj3 = { x: 1, y: 2, z: 3, x: 4, y: 5, z: 6 }

3. 自定义属性

let obj1 = { x: 1, y: 2, z: 3 }

let obj2 = { ...obj1, a: 4, b: 5, c: 6 }

obj2 = { x: 1, y: 2, z: 3, a: 4, b: 5, c: 6 }

注意:若自定义属性在扩展运算符的后面,且与扩展运算符内的属性同名,则扩展运算符内的属性会被覆盖掉

数组扩展运算符

1. 复制数组

let arr1 = [1, 2, 3]

let arr2 = [ ...arr1 ]

arr2 = [1, 2, 3]

2. 合并数组

let arr1 = [1, 2, 3]

let arr2 = [4, 5, 6]

let arr3 = [ ...arr1, ...arr2 ]

arr3 = [1, 2, 3, 4, 5, 6]

3. 字符串变数组

let arr1 = [1, 2, 3]

let str1 = 'hello'

let arr2 = [...arr1, ...str1]

arr2 = [ 1, 2, 3, "h", "e", "l", "l", "o" ]

关于ES6的对象扩展运算符的更多相关文章

  1. ES6学习笔记-扩展运算符(...)

    扩展运算符的定义: es6中引入扩展运算符(...),它用于把一个数组转化为用逗号分隔的参数序列. 它常用在不定参数个数时的函数调用,数组合并等情形. 用法一:不定参数个数时的函数调用 <scr ...

  2. 对象扩展运算符(…)与rest运算符

    对象扩展运算符(…) 当编写一个方法时,我们允许它传入的参数是不确定的.这时候可以使用对象扩展运算符来作参数,看一个简单的列子: function xzdemo(...arg){ console.lo ...

  3. react中对象扩展运算符使用问题

    看别人代码看到 render() { return <Modal {...this.props}> {this.props.children} </Modal> } 对其中的{ ...

  4. es6 学习小记 扩展运算符 三个点(...)

    参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...

  5. ES6数组的扩展运算符

    一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...

  6. (...)ES6三点扩展运算符

    扩展运算符将一个数组转为用逗号分隔的参数序列 console.log(...[a, b, c]) // a b c 用于: 1 将一个数组,变为参数序列 let add = (x, y) => ...

  7. Vue的三个点es6知识,扩展运算符

    Vue中的三个点在不同情境下的意思 操作数组 //里面放自己定义的方法 methods: { /** * 把数组中的元素孤立起来 */ iClick() { let iArray = ['1', '2 ...

  8. es6可变参数-扩展运算符

    es5中参数不确定个数的情况下: //求参数和 function f(){ var a = Array.prototype.slice.call(arguments); var sum = 0; a. ...

  9. JavaScript:学习笔记(8)——对象扩展运算符

    JavaScript:学习笔记(8)——扩展运算符 对象的扩展运算符 扩展运算符是三个点(...).用于取出参数对象的所有可遍历属性,然后拷贝到当前对象之中. 如上图所示,新建了一个对象a,然后通过扩 ...

随机推荐

  1. 使用CAS实现单点登录功能

    目录 单点登录 简介 CAS服务器部署 上传tomcat服务器压缩到文件夹/usr/local/cas目录下,解压,修改tomcat文件夹名为tomcat 修改tomcat配置文件的端口号 关闭tom ...

  2. DB proxy, mysql proxy

    db proxy 在大型互联网站的数据库部署中,部署最多的数据库为MySQL.随着MySQL中Innodb存储引擎对事物的支持,MySQL在互联网公司部署中,应用量越来越多.典型应用MySQL的公司有 ...

  3. LDD3源码分析之poll分析

    编译环境:Ubuntu 10.10 内核版本:2.6.32-38-generic-pae LDD3源码路径:examples/scull/pipe.c  examples/scull/main.c 本 ...

  4. NGINX Cache Management (.imh nginx)

    In this article, we will explore the various NGINX cache configuration options, and tips on tweaking ...

  5. Zookeeper运维常用四字命令

    Zookeeper运维常用四字命令 echo stat|nc 127.0.0.1 2181 查看哪个节点被选择作为follower或者leader 使用echo ruok|nc 127.0.0.1 2 ...

  6. [E2E_L7 51CTO]进一步解析OpenVINO提供的例子并且独立出来(win+vs)

    一.例子概览 上图中标红的都是可以运行的例子,在上一个博客中已经提示.其它的是工具等辅助内容. 例子可以简单分为3类,一类是 这个是和OpenCV相关的,可以参考: 一类是 这个是入门的,优先学习 余 ...

  7. FFMPEG Tips 如何提取码流的基本信息

    原文连接: https://zhuanlan.zhihu.com/p/23448271 1. 码流中的哪些信息值得关注 ? [ ] 是否包含:音频.视频 [ ] 码流的封装格式 [ ] 视频的编码格式 ...

  8. 强化学习——如何提升样本效率 ( DeepMind 综述深度强化学习:智能体和人类相似度竟然如此高!)

    强化学习     如何提升样本效率 参考文章: https://news.html5.qq.com/article?ch=901201&tabId=0&tagId=0&docI ...

  9. 不规则的Ifc构件顶点提取方法

    BIM模型中有很多不规则的构件,在IFC中这些不规则的构件一般用顶点的形式表示,顶点坐标提取路径:  IfcObject->IfcProductDefinitionShape->IfcSh ...

  10. Linux下查找命令 —— find、grep、 which、 whereis、 locate

    find命令 基本格式 find < path > < expression > < cmd > ''' path: 所要搜索的目录及其所有子目录.默认为当前目录. ...