ES6 延展操作符

延展操作符(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}

 



 

posted @   方帅  阅读(1620)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
阅读排行:
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?
点击右上角即可分享
微信分享提示