推入 forEach 不适用于异步功能

Question

所以我试图将对象推入一个数组。如果我 console.log() 对象被打印到控制台。所以它们不是未定义的。但是如果我尝试推送它们，它会显示：“错误：未捕获（承诺）：TypeError：无法读取未定义的属性（读取'推送'）”。

这是我的代码：

let snapProtections = JSON.parse(snapshot.protection);
this.completeMachine.operationModes = snapOperationModes;
        snapProtections.forEach(async prot => {
          this.test.push(await this.protectionDataAcessService.getProtectionAndOperationModesByProtectionId(prot.id));
        });

test 是 ProtectionAndOperationModes 类型的数组：

export interface ProtectionAndOperationModes {
    protection: Protection;
    operationModes: OperationMode[];
    image?: EntityImage;
}

这是 getProtectionAndOperationModesByProtectionId 函数：

public async getProtectionAndOperationModesByProtectionId(protectionId: string): Promise<ProtectionAndOperationModes> {
    const protection = await this.protectionService.getById(protectionId);
    return await this.getOperationModesOfProtection(protection);
  }

private async getOperationModesOfProtection(protection: Protection): Promise<ProtectionAndOperationModes> {
    const availableOperationModes = await this.operationModeService.getByMachineId(protection.machineId);
    const linkedOperationModes = await this.protectionLinkService.getByProtectionId(protection.id);
    const image = await this.imageService.getByEntityId(protection.id);
    return {
      protection: protection,
      operationModes: availableOperationModes.filter(o => linkedOperationModes.find(l => l.operationModeId === o.id)),
      image: image
    };
  }

对如何将对象放入数组有任何帮助吗？

Answer 1

好的，所以我只是跳转到您的代码，并没有完全阅读到您遇到的错误是推送到一个不存在的数组。我会留下原来的，因为这将是一个后续问题:)

您的 this.test 变量未定义，因此您无法推送到它。您可以通过不推送它而是直接分配变量来解决这个问题 - 或者通过确保它事先存在。 在我最初的回答中，我还展示了一种可以做到这一点的方法（代码的最后一行）。

原答案

您的代码确实有效 - 只是不是以您期望的方式。推送是异步发生的，因此您很可能过早观察到它。

要等到你的数组被填满，你必须像这样等待你的所有承诺：

let snapProtections = JSON.parse(snapshot.protection);
this.completeMachine.operationModes = snapOperationModes;

// protectionModes will contain an array of the resolved promises values
const protectionModes:ProtectionAndOperationModes[] = await Promise.all(
   // map the prots to an array of promises and await that array using promise.all
   snapProtections.map(prot => this.protectionDataAcessService.getProtectionAndOperationModesByProtectionId(prot.id))
);

protectionModes.forEach(mode => this.test.push(mode)); 
// or use spread: 
this.test.push(...protectionModes);
// or just assign to it
this.test = protectionModes;

这样，您的数据将在此代码之后填充。