面试题：TypeScript中静态类型如何帮助捕获潜在错误

Question

请举例说明在TypeScript中，静态类型是怎样在开发过程中提前捕获一些在JavaScript中运行时才会暴露的潜在错误，比如类型不匹配的错误。并详细阐述错误捕获的机制和场景。

Answer 1

示例

在JavaScript中，以下代码在运行前不会发现类型不匹配问题：

function add(a, b) {
    return a + b;
}
// 这里传入字符串，运行时才发现问题
add('1', 2); 

在TypeScript中，通过静态类型检查，代码如下：

function add(a: number, b: number): number {
    return a + b;
}
// 传入字符串时，TypeScript编译器就会报错
add('1', 2); 

错误捕获机制

TypeScript在编译阶段进行静态类型检查。它会根据开发者定义的类型注解，检查函数参数、返回值、变量类型等是否匹配。如果不匹配，编译器会抛出错误，阻止代码编译通过。

常见场景

1. 函数参数类型检查：确保传入函数的参数类型符合预期，就像上述add函数的例子。如果参数类型错误，在编译阶段就可发现。
2. 返回值类型检查：例如定义一个函数应该返回一个字符串类型，但实际返回了数字类型，TypeScript编译器会报错。

function getMessage(): string {
    return 123; // 编译错误，返回值类型不匹配
}

3. 变量类型检查：声明变量时指定了类型，后续对变量赋值不符合该类型时会报错。

let num: number = 10;
num = 'ten'; // 编译错误，变量类型不匹配