es6展开运算符
数组的展开合并
现在有两个数组[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展开运算符的更多相关文章
- ES6展开运算符数组合并,函数传参
定义: .展开运算符允许一个表达式在某处展开. 使用场景 1.展开函数在多个参数的地方使用 .意指用于函数传参 2.多个元素的地方使用,意指用于数组字面量 3.多个边框的地方使用,意指用于解构赋值 函 ...
- [转] ES6展开运算符
语法 用于函数调用 myFunction(...iterableObj); 用于数组字面量 [...iterableObj, 4, 5, 6] 函数传参 目前为止,我们都是使用Function.pro ...
- ES6展开运算符的3个用法
展开运算符的用法1:传参 // 展开运算符的用法1 : 传参 function test(a,b) { return a + b ; } var arr = [1,2]; console.log(te ...
- es6 ...展开运算符
展开运算符,目前应用在数组上,对象展开运算符,将在es7 提案 1.两个对象连接返回新的对象 let a = {aa:'aa'} let b = {bb:'bb'} let c = {...a,. ...
- ES6展开运算符(...)
数组字面量中使用展开运算符 我们可以这样合并数组: var arr1=['a','b','c']; var arr2=[...arr1,'d','e']; //['a','b','c','d','e' ...
- ES6 展开运算符 三个点实际功能
1.数组中使用let defaultColors = ['red', 'greed'] let favoriteColors = ['orange', 'yellow'] let fallColors ...
- es6 初级之展开运算符
1.1 先看一个求最大值的例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- [js高手之路] es6系列教程 - 不定参数与展开运算符(...)
三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式: 在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...
- javascript es6系列教程 - 不定参数与展开运算符(...)
三个点(...)在es6中,有两个含义: 用在形参中, 表示传递给他的参数集合, 类似于arguments, 叫不定参数. 语法格式: 在形参面前加三个点( ... ) 用在数组前面,可以把数组的值 ...
随机推荐
- input[checkbox],input[radiobox]的一些问题
复选框和文字对不齐:checkbox复选框的一些深入研究与理解: 解决方案:复选框或单选框与文字对齐的问题的深入研究与一 实例:实例.
- Linux如何用查看域名解析
方法/步骤 查看本地dns配置.确保能上网,dns配置正确.可以查看网卡配置文件和dns配置文件,网卡里配置优先. ping命令.第一行会返回域名及解析的ip. host命令.会返回域 ...
- ArrayList相关方法介绍及源码分析
目录 ArrayList简介: ArrayList 相关方法介绍 代码表示 相关方法源码分析 ArrayList简介: java.util.ArrayList 是我们最常用的一个类,ArrayList ...
- 从左到右的滑块-Au3
说明:使用selenium自动化登陆时会弹出滑块,做人机识别,使用Au3模拟鼠标移动轨迹--可验证通过 #include <MsgBoxConstants.au3> #include &l ...
- Python3基础(5)常用模块:time、datetime、random、os、sys、shutil、shelve、xml处理、ConfigParser、hashlib、re
---------------个人学习笔记--------------- ----------------本文作者吴疆-------------- ------点击此处链接至博客园原文------ 1 ...
- 在sublime text3下,用快捷键把文件打开到浏览器中
使用背景 在编辑html或者js文件的时候,是否想在浏览器中预览一下, 你的步骤可能是这样的: 找到编辑文件的位置, 右键使用某一浏览器打开.如果是这样,你就out了, 因为在sublime中有更加简 ...
- 禁止Asp.Net WebService 的Test页面功能
只需要Web.Config里面添加: <system.web> <webServices> <protocols> <remove name="Ht ...
- hibernate课程 初探单表映射2-2 hibernate常用配置
1 hibernate.cfg.xml常用配置: show_sql 控制台打印sql format_sql 控制台将sql排版 hbm2ddl.auto: create 删除表结构,重新建表并插值 u ...
- Django之model基础(增删改查)
一.ORM 映射关系 表名 <-------> 类名 字段 <-------> 属性 表记录 <------->类实例对象二.创建表(建立模型) 在创建表之前的准备 ...
- 做一个vue模态弹出框如何
运用的知识点包括: 路由的配置 插槽 vue的过渡动画 路由重定向 router/index.js里面配置路由 import Vue from 'vue' import Router from 'vu ...