TypeScript的类型推断

什么是 TypeScript 的类型推断（Type Inference）？

TypeScript 的类型推断是指在没有显式标注类型的情况下，TypeScript 会根据变量的赋值、函数的返回值等上下文自动推断出变量或表达式的类型。这种机制可以让代码变得更简洁，同时依然可以享受类型检查带来的安全性。

---

TypeScript 在哪些场景下会进行类型推断？

TypeScript 会在以下几种典型场景下进行类型推断：

• 变量初始化时：

 let counter = 0;

TypeScript 会推断 counter⁠ 的类型为 ⁠number⁠。

• 函数参数有默认值时：

⁠function setCounter(max=100) {
  //do something
}⁠

⁠max⁠ 会被推断为 number⁠。

• 函数返回值：

function increment(counter: number) {
  return counter++;
}⁠

返回值会被推断为 ⁠number⁠。

---

什么是“最佳通用类型算法”（Best Common Type Algorithm）？它在数组推断中如何工作？

当 TypeScript 需要为一个包含多种类型元素的数组推断类型时，会使用“最佳通用类型算法”。它会分析所有元素的类型，选择一个能兼容所有元素的联合类型。例如：

let arr = [1, 2, 3, null];⁠ // 推断为 (number | null)[]⁠
let arr = [1, 2, 3, 'Apple'];⁠ // 推断为 ⁠(number | string)[]⁠

这种机制保证了数组中所有元素都能被类型系统正确识别和检查。

---

什么是上下文类型（Contextual Typing）？

上下文类型是指 TypeScript 会根据变量或参数所处的位置推断其类型。例如：

document.addEventListener('click', function (event) {
  console.log(event.button);
});

在这个例子中，event⁠ 被推断为 MouseEvent⁠，因为 ⁠'click'⁠ 事件的回调参数就是 MouseEvent⁠。
如果事件类型变为 'scroll'⁠，则 ⁠event⁠ 会被推断为 ⁠UIEvent⁠，而 ⁠UIEvent⁠ 没有 ⁠button⁠ 属性，TypeScript 会报错：

Property 'button' does not exist on type 'Event'. ts (2339)

---

类型推断和类型注解有什么区别？

类型推断：TypeScript 自动猜测类型，无需显式声明。
类型注解：开发者需要显式指定类型。

---

什么时候应该使用类型注解？

一般建议尽量依赖类型推断，只有在以下情况才需要类型注解：

• 声明变量但稍后才赋值。
• 变量类型无法被推断。
• 函数返回值为 ⁠any⁠，需要明确类型。

---

变量的类型什么情况下无法被推断？

当变量声明时没有立即赋值，或者赋值为多种类型时，TypeScript 无法自动推断出具体类型，这时应主动添加类型注解，以保证类型安全和代码可读性。
以下举例说明：

1. 声明变量但未赋初值

let value;
value = 10;
value = 'hello';

在这种情况下，TypeScript 无法推断 ⁠value⁠ 的类型，因为声明时没有初始值。它会将 value⁠ 推断为 ⁠any⁠ 类型，这样你可以赋予它任意类型的值。这种做法失去了类型检查的优势。

2. 变量赋值为多种类型

let data = Math.random() > 0.5 ? 42 : 'answer';

这里，data⁠ 可能是 number⁠ 或 string⁠，TypeScript 会推断为 ⁠number | string⁠。虽然 TypeScript 能推断出联合类型，但如果类型过于复杂或不明确，可能就需要手动注解了。

3. 需要更精确类型时
   有时你希望变量类型更具体，但 TypeScript 推断不出来。例如：

let id = null;

// 你希望 id 只允许 number，但初始为 null，此时TypeScript 推断为 any
id = 123;

这种情况，建议使用类型注解：

let id: number | null = null;

---

• 如果你觉得我的工作对你有帮助，可以通过分享这篇文字或者关注同名公众号来支持我，你的支持是我持续创作的最大动力：
  

• 转载以及引用请注明原文链接。

• 本博客所有文章除特别声明外，均采用CC 署名-非商业使用-相同方式共享 许可协议。