在 TypeScript 中使用数组值定义映射

作者

在 TypeScript 中定义一个包含数组值的映射

Define a Map with Array values in TypeScript

要在 TypeScript 中定义具有数组值的映射，请键入映射以具有特定类型的键并将值设置为具有数组类型，例如
const map1 = new Map<number, string[]>(). Map 中的所有键值对都必须符合指定的类型。

索引.ts
const map1 = new Map<number, string[]>([
  [0, ['a', 'b']],
  [1, ['c', 'd']],
]);

map1.set(2, ['e', 'f']);

// 👇️ ['e', 'f']
console.log(map1.get(2));

我们使用
泛型
将Map对象键入为具有 type 的键和 type 的number值
string[]。

如果你想用值初始化地图，你可以将数组传递给键值对到地图。

如果您尝试设置不符合指定类型的类型的键值对，类型检查器会抛出错误。
索引.ts
const map1 = new Map<number, string[]>([
  [0, ['a', 'b']],
  [1, ['c', 'd']],
]);

// ✅ Works
map1.set(2, ['e', 'f']);

// ⛔️ Error: Argument of type 'string' is
// not assignable to parameter of type 'string[]'.ts(2345)
map1.set(3, 'hello');

string当需要字符串数组时，我们尝试添加一个类型的值，但出现错误。

下面是一个示例，说明如何声明一个将对象数组作为值的 Map。

索引.ts
type Employee = {
  name: string;
  salary: number;
};

const map1 = new Map<number, Employee[]>([
  [
    0,
    [
      { name: 'Alice', salary: 100 },
      { name: 'Bob', salary: 150 },
    ],
  ],
]);

const arr: Employee[] = [];

arr.push({ name: 'Carl', salary: 200 });
arr.push({ name: 'Dean', salary: 250 });

map1.set(1, arr);

// 👇️ [{name: 'Carl', salary: 200}, {name: 'Dean', salary: 250}]
console.log(map1.get(1));

Map 中的键是 type ，因为这是我们在定义对象number时传递给泛型的第一个类型。Map值的类型
Employee[]。

当使用该get方法通过特定键获取 Map 值时，该值的类型可能是undefined。

TypeScript 无法确定 Map 中是否存在具有指定键的值。

您可以使用类型保护来确保undefined在访问索引处的元素或对象的属性之前该值不是。

索引.ts
type Employee = {
  name: string;
  salary: number;
};

const map1 = new Map<number, Employee[]>([
  [
    0,
    [
      { name: 'Alice', salary: 100 },
      { name: 'Bob', salary: 150 },
    ],
  ],
]);

map1.set(1, [{ name: 'Carl', salary: 200 }]);

// 👇️ const result: Employee[] | undefined
const result = map1.get(1);

// ✅ If statement as type guard
if (result !== undefined) {
  console.log(result[0]); // 👉️ {name: 'Carl', salary: 200}
}

// ✅ Optional chaining as type guard
console.log(result?.[0]?.name); // 👉️ "Carl"

if条件服务器类似于
类型保护，因为 TypeScript 知道变量是块中的result数组if
。

null您还可以使用可选的链接 (?.) 运算符，如果引用是or ，它会短路而不是抛出错误undefined。

–

发表评论