数组的展开合并

现在有两个数组[1, 2, 3, 4]和[5, 6, 7],想要将两个函数拼接成一个新的函数。

//es5的写法
let arr1 = [1, 2, 3, 4];
let arr2 = [5, 6, 7];
let arr = arr1.concat(arr2);
console.log(arr)//[ 1, 2, 3, 4, 5, 6, 7 ]
//es6的写法
let arr = [...arr1, ...arr2];
console.log(arr)//[ 1, 2, 3, 4, 5, 6, 7 ]

对象的展开合并

现在有两个对象,一个是{name:'sam'}一个是{age:8} 想要将两个对象合并。

//es5 中的合并
let obj1 = { name: '张三' }
let obj2 = { age: 9 };
let obj = {}
Object.assign(obj, obj1, obj2)
console.log(obj)//{ name: '张三', age: 9 }
//es6 中的合并
let obj1 = { name: '张三' }
let obj2 = { age: 9 };
let obj = { ...obj1, ...obj2 }
console.log(obj)//{ name: '张三', age: 9 }

展开运算符是浅拷贝

浅拷贝的值在改变原来对象内容的时候也会影响新的对象值的变化。

let  obj1  = { name:  {name:'张三'} }
let obj2 = { age: 9 };
let obj = { ...obj1, ...obj2 }
obj1.name.name='李硕';
console.log(obj)//{ name: { name: '李硕' }, age: 9 }

如果要想查看实现深拷贝的方法,请移步我的另一篇随笔:https://www.cnblogs.com/hanqingtao/p/9915886.html

es6展开运算符的更多相关文章

  1. ES6展开运算符数组合并,函数传参

    定义: .展开运算符允许一个表达式在某处展开. 使用场景 1.展开函数在多个参数的地方使用 .意指用于函数传参 2.多个元素的地方使用,意指用于数组字面量 3.多个边框的地方使用,意指用于解构赋值 函 ...

  2. [转] ES6展开运算符

    语法 用于函数调用 myFunction(...iterableObj); 用于数组字面量 [...iterableObj, 4, 5, 6] 函数传参 目前为止,我们都是使用Function.pro ...

  3. ES6展开运算符的3个用法

    展开运算符的用法1:传参 // 展开运算符的用法1 : 传参 function test(a,b) { return a + b ; } var arr = [1,2]; console.log(te ...

  4. es6 ...展开运算符

    展开运算符,目前应用在数组上,对象展开运算符,将在es7 提案 1.两个对象连接返回新的对象   let a = {aa:'aa'} let b = {bb:'bb'} let c = {...a,. ...

  5. ES6展开运算符(...)

    数组字面量中使用展开运算符 我们可以这样合并数组: var arr1=['a','b','c']; var arr2=[...arr1,'d','e']; //['a','b','c','d','e' ...

  6. ES6 展开运算符 三个点实际功能

    1.数组中使用let defaultColors = ['red', 'greed'] let favoriteColors = ['orange', 'yellow'] let fallColors ...

  7. es6 初级之展开运算符

    1.1 先看一个求最大值的例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

  8. [js高手之路] es6系列教程 - 不定参数与展开运算符(...)

    三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式:  在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...

  9. javascript es6系列教程 - 不定参数与展开运算符(...)

    三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式:  在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...

随机推荐

  1. python之垃圾回收机制

    一.前言 Python 是一门高级语言,使用起来类似于自然语言,开发的时候自然十分方便快捷,原因是Python在背后为我们默默做了很多事情,其中一件就是垃圾回收,来解决内存管理,内存泄漏的问题. 内存 ...

  2. myeclipse svn 在线安装

    https://www.cnblogs.com/sxdcgaq8080/p/6000446.html http://subclipse.tigris.org/update_1.8.x

  3. jquery json实现省市级级联

    java后台程序: import java.util.HashMap;import java.util.List;import java.util.Map; import javax.servlet. ...

  4. Javascript专题(一)严格模式

    严格模式是干什么的?它从哪里来? ECMAScript5中引入了严格模式.它为JS定义了一种不同的解析和执行模型. 摘自阮一峰博客:http://www.ruanyifeng.com/blog/201 ...

  5. bitnami-redmine Apache服务启动不起来

    方法一: 通过 netstat -a -o 查看端口占用情况,关闭调用相关端口的进程.  c:\> netstat -a -o  Active Connections  Proto  Local ...

  6. Storm概念学习系列 之数据流模型、Storm数据流模型

    不多说,直接上干货! 数据流模型 数据流模型是由数据流.数据处理任务.数据节点.数据处理任务实例等构成的一种数据模型.本节将介绍的数据流模型如图1所示. 分布式流处理系统由多个数据处理节点(node) ...

  7. Hibernate基础案例1

    使用到的是MySQL数据库 1.在项目中先引入jar包,并添加引用 <dependencies> <dependency> <groupId>junit</g ...

  8. KBEngine warring项目源码阅读(一) 项目简介和注册

    首先介绍下warring项目,是kbe自带的一个演示示例,大部分人了解kbe引擎也是从warring项目开始的. 项目地址:https://github.com/kbengine/kbengine_u ...

  9. 2 cmd中startup显示运行不了显示“不是内部或外部命令”

    解决方案: 1 在C:\Windows\System32中检查cmd.exe是否存在(如果存在的话)(检查cmd.exe是否被误删) 2 在我的电脑——属性——环境变量——在系统变量找到Path编辑前 ...

  10. Life here can be a dream come true!

    Life here can be a dream come true!美梦迟早会成真的!