JavaScript 中，三个点 ... 被称为“扩展运算符”（Spread Operator）

在 JavaScript 中，三个点 … 被称为“扩展运算符”（Spread Operator）。它有多种用途，其中一个常见的用途是在对象字面量中展开对象的所有可枚举属性。这种用法可以让你轻松地复制一个对象或合并多个对象。
示例写法

this.Detail = { ...this.defaultDetail };

这里使用了扩展运算符来创建 this.defaultDetail 的浅拷贝，并将其赋值给 this.Detail。这意味着 this.Detail 将拥有与 this.defaultDetail 相同的所有可枚举属性及其值，但它们是两个独立的对象。

假设 this.defaultDetail 包含以下属性：

this.defaultDetail = {
  name: 'Default Name',
  age: 25,
  address: 'Default Address'
};

那么执行 this.Detail = { …this.defaultDetail }; 后，this.Detail 将包含：

{
  name: 'Default Name',
  age: 25,
  address: 'Default Address'
}

浅拷贝 vs 深拷贝

• 浅拷贝：只复制对象的第一层属性。如果对象的属性是引用类型（如数组或其他对象），则只会复制引用，不会复制引用的对象本身。也就是说，修改引用对象的值会影响原始对象。
• 深拷贝：递归地复制对象的所有层级属性，确保新对象与原对象完全独立。

示例代码

this.defaultDetail = {
  name: 'Default Name',
  age: 25,
  address: {
    city: 'New York',
    street: 'Main St'
  }
};

// 浅拷贝
this.Detail = { ...this.defaultDetail };

// 修改 nodeDetail 的地址
this.Detail.address.city = 'Los Angeles';

console.log(this.defaultDetail); // 输出：{ name: 'Default Name', age: 25, address: { city: 'Los Angeles', street: 'Main St' } }
console.log(this.Detail);        // 输出：{ name: 'Default Name', age: 25, address: { city: 'Los Angeles', street: 'Main St' } }

可以看到，由于 address 是一个对象，所以 this.Detail.address 和 this.defaultDetail.address 实际上引用的是同一个对象。因此，修改 this.Detail.address 也会影响到 this.defaultDetail.address。