扩展运算符（...）对对象进行浅拷贝，仅复制第一层可枚举、非symbol属性，不处理原型链、getter/setter及嵌套引用，{...obj}等价于object.assign({}, obj)。

用扩展运算符（...）对对象做浅拷贝，就是把原对象第一层的可枚举属性复制到一个新对象里，不深入嵌套结构。

扩展运算符浅拷贝的基本写法

语法很简单：在对象字面量中用 {...obj} 包裹原对象。

• 它只复制对象自身、可枚举、非 Symbol 的属性
• 不会拷贝原型链上的属性，也不会处理 getter/setter（会直接取值）
• 遇到嵌套对象或数组时，复制的是引用，不是新副本

实际例子看效果

比如有这样一个对象：

chartjs-reporter

此技能用于在用户需要将结构化数据（查询结果、CSV 摘要、JSON 记录或 Python 字典/列表）转换为独立的 HTML 页面时使用。

下载

const user = { name: 'Alice', age: 30, address: { city: 'Beijing' } };

用扩展运算符拷贝：

const copy = { ...user };

• copy.name 和 copy.age 是独立值，修改不影响原对象
• copy.address === user.address 为 true，说明 address 是同一引用
• 如果改 copy.address.city = 'Shanghai'，user.address.city 也会变

注意边界情况

扩展运算符对以下情况有特定行为：

• 遇到 null 或 undefined 会报错，需提前判断
• 不能直接用于类数组对象（如 arguments），要先转成数组或用 Object.assign
• Symbol 属性会被忽略：{ ...{ [Symbol('a')]: 1 } } 得到空对象 {}
• 同名属性后出现的会覆盖前面的：{ ...{a: 1}, a: 2 } 结果是 {a: 2}

和 Object.assign 的等价性

{...obj} 在功能上基本等价于 Object.assign({}, obj)，都是浅拷贝第一层。区别在于扩展运算符更简洁、支持解构组合，而 Object.assign 可以接受多个源对象并支持更灵活的目标控制。