javascript - typescript :匿名函数中可能 undefined variable

Question

TLDR；在匿名函数中使用它之前检查变量仍然 TS 警告变量可能未定义

在下面的代码示例中，检查变量 baseDirId 是否未定义，然后传递给 array.map 函数，但 TS 警告 baseDirId can be undefined。

//Typescript Playground link

const rstr = async (a: string) => {
  return a + "bleh"
}

const args: { baseDirId: string | undefined } = {
  baseDirId: "someid"
  // baseDirId: undefined
}

const someArr = ["bleh1", "bleh2"]

const func1 = async (): Promise<void> => {
  try {
    // Assume baseDirId can be undefined
    let baseDirId = args.baseDirId

    // Trigger if baseDirId is undefined
    if (!baseDirId) {
      const baseDirObj = { id: "valid string" }
      baseDirId = baseDirObj.id
    }
    console.log(typeof baseDirId)

    // baseDirId cant be anything other than a string 
    if (typeof baseDirId !== "string") {
      return Promise.reject("Base Dir response invalid")
    }

    // Why is baseDirId `string | undefined` inside rstr call below even after above checks
    const bleharr = someArr.map((val) => rstr(baseDirId))
    console.log(await Promise.all(bleharr))
  } catch (err) {
    console.error(err)
  }
}

func1().catch(err => console.error(err))

是否存在 baseDirId 可以是 undefined 的情况？

为什么 TS 不允许呢？更好的方法？

Answer 1

让我们稍微改变一下代码

 return () => someArr.map((val) => rstr(baseDirId))

因此，与其直接调用 .map，它可能会在稍后的某个时间点运行。与此同时，一些其他代码可能已将 undefined 写入 baseDirId。因此，为了正确推断类型，Typescript 必须检查是否有其他代码在某个时候覆盖了该变量。这是一项相当复杂的任务(在某些极端情况下甚至是不可能的)。如果我们的内部函数在多个地方被调用，这也会变得更加复杂:

let mutable: string | undefined = /*...*/;
const inner = () => fn(mutable); // << how to infer this?

mightCall(inner); // if called back here, mutable would be "string | undefined"
if(typeof mutable === "string") mightCall(inner); // if called here, mutable could be narrowed down to "string", but only if mightCall calls back synchronously

mutable = undefined; // if mightCall calls back asynchronously, 'mutable' would have to be inferred as undefined

因此，当函数从外部作用域访问变量时，Typescript 编译器假定尽可能宽的类型。类型缩小仅适用于函数体本身。要缩小类型，您需要类型断言，或者将值复制到 const 中:

 let mutable: string | undefined = /*...*/;
 if(typeof mutable !== "string") return;
 // mutable get's narrowed down to string here due to the typeof type guard
 const immutable = mutable;
  //        ^ inferred as string, this is the widest possible type

这也是works in your case .