关于ES6的对象扩展运算符
对象的扩展运算符(...),用于取出参数对象中的所有可遍历属性,然后拷贝到当前对象之中
对象扩展运算符:
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的对象扩展运算符的更多相关文章
- ES6学习笔记-扩展运算符(...)
扩展运算符的定义: es6中引入扩展运算符(...),它用于把一个数组转化为用逗号分隔的参数序列. 它常用在不定参数个数时的函数调用,数组合并等情形. 用法一:不定参数个数时的函数调用 <scr ...
- 对象扩展运算符(…)与rest运算符
对象扩展运算符(…) 当编写一个方法时,我们允许它传入的参数是不确定的.这时候可以使用对象扩展运算符来作参数,看一个简单的列子: function xzdemo(...arg){ console.lo ...
- react中对象扩展运算符使用问题
看别人代码看到 render() { return <Modal {...this.props}> {this.props.children} </Modal> } 对其中的{ ...
- es6 学习小记 扩展运算符 三个点(...)
参考: es6 扩展运算符 三个点(...) 经常回顾,方能真正掌握. 一.含义 扩展运算符( spread )是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. ...
- ES6数组的扩展运算符
一.基本使用 ES6中函数可以使用 rest参数 接收函数的多余参数,组成一个数组,放在形参的最后面. let fn = (a, ...value) => { console.log(a); c ...
- (...)ES6三点扩展运算符
扩展运算符将一个数组转为用逗号分隔的参数序列 console.log(...[a, b, c]) // a b c 用于: 1 将一个数组,变为参数序列 let add = (x, y) => ...
- Vue的三个点es6知识,扩展运算符
Vue中的三个点在不同情境下的意思 操作数组 //里面放自己定义的方法 methods: { /** * 把数组中的元素孤立起来 */ iClick() { let iArray = ['1', '2 ...
- es6可变参数-扩展运算符
es5中参数不确定个数的情况下: //求参数和 function f(){ var a = Array.prototype.slice.call(arguments); var sum = 0; a. ...
- JavaScript:学习笔记(8)——对象扩展运算符
JavaScript:学习笔记(8)——扩展运算符 对象的扩展运算符 扩展运算符是三个点(...).用于取出参数对象的所有可遍历属性,然后拷贝到当前对象之中. 如上图所示,新建了一个对象a,然后通过扩 ...
随机推荐
- linux学习(4):linux常用命令(50个)
linux常用命令(50个) 1. find 基本语法参数如下: find [PATH] [option] [action] # 与时间有关的参数: -mtime n : n为数字,意思为在n天之前的 ...
- Mybatis源码研究7:缓存的设计和实现
Mybatis源码研究7:缓存的设计和实现 2014年11月19日 21:02:14 酷酷的糖先森 阅读数:1020 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog ...
- 运维笔记--ubuntu安装指定版本的RabbitMQ
场景描述: 日常开发or生产环境经常会需要安装指定版本的软件,出于和其他软件的配合兼容性,以及稳定性的考虑. 现在我们的需求是安装指定版本的RabbitMQ,版本号: 操作步骤: 注意事项: 异常处理 ...
- 虚拟机VirtualBox 共享挂载问题:mount: /mnt/xxx: wrong fs type, bad option, bad superblock on xxx
设置好共享文件夹之后,在/mnt下面建立了一个wwwroot文件夹,然后去欢天喜地的去挂载, mount -t vboxsf www /mnt/wwwroot 结果系统提示: mount: /mnt/ ...
- Linux_CentOS 中systemctl 管理服务、防火墙 firewalld 以及 SELinux 配置
使用 systemctl 管理服务 systemctl 就是 service 和 chkconfig 这两个命令的整合,在 CentOS 7 就开始被使用了,systemctl是系统服务管理器命令,它 ...
- [译]如何取消本地的git commit提交?
git reset HEAD~1 原文来源:https://stackoverflow.com/questions/4850717/how-to-cancel-a-local-git-commit
- 开发日记:常用BAT批处理
备份文件:BackupSourceCode.bat ::自动备份当前文件夹 ::by luomg, 21:15 2010-10-13 ::minguiluo@163.com @echo off tit ...
- C# .NET 私钥 RSA2,SHA256,签名
私钥长度2048 -- /// <summary> /// 生成签名 /// </summary> /// <param name="str"> ...
- LeetCode,3. 无重复字符的最长子串
看了各位大神的,真是难堪,尤其是各种c++动不动就击败99%...我用python,换了三次算法,改了十几次bug,才击败5%....贴出来纪念下吧. 题目如下: 给定一个字符串,请你找出其中不含有重 ...
- LeetCode 1051. 高度检查器(Height Checker) 28
1051. 高度检查器 1051. Height Checker 题目描述 学校在拍年度纪念照时,一般要求学生按照 非递减 的高度顺序排列. 请你返回至少有多少个学生没有站在正确位置数量.该人数指的是 ...