JavaScript展开运算符（…）用于将可迭代对象或类数组对象“打散”为独立元素，或提取对象属性，生成新结构而不修改原数据；支持数组合并、浅拷贝、添加元素、函数传参，以及对象合并、副本修改、剩余属性提取等，但仅浅拷贝、不可展开null/undefined、同名属性后覆盖。
JavaScript 的展开运算符（Spread Operator）是三个英文句点 …，它能把可迭代对象（如数组、字符串）或类数组对象“打散”成独立的元素，也能把对象的属性逐个取出。它不改变原数据，而是生成新结构，让数组和对象的操作更直观、更函数式。
用 … 简化数组操作
以前拼接数组要用 concat()，复制数组要写 slice() 或 Array.from()；现在一行就能搞定。
合并数组： [...arr1, ...arr2] 直接铺开两个数组的元素，比 arr1.concat(arr2) 更清晰 浅拷贝数组： const newArr = [...oldArr]，避免意外修改原数组 添加新元素： [...arr, 'new', 'item'] 或 ['first', ...arr, 'last']，位置灵活 转为参数传入函数： Math.max(...numbers) 替代 Math.max.apply(null, numbers)
用 … 简化对象操作
对象展开主要用在解构赋值、合并属性、提取剩余属性等场景，让对象组合与筛选更简洁。
合并对象： { ...obj1, ...obj2 } 会把属性依次覆盖（后出现的同名属性生效） 创建副本并修改： { ...user, name: 'Alice', age: 30 }，原对象不变，只改指定字段 提取剩余属性：解构时配合 rest 语法，如 const { id, ...rest } = user，rest 就是除 id 外的所有属性 函数参数默认值兜底：结合默认参数使用，例如 function fn({ a = 1, b = 2, ...others } = {}) { ... }
注意几个常见坑
展开运算符很轻量，但不是万能的，用错地方反而引发问题。
立即学习“Java免费学习笔记（深入）”；
只做一层浅拷贝：嵌套对象或数组内部仍共享引用，深层结构需用深拷贝方案（如 structuredClone 或第三方库） 不能直接展开 null 或 undefined：会报错 TypeError: Cannot spread non-iterable instance，建议先判断或用空数组/对象兜底，比如 [...(arr || [])] 对象展开时同名属性会覆盖：顺序很重要，{ a: 1, ...{a: 2}, ...{a: 3} } 最终 a 是 3 不能用于普通对象的 for…of 遍历：只有实现了 Symbol.iterator 的对象才能被展开，比如 Map、Set 可以，纯对象不行
基本上就这些。展开运算符本身不复杂，但用对了能让代码更干净、意图更明确，尤其适合函数式风格和不可变数据处理场景。
以上就是什么是JavaScript的展开运算符_它如何简化数组和对象的操作呢的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1543107.html
微信扫一扫 
支付宝扫一扫 
