在 TypeScript 中克隆对象数组

IT技术 javascript reactjs typescript ecmascript-6
2021-05-11 19:30:02

我在我的界面中定义了一个如下所示的对象数组:

myArray: [{
    id: number;
    item: string;
    checked: boolean;
}]

我正在尝试使用以下语句克隆数组:

let newArray = myArray.map(x => Object.assign({},x));

当我尝试将新数组分配给我的原始数组时,出现以下错误:

Type '{ id: number; item: string; checked: boolean; }[]' is not assignable to type 
'[{ id: number; item: string; checked: boolean; }]'.
  Target requires 1 element(s) but source may have fewer

看起来对象数组正在转换为数组对象。

1个回答

您遇到的问题在于 Typescript 中元组和列表类型之间的区别。考虑以下示例Playground 链接

type AsTuple = [number];

type AsArray = number[];

let myArrayA: AsArray = [];
let myArrayB: AsTuple = []; // this one errors

为什么第二个错误?这是因为AsArray是一个数字数组,而AsTuple是一个元组,其中元组中的第一个(也是唯一一个)项目是一个数字。空数组不符合类型AsTuple它必须是单个项目数组。

在您的示例中,您有:

myArray: [{
    id: number;
    item: string;
    checked: boolean;
}]

它定义myArray为元组类型 - 它可以有一个项目,即一个对象。您可以通过将其设置为数组类型来纠正它:

myArray: {
    id: number;
    item: string;
    checked: boolean;
}[]

您可以在此 Playground 链接中看到一个示例