ES6新增的扩展运算符8种用法[前端JavaScript]
最新回答
葬婲
2026-10-28 00:54:13
扩展运算符（...）是ES6新增的功能，能够将可迭代对象展开为独立元素，简化代码编写。
可迭代对象包括数组、字符串、Set、Map、DOM节点等，能够用for of循环遍历。
1. **合并操作**
合并数组：使用扩展运算符可以简便地将数组合并。
合并对象：合并时，相同键值会覆盖，即最后一个对象的值会替换掉已有值。
2. **拷贝数组对象**
扩展运算符用于拷贝数组，实现深拷贝。深拷贝表示对象内部的值也独立复制，二者内存地址不同，互不影响。
对于一维数组，使用扩展运算符实现深拷贝。
对于二维数组，仅对第一层实现深拷贝。
对象拷贝仅对第一层实现深拷贝。
3. **参数传递**
计算数组的最大最小值，扩展运算符使用方便。
将数组作为函数参数传递，如`sum(...[2024,2])`和`sum(...[2024,-2000,999])`，结果分别为`2026`和`24`。
注意事项：扩展运算符传递多个参数至函数，仅考虑前两个参数。
4. **数组去重**
- 结合`Set`实现数组元素去重。
5. **字符串转字符数组**
- 通过扩展运算符将字符串转换为字符数组。
6. **解构变量**
数组解构：将数组元素分别赋值给变量。
对象解构：将对象属性赋值给变量。
7. **打印日志**
- 使用扩展运算符打印可迭代对象中的每一项。
8. **NodeList转数组**
- NodeList对象代表节点集合，使用扩展运算符轻松转换为数组。
总结了扩展运算符的8种用法，包括合并操作、深拷贝、参数传递、数组去重、字符串转数组、解构变量、打印日志以及NodeList转数组，这些应用能够有效提升JavaScript编程效率。
热门标签
