TypeScript Null & Undefined
TypeScript 拥有强大的系统来处理 null
或 undefined
值。
默认情况下,null
和 undefined
的处理是禁用的,可以通过将 strictNullChecks
设置为 true 来启用。
此页面的其余部分适用于启用了 strictNullChecks
的情况。
类型
null
和 undefined
是原始类型,可以像其他类型(如 string
)一样使用。
当启用了 strictNullChecks
时,TypeScript 要求为变量赋值,除非在类型中明确添加了 undefined
。
可选链 (Optional Chaining)
可选链是一个 JavaScript 功能,它与 TypeScript 的 null 处理配合得很好。它允许使用紧凑的语法访问可能存在也可能不存在的对象属性。在访问属性时,可以使用 ?.
运算符。
示例
interface House {
sqft: number;
yard?: {
sqft: number;
};
}
function printYardSize(house: House) {
const yardSize = house.yard?.sqft;
if (yardSize === undefined) {
console.log('No yard');
} else {
console.log(`Yard is ${yardSize} sqft`);
}
}
let home: House = {
sqft: 500
};
printYardSize(home); // Prints 'No yard'
自己动手试一试 »
空值合并 (Nullish Coalescence)
空值合并是另一个 JavaScript 功能,它也与 TypeScript 的 null 处理配合得很好。它允许编写专门处理 null
或 undefined
的回退表达式。当表达式中可能出现其他虚值但仍有效时,这很有用。它可以在表达式中使用 ??
运算符,类似于使用 &&
运算符。
示例
function printMileage(mileage: number | null | undefined) {
console.log(`Mileage: ${mileage ?? 'Not Available'}`);
}
printMileage(null); // Prints 'Mileage: Not Available'
printMileage(0); // Prints 'Mileage: 0'
自己动手试一试 »
Null 断言 (Null Assertion)
TypeScript 的类型推断系统并非完美,有时忽略值可能是 null
或 undefined
的可能性是有意义的。一种简单的方法是使用类型断言,但 TypeScript 也提供 !
运算符作为便捷的快捷方式。
示例
function getValue(): string | undefined {
return 'hello';
}
let value = getValue();
console.log('value length: ' + value!.length);
自己动手试一试 »
与类型断言一样,这可能不安全,应谨慎使用。
数组边界处理
即使启用了 strictNullChecks
,默认情况下 TypeScript 也会假设数组访问永远不会返回 undefined(除非 undefined 是数组类型的一部分)。
可以使用 noUncheckedIndexedAccess
配置来更改此行为。
示例
let array: number[] = [1, 2, 3];
let value = array[0]; // 使用 `noUncheckedIndexedAccess` 时,此类型为 `number | undefined`
自己动手试一试 »