本文详细解析JavaScript中“...”符号的两种核心用法：扩展运算符用于数组拼接、函数传参及对象浅拷贝；剩余参数用于收集多个参数为数组。结合具体代码实例，展示如何在实际开发中利用这些特性简化代码并提升可维护性。
一、扩展运算符（Spread Operator）
在数组操作中，该运算符可将一个数组的内容展开并合并到另一个数组中。例如：
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combinedArray = [...arr1,...arr2];
console.log(combinedArray); // [1, 2, 3, 4, 5, 6]在调用函数时，利用该运算符展开数组作为参数，可使函数接收任意数量的参数。例如：
function sum(a, b, c) {
return a + b + c;
}
const numbers = [1, 2, 3];
console.log(sum(...numbers)); // 6在对象操作中，该运算符可将源对象的属性复制到目标对象中。例如：
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3,...obj1 };
console.log(obj2); // { c: 3, a: 1, b: 2 }二、剩余参数（Rest Parameters）
在函数定义中，“...”可用于将多个传入参数收集到一个数组中。例如：
function addNumbers(...numbers) {
return numbers.reduce((sum, num) => sum + num, 0);
}
console.log(addNumbers(1, 2, 3, 4, 5)); // 15在此函数中，“numbers”是一个包含所有传入参数的数组。可以使用数组的方法如“reduce”来处理这些参数。
三、实际代码实例
this.data.orderList
.filter(item => item.quantity > 0)
.map(item => ({
...item,
ticket_des: '' // 直接将ticket_des设置为空字符串
}));在这段 JavaScript 代码中，...item是扩展运算符的用法。
这里是在对数组进行map操作时，将原数组中的每个元素（这里是对象item）进行扩展，并添加一个新的属性ticket_des且设置为空字符串，从而创建一个新的对象。
这种用法可以避免手动逐个复制对象的已有属性，使得代码更加简洁和易于维护。例如，如果原对象item有属性a、b、c，使用...item后，新对象会自动包含这些属性，然后再加上新设置的ticket_des属性。
到此这篇关于JavaScript 中“...” 的多种用途的文章就介绍到这了,更多相关js “...” 的多种用途内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！