...Rest参数和扩展运算符(ES5和ES6的求和运算方法)
...Rest参数和扩展运算符
-
Rest 参数
-
- ES5中的求和运算(使用arguments对象)
- ES6中的求和运算
-
扩展运算符
-
小技巧(ES6中的数组合并)
Rest 参数
编写函数时,在某些情况下我们不确定参数的数量。例如,在处理求和运算时,过去我们通常是这样编写的。
ES5中的求和运算(使用arguments对象)
function sum() {
let num = 0
Array.prototype.forEach.call(arguments, function(item) {
num += item
})
return num
}
console.log(sum(1, 2, 3)) // 6
console.log(sum(1, 2, 3, 4)) // 10
如前述,在之前的讨论中提到过,在ES5版本中是可以这样编写的代码。然而,在ES6版本中则无法采用这种方法,主要由于arguments属性发生了变化。现在需要遵循以下方式进行编写:
ES6中的求和运算
function sum(...nums) {
let num = 0
nums.forEach(function(item) {
num += item
})
return num
}
console.log(sum(1, 2, 3)) // 6
console.log(sum(1, 2, 3, 4)) // 10
当然,Rest Parameter 也可以和其他参数一起来用,比如:
function sum(base, ...nums) {
let num = base
nums.forEach(function(item) {
num += item
})
return num
}
console.log(sum(30, 1, 2, 3)) // 36
console.log(sum(30, 1, 2, 3, 4)) // 40
请各位注意,请问:arguments 不是数组对象,请问:arguments 是否具备作为内置方法forEach所需的特定属性?另一方面,请确认 Rest Parameter 是否具备作为数组对象的所有必要条件?如果确认无误,则请继续下一步操作
请各位注意,请问:arguments 不是数组对象,请问:arguments 是否具备作为内置方法forEach所需的特定属性?另一方面,请确认 Rest Parameter 是否具备作为数组对象的所有必要条件?如果确认无误,则请继续下一步操作
扩展运算符
虽然形状相似但却具有相反功能的运算符,在JavaScript中主要分为两种:一种是用于接收非固定数量参数的Rest Parameter运算符;另一种则是用于将一个固定长度数组拆解为多个独立参数使用的Spread Operator运算符。其中,Rest Parameter运算符的作用是将一系列非固定数量的参数合并成一个数组;而Spread Operator运算符则会将一个固定长度的数组拆解为各个对应位置的参数。
function sum(x = 1, y = 2, z = 3) {
return x + y + z
}
console.log(sum(...[4])) // 9
console.log(sum(...[4, 5])) // 12
console.log(sum(...[4, 5, 6])) // 15
通过前面两个示例的学习,请大家仔细体会rest parameters的作用以及spread operators的应用场景。rest parameters用于处理函数参数数量不固定的场景。若无此类语法支持,则需采取以下措施:
function sum(x = 1, y = 2, z = 3) {
return x + y + z
}
console.log(sum.apply(null, [4])) // 9
console.log(sum.apply(null, [4, 5])) // 12
console.log(sum.apply(null, [4, 5, 6])) // 15
小技巧(ES6中的数组合并)
let arr1=[1,2,3];
let arr2=[4,5,6];
console.log(arr1.push(...arr2),arr1);
