NonNullable型を使用して未定義をチェックする

TypeScriptで未定義をチェックする方法

typeof演算子を使用して、変数の型を取得できます。変数の型がundefinedであれば、その変数は未定義です。

let x: string | undefined;

if (typeof x === "undefined") {
  // xは未定義です
} else {
  // xは文字列です
}

===演算子は、値と型が厳密に一致する場合にのみtrueを返します。変数がundefinedと厳密に一致するかどうかを確認するには、===演算子を使用できます。

let x: string | undefined;

if (x === undefined) {
  // xは未定義です
} else {
  // xは文字列です
}

オプション型ガードを使用して、変数が特定の型であるかどうかを確認できます。変数がundefinedではない場合は、その変数は定義済みです。

let x: string | undefined;

if (x !== undefined) {
  // xは定義済みです
  // xを文字列として安全に使用できます
}

in演算子を使用して、オブジェクトのプロパティが存在するかどうかを確認できます。変数がオブジェクトのプロパティであり、その値がundefinedではない場合は、その変数は定義済みです。

interface MyObject {
  x: string;
}

let obj: MyObject | undefined;

if (obj !== undefined && "x" in obj) {
  // obj.xは定義済みです
  // obj.xを文字列として安全に使用できます
}

?.演算子は、プロパティやメソッドが存在しない場合にundefinedを返す安全なアクセス演算子です。この演算子を使用して、プロパティやメソッドにアクセスする前に、それが存在するかどうかを確認できます。

interface MyObject {
  x: string;
}

let obj: MyObject | undefined;

const x = obj?.x;

if (x !== undefined) {
  // xは文字列です
}

これらの方法のどれを使用するかは、状況によって異なります。コードの読みやすさやパフォーマンスなどを考慮して、適切な方法を選択してください。

// typeof演算子

let x: string | undefined;

if (typeof x === "undefined") {
  console.log("xは未定義です");
} else {
  console.log("xは文字列です");
}

// ===演算子

let y: number | undefined;

if (y === undefined) {
  console.log("yは未定義です");
} else {
  console.log("yは数字です");
}

// オプション型ガード

let z: string | undefined;

if (z !== undefined) {
  console.log("zは定義済みです");
  console.log(z.toUpperCase()); // zを文字列として安全に使用できます
}

// in演算子

interface MyObject {
  name: string;
}

let obj: MyObject | undefined;

if (obj !== undefined && "name" in obj) {
  console.log("obj.nameは定義済みです");
  console.log(obj.name); // obj.nameを文字列として安全に使用できます
}

// ?.演算子

let person: {
  age: number;
} | undefined;

const age = person?.age;

if (age !== undefined) {
  console.log("ageは数字です");
  console.log(age);
} else {
  console.log("person.ageは存在しません");
}

他の方法

??演算子は、左側の式がundefinedまたはnullの場合に右側の式を返すnull合体演算子です。

let x: string | undefined;

const name = x ?? "デフォルトの名前";

console.log(name); // xが定義済みの場合はxの値、そうでなければ"デフォルトの名前"が出力されます

asキーワードを使用して、変数の型を明示的に指定できます。

let x: string | undefined;

const name = x as string;

console.log(name); // xが定義済みの場合はxの値、そうでなければエラーが発生します

NonNullable型を使用して、undefinedまたはnullではない値を表す型を定義できます。

type Name = NonNullable<string>;

let x: Name;

// xは`undefined`または`null`になり得ません