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

对象扩展运算符

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. 第06组 Beta冲刺(1/4)

    队名:福大帮 组长博客链接: https://www.cnblogs.com/mhq-mhq/p/11990568.html 作业博客 : https://edu.cnblogs.com/campus ...

  2. 测量MySQL的表达式和函数的速度

    测量MySQL的表达式和函数的速度,可以调用benchmark()函数.语法格式是benchmark(loop_count,expr).运行的返回值是0,但是mysql会打印一行显示语句大概要执行多长 ...

  3. postgresql - relation 权限相关问题

    GRANT ALL PRIVILEGES ON DATABASE 数据库.[schema] TO [用户名]; GRANT ALL ON schema [schema] TO [用户名]; GRANT ...

  4. 微信小程序开发——微信小程序下拉刷新真机无法弹回

    开发工具中下拉之后页面回弹有一定的延迟,这个时间也有点久.真机测试,下拉后连回弹都没有,这个问题要解决,就得在下拉函数里加上停止下拉刷新的API,如下: /** * 下拉刷新 */ onPullDow ...

  5. Android 多用户

    下面几篇介绍的不错,推荐看看 https://www.jianshu.com/p/3ad2163f7d34   Android 9.x 多用户机制 1 #Profile user创建过程 https: ...

  6. pytorch torch.backends.cudnn设置作用

    cuDNN使用非确定性算法,并且可以使用torch.backends.cudnn.enabled = False来进行禁用 如果设置为torch.backends.cudnn.enabled =Tru ...

  7. matlab学习笔记7-定时器

    一起来学matlab-matlab学习笔记7-定时器 觉得有用的话,欢迎一起讨论相互学习~Follow Me 参考书籍 <matlab 程序设计与综合应用>张德丰等著 感谢张老师的书籍,让 ...

  8. 改进初学者的PID-初始化

    最近看到了Brett Beauregard发表的有关PID的系列文章,感觉对于理解PID算法很有帮助,于是将系列文章翻译过来!在自我提高的过程中,也希望对同道中人有所帮助.作者Brett Beaure ...

  9. 查看已安装dpkg包的poinst安装文件

    /var/lib/dpkg/info |grep printburn(软件名称) /var/lib/dpkg/info 文件都在这个目录下面poinst, preinst,prerm等

  10. linux信号--阻塞与未决

    执行信号的处理动作称为信号递达(Delivery),信号从产生到递达之间的状态,称为信号未决(Pending). 进程可以选择阻塞(Block)某个信号.被阻塞的信号产生时将保持在未决状态,直到进程解 ...