欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 科技 > 能源 > JavaScript 中“...” 的多种用途

JavaScript 中“...” 的多种用途

2025/7/14 4:31:19 来源:https://blog.csdn.net/qq_41628475/article/details/141933822  浏览:    关键词: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有属性abc,使用...item后,新对象会自动包含这些属性,然后再加上新设置的ticket_des属性。

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

热搜词