javascript - typescript 中的过滤器出现错误 '(string | null)[]' 不可分配

Question

我有一个对象数组，其中一个属性具有空值，我使用过滤器将其删除，但 typescript 给我警告 null is not assignable？因为过滤器永远不会返回 null，为什么 typescript 给我这样的错误？

const data = [
  {
    id: "123"
  },
  {
    id: "456"
  },
  {
    id: null
  }
];

const d2: string[] = data.map((d) => d.id).filter((o) => o);

console.log(d2);

演示 https://codesandbox.io/s/gallant-water-vio56?file=/src/index.ts:0-165

Answer 1

Typescript 无法确定 .filter((o) => o) 会缩小数组的类型，这并非没有帮助。你可以定义一个 custom type guard并使用它。例如:

function notNull<T>(val: T | null): val is T {
    return val !== null;
}

const d2 = data.map((d) => d.id).filter(notNull); // d2 is a string[]

或仅适用于字符串的内联版本:

const d2 = data.map(d => d.id).filter((o): o is string => !!o);

Playground link