第2章：基础类型与变量

类型断言（as 与尖括号语法）

类型断言（Type Assertion）是 TypeScript 中一种告诉编译器“我知道这个值的类型”的机制。它类似于其他语言中的类型转换，但不会进行运行时检查，仅影响编译阶段的类型推断。

1. 为什么需要类型断言？

当 TypeScript 无法自动推断出变量的具体类型，而开发者明确知道其类型时，可以通过类型断言来：

  • 覆盖默认的类型推断
  • 处理联合类型的特定场景
  • 与第三方库或动态内容交互时明确类型

2. 两种语法形式

TypeScript 支持两种等效的语法：

尖括号语法（Angle Bracket Syntax）

let someValue: any = "hello world";
let strLength: number = (<string>someValue).length;

as 语法（推荐）

let someValue: any = "hello world";
let strLength: number = (someValue as string).length;

注意：在 JSX 中只能使用 as 语法，尖括号会与 JSX 语法冲突。

3. 常见使用场景

处理 DOM 元素

const inputElement = document.getElementById("myInput") as HTMLInputElement;
inputElement.value = "TypeScript";  // 现在可以安全访问 .value

处理联合类型

function formatValue(value: string | number) {
    if ((value as string).includes('$')) {
        return (value as string).toUpperCase();
    }
    return value.toFixed(2);
}

4. 双重断言

当直接断言不被允许时（类型差异过大），可以通过双重断言：

const unknownValue: unknown = "hello";
const str = (unknownValue as any) as string;  // 不推荐，应优先考虑类型保护

5. 注意事项

  1. 不是类型转换：运行时不会真正改变类型
  2. 潜在风险：错误的断言会导致运行时错误
  3. 优先选择类型保护：能用 typeof/instanceof/自定义类型保护时，应避免断言

示例对比

// 不推荐的松散写法
const maybeNumber: any = "123";
const badAssertion = maybeNumber as number;  // 编译通过，但运行时仍是字符串

// 推荐的严格写法
const strValue: unknown = "123";
if (typeof strValue === "string") {
    const goodPractice = parseInt(strValue);  // 安全转换
}

类型断言是 TypeScript 类型系统的逃生舱口，应当谨慎使用，大多数情况下更好的类型设计可以避免频繁使用断言。

Last Updated::