TypeScript 中非空断言使用示例

在 TypeScript 中，非空断言操作符（!）用于断言一个值不是 null 或 undefined。这可以在你确信某个值不可能为空的情况下使用，以避免编译器报错。下面是一些使用非空断言操作符的示例：

示例 1：变量非空断言

假设你有一个可能为空的变量，但你确信在某个特定的地方它一定不会为空。

let myVar: string | null = "Hello, TypeScript";

// 你确定在这个地方 myVar 不会为空
console.log(myVar!.toUpperCase());

示例 2：函数返回值非空断言

当你调用一个可能返回 null 或 undefined 的函数时，如果你确定返回值在某些情况下不会为空，可以使用非空断言操作符。

function getElementById(id: string): HTMLElement | null {
    return document.getElementById(id);
}

const myElement = getElementById("myElementId");

// 你确定这里 myElement 不会为空
myElement!.style.backgroundColor = "blue";

示例 3：数组元素非空断言

当你访问一个数组元素时，如果你确定该索引处一定有值，可以使用非空断言操作符。

let numbers: number[] = [1, 2, 3, 4, 5];

// 你确定索引 2 的元素一定存在
let num = numbers[2]!;
console.log(num * 2);

示例 4：类型转换后的非空断言

当你从一个宽泛的类型转换到一个更具体的类型时，如果你确定转换后不会为空，可以使用非空断言操作符。

let input: any = "TypeScript";

// 你确定 input 一定是一个字符串
let trimmedInput = (input as string)!.trim();
console.log(trimmedInput);

示例 5：与条件语句结合使用

在条件语句中，如果你已经做了空值检查，之后再使用该变量时，可以使用非空断言操作符。

let maybeString: string | undefined;

if (maybeString !== undefined) {
    // 你确定在这个块内 maybeString 一定不是 undefined
    console.log(maybeString!.toLowerCase());
}

使用非空断言时需要谨慎，因为错误使用可能会导致运行时错误。确保你在使用非空断言操作符时，有充分的理由确信该值一定不会为空。