从 any 和 unknown 入手，深度理解 TypeScript 类型推断核心概念

2023-12-21 01:54:40

前言

作为前端开发人员，我们在使用 TypeScript 时经常会遇到两种类型：any 和 unknown。这两个类型在类型系统中扮演了相似的角色，但实际上有一些重要的区别。

初探 `any` 类型

首先，让我们来看看 any 类型。any 类型允许你将任何值赋给变量，而不会产生任何类型错误。这意味着你可以将字符串、数字、数组、对象等任何类型的值赋给 any 类型的变量，而 TypeScript 编译器都不会报错。

let anyValue: any = 123;
anyValue = "Hello, World!";
anyValue = [1, 2, 3];

any 类型的灵活性在某些情况下非常有用。例如，当我们需要处理来自外部源的数据时，我们可能不知道数据的确切类型。此时，我们可以使用 any 类型来接收这些数据，而不用担心类型错误。

function getDataFromAPI(): any {
  // 模拟从 API 获取数据
  return {
    name: "John Doe",
    age: 30,
    hobby: ["coding", "reading", "traveling"],
  };
}

let data = getDataFromAPI();

`unknown` 类型的登场

然而，any 类型也存在一些问题。由于它允许你将任何值赋给变量，因此很难对 any 类型的变量进行类型检查。这意味着你可能会在代码中引入一些难以发现的错误。

为了解决这个问题，TypeScript 引入了 unknown 类型。unknown 类型与 any 类型非常相似，但它不允许你直接将值赋给变量。你需要先对 unknown 类型的变量进行类型检查，然后再赋值。

let unknownValue: unknown = 123;
// 以下代码会报错，因为 unknown 类型的值必须先经过类型检查
// unknownValue = "Hello, World!";

`any` 与 `unknown` 的区别

那么，any 和 unknown 到底有什么区别呢？

类型检查： any 类型允许你将任何值赋给变量，而不会产生任何类型错误。unknown 类型则不允许你直接将值赋给变量，你需要先对 unknown 类型的变量进行类型检查，然后再赋值。
类型安全： any 类型不提供任何类型安全保障。unknown 类型则可以提供一定程度的类型安全保障，因为它要求你对变量进行类型检查。
开发效率： any 类型可以提高开发效率，因为它允许你快速地编写代码，而不用担心类型错误。unknown 类型则会降低开发效率，因为它要求你对变量进行类型检查，这可能会增加代码的复杂性和维护成本。

何时使用 `any` 和 `unknown`

那么，我们应该在什么时候使用 any 和 unknown 类型呢？

使用 any 类型： 当你需要处理来自外部源的数据时，我们可能不知道数据的确切类型。此时，我们可以使用 any 类型来接收这些数据，而不用担心类型错误。
使用 unknown 类型： 当你需要对变量进行类型检查时，我们应该使用 unknown 类型。例如，当我们从 API 获取数据时，我们应该使用 unknown 类型来接收数据，然后对数据进行类型检查，然后再赋值。