TypeScript 中为什么使用 as number 无法进行实际的类型转换？

typescript 类型断言与实际类型转换

本文探讨 TypeScript 中类型转换的常见误区，特别是 as 关键字的使用。 一个开发者遇到的问题是，即使使用 as number，typeof 仍然显示变量为字符串类型。

问题代码如下：

const props = defineProps()  getDictGroup(props.group)  export const getDictGroup = async (sid: number) => {   const dict = await getDict()   console.info(typeof sid); // 输出 String   sid = sid as number;   console.info(typeof sid); // 输出 string   console.info(typeof (sid as number)); // 输出 string }

尽管 sid 的类型声明为 number，但实际运行时 typeof sid 显示为 string，as number 并没有改变运行时的类型。

此外，使用 parseInt(sid) 会导致 TypeScript 报错，提示无法将 number 类型赋值给 string 类型。

TypeScript 类型系统的本质

问题的关键在于理解 TypeScript 的类型系统。as 关键字是类型断言，它只影响 TypeScript 编译器的类型检查，不会在运行时修改变量的实际类型。 它告诉编译器：“我相信这个值是这个类型，请不要报错”。 但运行时的值仍然保持不变。

实际类型转换方法

要进行实际的类型转换，需要使用 JavaScript 的内建函数，例如 Number()、parseInt()、parseFloat() 等。

正确的代码示例：

const props = defineProps()  getDictGroup(props.group)  export const getDictGroup = async (sid: string) => { // 修改参数类型为string   const dict = await getDict()   console.info(typeof sid); // 输出 string   const numSid = Number(sid); // 使用 Number() 进行类型转换   console.info(typeof numSid); // 输出 number   console.info(typeof (numSid as number)); // 输出 number   // 现在可以使用 numSid 进行后续操作 }

在这个修正后的例子中，我们首先将 sid 的类型声明为 string，以反映其实际运行时类型。然后使用 Number(sid) 将其转换为数字类型。 as number 仍然可以用于类型断言，但此时它只是对已经转换后的 numSid 进行冗余的类型断言。

因此，在 TypeScript 中，需要区分类型断言（as）和实际类型转换（JavaScript 内建函数）。 as 仅仅是告诉编译器，而实际的类型转换需要使用 JavaScript 的函数来完成。