迹忆客 专注技术分享

要在 TypeScript 中检查 null，请使用比较来检查值是否等于或不等于 null，例如 if (myValue === null) {} 或 if (myValue !== null) {}。 如果满足条件，则 if 块将运行。

type Color = string | null;

const color: Color = null;

// ✅ Check if null
if (color === null) {
  console.log('value is equal to null');
} else {
  console.log('value is NOT equal to null');
}

// ✅ Check if NOT equal to null
if (color !== null) {
  console.log('value is NOT equal to null');
}

// ✅ Check if value is equal to null or undefined
if (color == null) {
  console.log('value is equal to null or undefined');
}

// ✅ Check if value is NOT equal to null or undefined
if (color != null) {
  console.log('value is NOT equal to null or undefined');
}

在我们的第一个 if 语句中，我们检查颜色变量是否存储空值。

第二个示例显示如何检查变量是否为空。

第三个示例使用松散等于 == 而不是严格等于 === 来检查变量是否等于 null 或 undefined。

这会检查 null 和 undefined，因为在使用松散等号 (==) 时，null 等于 undefined。

console.log(null == undefined); // 👉️ true

上面的 if 语句用作 TypeScript 中的类型保护。

type Person = {
  name: string | null;
};

const person: Person = {
  name: null,
};

if (person.name !== null) {
  // ✅ TypeScript knows person.name is string
  // 👇️ (property) name: string
  console.log(person.name);

  console.log(person.name.toLowerCase());
}

Person 类型的 name 属性可以是字符串或 null。

在 if 语句中，我们检查属性是否不为空。

如果满足条件，TypeScript 知道唯一可能的其他类型是字符串，并允许我们使用特定于字符串的方法，例如 toLowerCase()。

如果我们尝试直接调用 toLowerCase() 方法，而不检查属性是否为空，我们会得到一个错误。

type Person = {
  name: string | null;
};

const person: Person = {
  name: null,
};

// ⛔️ Error: Object is possibly 'null'.ts(2531)
console.log(person.name.toLowerCase())

我们还可以使用类型保护来检查属性是否为字符串，在这种情况下这将是更直接的方法。

type Person = {
  name: string | null;
};

const person: Person = {
  name: null,
};

if (typeof person.name === 'string') {
  // ✅ TypeScript knows person.name is string
  // 👇️ (property) name: string
  console.log(person.name);

  console.log(person.name.toLowerCase());
}

检查变量是否为 null 或 undefined 的一种较新方法是使用可选链接 (?.) 运算符。

type Person = {
  name: string | null;
};

const person: Person = {
  name: null,
};

console.log(person.name?.toLowerCase());

如果引用等于 null 或 undefined ，则可选链接 (?.) 运算符会短路而不是引发错误。

这就是为什么 TypeScript 允许我们检查 person.name 属性上是否存在 toLowerCase() 方法，即使它可能为空。

我们还可以使用这种方法来检查对象上是否存在深度嵌套的属性。

type Person = {
  name?: {
    first?: string | null;
  };
};

const person: Person = {};

console.log(person?.name?.first?.toLowerCase());

如果引用等于 null 或 undefined，则可选链接运算符将短路并返回 undefined，并且不会引发错误。