ES2015 ...操作符的2种用法

本文介绍了ES2015中新增的...操作符的两种主要用途:剩余参数rest和展开数组spread。rest允许开发者以数组形式接收不定数量的参数,而spread则能将数组元素逐一展开作为函数参数。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

ES2015中新增了一种...的操作符,...操作符有两个作用,rest和spread。

一、剩余参数 Rest

ES2015以前

对于未知个数的参数,如果我们想获取,是用arguments对象来接收,arguments是一个伪数组

function foo(){
	console.log(arguments)
}
foo(1,2,3,4,5,6,7)

在这里插入图片描述
ES2015以后,可以用...来代替arguments 接收剩余参数

//在形参前面加上...操作符,这个形参以数组的形式接收从当前这个位置开始往后所有的实参。可以取代以前以argumens接收无限参数的方式
function foo(...args){
	console.log(args)
}
foo(1,2,3,4,5,6,7)

在这里插入图片描述
需要注意的是,因为接收的是剩余参数 ,所以只能出现在形参的最后一位,而且只能使用一次

// ...只能出现在形参的最后一位,而且只能使用一次
function foo(first,...args){
   console.log(args)
}

二、展开数组 Spread

...操作符除了可以用来收起剩余数据这种rest用法,还有一种spread用法

ES2015以前

如果想依次把数组当作参数传入console.log这个方法,可以这样写:

const array = ['jack','luyu','amy']

console.log(array[0],array[1],array[2]) // jack luyu amy

如果参数有很多个,上面的方法就不好使了,我们可以使用apply方法

const array = ['jack','luyu','amy']

console.log(...array) // jack luyu amy

ES2015以后

我们可以使用...操作符来实现,更简便了

...操作符会自动把数组当中的每一个成员按照次序传递到参数列表中

const array = ['jack','luyu','amy']

console.log(...array) // jack luyu amy
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值