主页 / coding / 问题 / 79257083
Accepted
four-eyes
Asked: 2024-12-06 14:50:49 +0800 CST

无法将元素推送到联合类型数组中

  • 772

我有这个代码

export interface CommonAnimalProps {
    name: string
  
}

export interface DogResponse extends CommonAnimalProps {

}

export interface CatResponse extends CommonAnimalProps {
    color: string,
}

export type AllAnimals = (DogResponse[] | CatResponse[])

export interface AllAnimalsProps {
    height: number | null,
    errorCodes: number[] | null,
    uuid?: string,
    [ANIMALS.dog]?: DogResponse[],
    [ANIMALS.cat]?: CatResponse[],
}

export enum ANIMALS {
    dog = 'dog',
    cat = 'cat'
}

export const transformCalculatedEmissionsResponse = (response: AllAnimalsProps): AllAnimals => {
    const result: AllAnimals = [];
    (Object.values(ANIMALS) as ANIMALS[]).map(animal => {
        const bars = response[animal]
        if (Array.isArray(bars)) {
            bars.map(bar => result.push(bar))
        }
    })
    return result
}

并且它在这条线上失败了

bars.map(bar => result.push(bar))

无结果 类型为“DogResponse | CatResponse”的参数无法分配给类型为“CatResponse”的参数。类型为“DogResponse”的参数缺少属性“color”，但类型为“CatResponse”的参数是必需的。

为什么以及如何解决这个问题？

这里是广场

typescript

2 个回答

  1. Best Answer

    问题是，你的结果属于类型AllAnimals，这最终意味着

    result: (DogResponse[] | CatResponse[])

    即，它要么DogResponse[]是只能容纳狗的，CatResponse[]要么是只能容纳猫的。

    另一方面，在迭代枚举值时，您bars将同时出现一次 aDogResponse[]和一次 a ，CatResponse[]并且您尝试将所有值推送到同一个result数组中，这是不可能的。

    如果你想要一个混合数组，那么定义AllAnimals为

    type AllAnimals = (DogResponse | CatResponse)[]

    这result意味着

    result: (DogResponse | CatResponse)[]

    这意味着它将是一个数组，其中每个元素要么是 a，CatResponse要么是 aDogResponse

    顺便说一句，bars.map(bar => result.push(bar))这没什么意义。使用

    result.push(...bars)

    反而。

    一般来说，只使用迭代器来迭代数组的值是一个坏习惯map。当你不需要map创建的结果数组时，可以使用forEach或简单的for .. of循环

    既然您在评论中澄清了您的问题和先决条件，您可以例如这样做

    export const transformCalculatedEmissionsResponse = (response: AllAnimalsProps): AllAnimals => {
    for (const animal of Object.values(ANIMALS) as ANIMALS[]) {
        if (Array.isArray(response[animal]))
            return response[animal];
    }

    return [];
}

    即，迭代不同类型的动物，一旦在响应中找到相应的值，就返回它。如果没有找到，则返回一个空数组（与你目前所做的相同）。

    • 1

  2. 我认为，这里，result可以是对象数组DogResponse或对象数组CatResponse，但不能同时是两者，因为它的类型为AllAnimals。

    当您推送任一结果时，它都会出现错误，因为它们都不匹配另一个，具体来说，DogResponse 可能与 CatResponse 的结构不匹配，反之亦然。

    为了修复这个问题，您可以调整的类型result，以便它可以在单个数组中接受DogResponse和类型。CatResponse

    修复你transformCalculatedEmissionsResponse如下：

    export const transformCalculatedEmissionsResponse = (response: AllAnimalsProps): AllAnimals => {
    const result: (DogResponse | CatResponse)[] = []; // Use union type array
    (Object.values(ANIMALS) as ANIMALS[]).map(animal => {
        const bars = response[animal]
        if (Array.isArray(bars)) {
            bars.map(bar => result.push(bar)) // Now you can push both DogResponse and CatResponse
        }
    })
    return result
}

    希望这有帮助！

    • 0

相关问题