TypeScript 为空和未定义


TypeScript 有一个强大的系统来处理null或者undefined值。

默认情况下nullundefined处理被禁用,可以通过设置启用strictNullChecks为真。

本页的其余部分适用于strictNullChecks已启用。


类型

nullundefined是原始类型,可以像其他类型一样使用,例如string

示例

let value: string | undefined | null = null;
value = 'hello';
value = undefined;
亲自试一试 »

什么时候strictNullChecks启用后,TypeScript 需要设置值,除非undefined显式添加到类型中。


可选链接

可选链接是一项 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'
亲自试一试 »

零合并

空合并是另一个 JavaScript 功能,它也可以与 TypeScript 的空处理配合良好。它允许编写在处理时专门具有备选的表达式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'
亲自试一试 »


空断言

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]; // with `noUncheckedIndexedAccess` this has the type `number | undefined`
亲自试一试 »