JavaScriptで変数がnullまたはundefinedかどうかを判定する方法

JavaScriptで変数が未定義またはnullかどうかを判断する方法

typeof演算子を使う

typeof演算子は、変数の型を返す演算子です。undefinedまたはnullの変数に対してtypeof演算子を使用すると、それぞれ文字列"undefined"または"null"が返されます。

// 変数xが未定義かどうかを判定
if (typeof x === "undefined") {
  console.log("xは未定義です");
}

// 変数yがnullかどうかを判定
if (typeof y === "null") {
  console.log("yはnullです");
}

===演算子を使う

===演算子は、変数の値と型が厳密に等しいかどうかを判定する演算子です。undefinedまたはnullの変数に対して===演算子を使用すると、それぞれtrueが返されます。

// 変数xが未定義かどうかを判定
if (x === undefined) {
  console.log("xは未定義です");
}

// 変数yがnullかどうかを判定
if (y === null) {
  console.log("yはnullです");
}

注意: ==演算子は型を考慮しないため、undefinedとnullは==演算子で比較するとtrueになります。厳密な判定を行う場合は、===演算子を使用する必要があります。

組み込み関数を使う

JavaScriptには、変数の型を判定する組み込み関数typeofと、変数の値がnullかどうかを判定する組み込み関数isNaNがあります。

// 変数xが未定義かどうかを判定
if (typeof x === "undefined") {
  console.log("xは未定義です");
}

// 変数yがnullかどうかを判定
if (y === null || isNaN(y)) {
  console.log("yはnullです");
}

isNaN関数は、数値に変換できない値に対してtrueを返します。そのため、nullもisNaN関数で判定できます。

オプションチェーンを使う

JavaScriptのオプションチェーン構文を使用すると、変数が存在しない場合でもエラーを発生させずに値を取得できます。

// 変数xが未定義またはnullかどうかを判定
const value = x?.value;
if (value === undefined) {
  console.log("xは未定義またはnullです");
}

オプションチェーン構文を使用すると、コードをより簡潔に記述できます。

JavaScriptで変数がundefinedまたはnullかどうかを判断するには、いくつかの方法があります。状況に合わせて適切な方法を選択してください。

// 変数xが未定義またはnullかどうかを判定
const x = undefined;

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

// 変数yがnullかどうかを判定
const y = null;

if (y === null) {
  console.log("yはnullです");
} else {
  console.log("yは" + y + "です");
}

// オプションチェーン構文を使って変数zの値を取得
const z = undefined?.value;

if (z === undefined) {
  console.log("zは未定義またはnullです");
} else {
  console.log("zは" + z + "です");
}

xは未定義です
yはnullです
zは未定義またはnullです

解説

このコードでは、3つの変数x、y、zを定義しています。

• xは未定義
• yはnull
• zは未定義またはnull

それぞれの変数がundefinedまたはnullかどうかを、さまざまな方法で判定しています。

• typeof演算子
• ===演算子
• オプションチェーン構文

それぞれの方法のメリットとデメリットは以下の通りです。

• メリット：シンプルで分かりやすい
• デメリット：型しか判定できない

• メリット：型も含めて厳密に判定できる
• デメリット：==演算子との違いを理解する必要がある

• メリット：コードを簡潔に記述できる
• デメリット：比較的新しい構文なので、ブラウザによっては対応していない場合がある

JavaScriptで変数がundefinedまたはnullかどうかを判定する方法

厳格なnullチェック

// 変数xがnullかどうかを厳密に判定
if (x === null) {
  console.log("xはnullです");
}

.hasOwnProperty()メソッドを使う

オブジェクトのプロパティがhasOwnPropertyメソッドを持っているかどうかを判定することで、そのプロパティが存在するかどうかを間接的に判定できます。

// オブジェクトobjのプロパティxがnullかどうかを判定
if (obj.hasOwnProperty("x") && obj.x === null) {
  console.log("obj.xはnullです");
}

삼항연산자를 사용하여 변수가 null 또는 undefined인지 여부를 한 줄에 판단할 수 있습니다.

// 変数xがnullまたはundefinedかどうかを判定
const value = x ?? "デフォルト値";

console.log(value); // x가 null 또는 undefined인 경우 "デフォルト値" 출력