ES6 延展操作符
ES6 操作符
2023-09-11 14:18:07 时间
延展操作符(Spread operator)
延展操作符 = ...可以在函数调用/数组构造时,将数组表达式或者string在语法层面展开,还可以在构造对象时,将对象表达式按key-value的方式展开。
1 函数调用 2 function(...iterableObj) 3 4 数组构造或者字符串 5 6 [...iterableObj,'4',...'hello',6] 7 8 es2018下构造对象时,进行克隆或者属性拷贝 9 10 let objClone={...obj}
应用场景:
1 function sum(x,y,x){ 2 3 return x+y+z 4 5 } 6 7 const numbers = [1,2,3] 8 9 不使用延展操作符 10 11 sum.apply(null, numbers) 12 13 使用延展操作符 14 15 sum(...numbers) 16 17 或者在构造数组时 18 19 如果没有展开语法,只能组合使用push,splice,concat,slice 20 将已有数组元素变为新数组的一部分 21 22 const people=['jan','tom'] 23 const person = ['ali',...people,'alliance','ketty'] 24 console.log(person)//Ali,jan,tom,alliance,ketty 25 26 另外,还有一个例子 27 28 var arr =[1,2,3] 29 var arr2=[...arr] 30 arr2.push(4) 31 console.log(arr2)//1,2,3,4
展开语法与Obj.assign()行为一致,都是执行浅拷贝,也就是只遍历一层,不会遍历父对象相关的数据
1 var arr1=[0,1,2] 2 var arr2=[3,4,5] 3 var arr3=[...arr1,...arr2] 等同于var arr4 = arr1.concat(arr2)
es2018中增加了对对象的支持
1 var obj1 = {foo:1,foo2:2} 2 var obj2={foo3:12,foo4:30} 3 4 var clonedObj={...obj1} 5 var mergedObj={...obj1,...obj2}
相关文章
- es6 - 回调深渊
- ES6(十一)Set和Map
- [转]30分钟掌握ES6/ES2015核心内容(上)
- ES6及ES6+对象、数组方法使用(含力扣题目)持续更新...
- React ES5 (createClass) 和 ES6 (class)
- ES6基础入门之let、const
- ES6+ Number 对象的方法
- ES6 数组方法 find 和 findIndex 区别
- es6--扩展运算符回顾
- ES6之Array.find()和findIndex()函数的用法
- JavaScript、ES5和ES6的介绍和区别
- es6数组去重
- ES6中关于数据类型的拓展:Symbol类型
- VUE 爬坑之旅 -- 用 ES6 语法写一个工具类,并全局引用