如何向数组推送N个初始值相同但相互独立的不同对象

你判断的完全正确，你写的循环推入逻辑确实是把同一个memberCard对象的引用重复存入数组。JavaScript里对象是引用类型，变量保存的是对象在堆内存的访问地址，重复push同一个对象变量，本质是把同一个地址多次塞进数组，后续修改数组里任意一个元素的属性，所有元素都会同步变更，因为它们指向的是同一块内存空间。

要实现推入N个互相独立、修改互不影响的默认值对象，核心是每次推入时都生成全新的对象实例，不要复用外层定义的单个对象引用。下面是两种可直接落地的实现：

方案1：循环内生成新对象（可读性最好） #

先把默认值抽为模板常量，每次循环时基于模板生成新副本再推入。由于IMemberCard的所有属性都是原始值（null、字符串、数字），用对象展开运算符做浅拷贝就完全能保证实例独立：

const defaultMemberCard: IMemberCard = {
  id: null,
  name: 'Member',
  rating: null,
  photoUrl: '/assets/images/user.png',
  type: null,
  eventCount: null,
  experienceLevel: null,
  years: null,
  certification: null,
  isPriority: null,
  memberStatus: null,
  receiveNotification: null
};

const memberCardArray: IMemberCard[] = [];
for (let i = 0; i < this.yogaband.members; i++) {
  memberCardArray.push({ ...defaultMemberCard });
}

方案2：Array.from 批量生成（代码更简洁） #

不需要手写for循环的话，可以直接用Array.from生成指定长度的数组，通过回调函数为每一项返回独立的新对象：

const defaultMemberCard: IMemberCard = {
  id: null,
  name: 'Member',
  rating: null,
  photoUrl: '/assets/images/user.png',
  type: null,
  eventCount: null,
  experienceLevel: null,
  years: null,
  certification: null,
  isPriority: null,
  memberStatus: null,
  receiveNotification: null
};

const memberCardArray: IMemberCard[] = Array.from(
  { length: this.yogaband.members },
  () => ({ ...defaultMemberCard })
);

避坑提示：这个场景不需要用JSON.parse(JSON.stringify(defaultMemberCard))做深拷贝，当前对象没有嵌套引用类型属性，深拷贝属于冗余操作，还会带来不必要的性能损耗，遇到特殊值时甚至可能出现序列化异常。

内容的提问来源于stack exchange，提问作者chuckd