在 JavaScript 中,三个连续的点 ...
可以用于不同的情况和用途。下面是一些常见的用法:
扩展运算符(Spread Operator)
...
可以用作扩展运算符,用于展开可迭代对象(如数组、字符串等)。
在函数调用中,可以使用扩展运算符将数组展开为独立的参数。
在数组字面量中,可以使用扩展运算符将一个数组的元素添加到另一个数组中。
示例:
const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const mergedArray = [...array1, ...array2]; // 合并数组
console.log(mergedArray); // 输出: [1, 2, 3, 4, 5, 6]
function foo(x, y, z) {
console.log(x, y, z);
}
const args = [1, 2, 3];
foo(...args); // 传递数组元素作为参数
剩余参数(Rest Parameters)
...
可以用作剩余参数语法,用于将函数的多个参数收集到一个数组中。
在函数声明中,使用剩余参数语法可以接收不定数量的参数,并将它们存储在一个数组中。
示例:
function sum(...numbers) {
let total = 0;
numbers.forEach((num) => {
total += num;
});
return total;
}
console.log(sum(1, 2, 3)); // 输出: 6
console.log(sum(4, 5, 6, 7, 8)); // 输出: 30
拓展:函数的arguments参数列表
arguments
是一个特殊的对象,在函数内部可以直接使用,无需加上this
。
在 JavaScript 的函数中,arguments
对象包含了所有传递给函数的参数。它是一个类似数组的对象,可以通过索引访问每个参数的值,并且具有length
属性表示参数个数。
注意:arguments
对象不是一个真正的数组,它只是一个类似数组的对象,所以它没有数组的方法,如forEach
和map
等。
示例:
let arguments = '123';
function foo(){
console.log(arguments);
}
foo(1, 2, 3); // 输出 [Arguments] { '0': 1, '1': 2, '2': 3 }
展开对象(Object Spread)
在 ECMAScript 2018(ES2018)及之后的版本中,...
可以用于展开对象的属性。
使用对象展开语法可以创建新的对象,并将现有对象的属性复制到新对象中。
示例:
const obj1 = { x: 1, y: 2 };
const obj2 = { ...obj1, z: 3 };
console.log(obj2); // 输出: { x: 1, y: 2, z: 3 }
console.log(...obj1); // 报错: TypeError: Found non-callable @@iterator
解构赋值中的剩余项(Rest in Destructuring)
在解构赋值中,...
可以用于提取剩余的数组元素或对象属性。
在数组解构赋值中,剩余项可以收集剩余的数组元素。
在对象解构赋值中,剩余项可以收集剩余的对象属性。
示例:
const [a, b, ...rest] = [1, 2, 3, 4, 5];
console.log(a); // 输出: 1
console.log(b); // 输出: 2
console.log(rest); // 输出: [3, 4, 5]
const { x, y, ...rest } = { x: 1, y: 2, z: 3, w: 4 };
console.log(x); // 输出: 1
console.log(y); // 输出: 2
console.log(rest); // 输出: { z: 3, w: 4 }
这些是 ...
在 JavaScript 中的一些常见用法和功能。具体使用哪种功能取决于上下文和需求。
Comments NOTHING