Typescript创建带默认值的固定长度对象数组 支持push替换默认值

核心实现代码 #

// 自定义对象类型，可根据实际业务调整
interface CustomObject {
  // 示例字段，可替换为你需要的属性
  content: string;
}

class FixedLengthObjArray<T> {
  // 内部存储数组
  #innerArray: T[];
  // 固定长度配置
  readonly #maxLength = 3;
  // 下一个待替换的位置索引
  #nextIndex = 0;

  // 构造函数传入默认对象生成函数，保证每个默认对象独立
  constructor(defaultGenerator: () => T) {
    // 用Array.from避免fill带来的对象引用共享问题
    this.#innerArray = Array.from({ length: this.#maxLength }, defaultGenerator);
  }

  /**
   * 新增元素，按顺序替换默认值，填满后默认忽略后续新增
   * @param item 要新增的元素
   */
  push(item: T): void {
    if (this.#nextIndex >= this.#maxLength) {
      // 若需要满了之后循环覆盖最早元素，可替换为下方注释代码
      // this.#nextIndex = 0;
      // this.#innerArray[this.#nextIndex] = item;
      // this.#nextIndex++;
      return;
    }
    this.#innerArray[this.#nextIndex] = item;
    this.#nextIndex++;
  }

  /**
   * 获取当前数组快照
   * @returns 数组副本，避免外部直接修改内部存储
   */
  get(): T[] {
    return [...this.#innerArray];
  }
}

使用示例 #

// 定义默认对象生成函数，每次调用返回全新的独立对象
const getDefaultObj = () => ({ content: 'Default value' });
// 初始化固定长度数组
const myArray = new FixedLengthObjArray<CustomObject>(getDefaultObj);

// 初始状态
console.log(myArray.get());
// 输出：[{content: 'Default value'}, {content: 'Default value'}, {content: 'Default value'}]

// 第一次调用push
myArray.push({ content: 'Added Data' });
console.log(myArray.get());
// 输出：[{content: 'Added Data'}, {content: 'Default value'}, {content: 'Default value'}]

// 第二次调用push
myArray.push({ content: 'Added Data' });
console.log(myArray.get());
// 输出：[{content: 'Added Data'}, {content: 'Added Data'}, {content: 'Default value'}]

// 第三次调用push
myArray.push({ content: 'Added Data' });
console.log(myArray.get());
// 输出：[{content: 'Added Data'}, {content: 'Added Data'}, {content: 'Added Data'}]

简化版实现（无需类封装） #

如果不需要复用，只是单次使用，可以不用封装类，直接实现：

interface CustomObject {
  content: string;
}

// 初始化独立默认对象数组
const defaultGenerator = () => ({ content: 'Default value' });
const arr: CustomObject[] = Array.from({ length: 3 }, defaultGenerator);
// 维护替换索引
let nextReplaceIndex = 0;

// 自定义push方法
function pushItem(item: CustomObject) {
  if (nextReplaceIndex >= 3) return;
  arr[nextReplaceIndex] = item;
  nextReplaceIndex++;
}

// 使用示例
pushItem({ content: 'Added Data' });
console.log(arr); // 第一个元素被替换

实现要点说明 #

• 避免对象引用共享：使用Array.from结合默认对象生成函数初始化数组，每次生成全新的默认对象，不会出现原生fill方法填充对象时所有元素引用同一个对象的问题。
• 自定义push逻辑：内部维护替换索引，按顺序替换默认值，填满后的行为可根据业务需求自定义，示例中默认忽略后续push操作，也可调整为循环覆盖最早元素的逻辑。
• 封装性：类实现采用私有属性避免外部随意修改内部状态，返回数组副本保证内部存储的安全性。

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