Javascript TypeScript使用排列将对象添加到数组

我正在尝试使用TypeScript和数组，并使用spread操作符将一个对象预先添加到一个对象数组中

以下是设置：

定义我的类型的接口：

interface KeyValuePair {
  key: string;
  value: string;
}

类型为的对象数组：

const kvpset: KeyValuePair[] = [
  { key: "1", value: "One" },
  { key: "2", value: "Two" },
  { key: "3", value: "Three" },
  { key: "4", value: "Four" },
  { key: "5", value: "Five" },
  { key: "6", value: "Six" },
  { key: "7", value: "Seven" },
  { key: "8", value: "Eight" },
  { key: "9", value: "Nine" },
];

我的前置类型对象内容：

const kvpzero: KeyValuePair = { key: "0", value: "Zero" };

第一次尝试：

const kvpAll: KeyValuePair[] = { kvpzero, ...kvpset };

编辑器中的错误：

属性）kvpzero:KeyValuePair类型“{length:number；toString（）： 字符串；ToLocalString（）：字符串；pop（）：KeyValuePair；push（…项： KeyValuePair[]）：编号；concat（…项： ConcatArray[]）：KeyValuePair[]；concat（…项： （KeyValuePair | ConcatArray）[]）：KeyValuePair[]；…26更多。。。； kvpzero:KeyValuePair；}不可分配给类型“KeyValuePair[]”。 对象文字只能指定已知属性，而“kvpzero”可以指定 “KeyValuePair[]”类型中不存在。ts（2322）

好吧，所以我有点不知所措。我试试这个：

const kvpzeroAsArray: KeyValuePair[] = [{ key: "0", value: "Zero" }];

这并不会产生“编译器错误”：

使用tsc和节点运行它（编辑器是Visual Studio代码）。生成kvpAll对象的console.log（）：

kvpAll is {
  '0': { key: '1', value: 'One' },
  '1': { key: '2', value: 'Two' },
  '2': { key: '3', value: 'Three' },
  '3': { key: '4', value: 'Four' },
  '4': { key: '5', value: 'Five' },
  '5': { key: '6', value: 'Six' },
  '6': { key: '7', value: 'Seven' },
  '7': { key: '8', value: 'Eight' },
  '8': { key: '9', value: 'Nine' }
}

我在这里看到三件事。首先，对象现在是对象而不是数组。第二，我的零丢失了。我不知道为什么这不起作用，或者为什么我不能得到预期的结果。第三，它甚至不是我想要的那种类型的输出。它将属性作为数字，值作为对象<代码>'0'：{key:'1'，value:'One'}而不仅仅是

{key:'1'，value:'One'}

在网上搜索时，似乎应该使用

Object.assign（）

机制

const assignedkvp = (<any>Object).assign(kvpzeroAsArray, kvpset);

嗯…和传播结果相似。对象不会随着排列的改变而改变，但我仍然看不到我想要的假装结果

我现在不知所措。我不明白如何使用spread运算符或assign函数来获得所需的结果。如果有任何见解，我将不胜感激。这是我目前的解决方案。暴力法：

const prePendObjectToArray = <T>(object: T, array: T[]): T[] => {
  let returnArray = [] as T[];

  if (array && array.length > 0 && object) {
    for (let i = 0; i < array.length + 1; i++) {
      if (i === 0) {
        returnArray.push(object);
      } else {
        returnArray.push(array[i - 1]);
      }
    }
  }

  return returnArray;
};

结果:

[
  { key: '0', value: 'Zero' },
  { key: '1', value: 'One' },
  { key: '2', value: 'Two' },
  { key: '3', value: 'Three' },
  { key: '4', value: 'Four' },
  { key: '5', value: 'Five' },
  { key: '6', value: 'Six' },
  { key: '7', value: 'Seven' },
  { key: '8', value: 'Eight' },
  { key: '9', value: 'Nine' }
]

如果有更好的方法，我会很感激知道我错过了什么

const kvpAll: KeyValuePair[] = { ...kvpzeroAsArray, ...kvpset };

这不是一个数组。你正在扩散到一个物体中

做：

---

非常感谢。我在想我错过了一些简单的东西，我是。这解决了我的问题。

const newArray = prePendObjectToArray(kvpzero, kvpset);
console.log(newArray);

[
  { key: '0', value: 'Zero' },
  { key: '1', value: 'One' },
  { key: '2', value: 'Two' },
  { key: '3', value: 'Three' },
  { key: '4', value: 'Four' },
  { key: '5', value: 'Five' },
  { key: '6', value: 'Six' },
  { key: '7', value: 'Seven' },
  { key: '8', value: 'Eight' },
  { key: '9', value: 'Nine' }
]

const kvpAll: KeyValuePair[] = { ...kvpzeroAsArray, ...kvpset };

const kvpAll: KeyValuePair[] = [ ...kvpzeroAsArray, kvpset ];