Optional ChainingとNullish Coalescing Operatorを使った空/未定義/null文字列の判定

JavaScriptで空/未定義/null文字列をチェックする方法

厳格な等価演算子 (===) を使用する

空/未定義/null文字列は、厳格な等価演算子 (===) を使用してチェックできます。

const str = ""; // 空文字列
console.log(str === ""); // true
console.log(str === null); // false
console.log(str === undefined); // false

const str2 = null; // null
console.log(str2 === ""); // false
console.log(str2 === null); // true
console.log(str2 === undefined); // false

const str3 = undefined; // 未定義
console.log(str3 === ""); // false
console.log(str3 === null); // false
console.log(str3 === undefined); // true

この方法はシンプルで分かりやすいですが、空文字列とnull/undefinedを区別したい場合は、別の方法を使う必要があります。

typeof 演算子を使用して、変数の型をチェックできます。

const str = ""; // 空文字列
console.log(typeof str === "string"); // true

const str2 = null; // null
console.log(typeof str2 === "string"); // false
console.log(typeof str2 === "object"); // true

const str3 = undefined; // 未定義
console.log(typeof str3 === "string"); // false
console.log(typeof str3 === "undefined"); // true

この方法は、空文字列とnull/undefinedを区別することができます。

組み込み関数を使用する

JavaScriptには、空/未定義/null文字列をチェックする組み込み関数がいくつかあります。

• String.prototype.length

文字列の長さを取得します。空文字列の場合、0を返します。

const str = ""; // 空文字列
console.log(str.length === 0); // true

const str = "   "; // 空白文字列
console.log(str.trim() === ""); // true

• Object.is

2つの値が厳密に等しいかどうかをチェックします。

const str = ""; // 空文字列
console.log(Object.is(str, "")); // true
console.log(Object.is(str, null)); // false
console.log(Object.is(str, undefined)); // false

これらの組み込み関数は、特定の状況で役立ちます。

その他の方法

上記以外にも、空/未定義/null文字列をチェックする方法があります。

• 三項演算子

三項演算子を使用して、空/未定義/null文字列かどうかを判定し、別の値を返すことができます。

const str = ""; // 空文字列
const result = str ? str : "空文字列です";
console.log(result); // "空文字列です"

• 正規表現

const str = ""; // 空文字列
const regex = /^$/;
console.log(regex.test(str)); // true

これらの方法は、より複雑な処理が必要な場合に役立ちます。

JavaScriptで空/未定義/null文字列をチェックするには、いくつかの方法があります。 それぞれの方法の特徴と使い分けを理解し、状況に応じて適切な方法を選択することが重要です。

厳格な等価演算子 (===) を使用する

const str = ""; // 空文字列
console.log(str === ""); // true
console.log(str === null); // false
console.log(str === undefined); // false

const str2 = null; // null
console.log(str2 === ""); // false
console.log(str2 === null); // true
console.log(str2 === undefined); // false

const str3 = undefined; // 未定義
console.log(str3 === ""); // false
console.log(str3 === null); // false
console.log(str3 === undefined); // true

typeof 演算子を使用する

const str = ""; // 空文字列
console.log(typeof str === "string"); // true

const str2 = null; // null
console.log(typeof str2 === "string"); // false
console.log(typeof str2 === "object"); // true

const str3 = undefined; // 未定義
console.log(typeof str3 === "string"); // false
console.log(typeof str3 === "undefined"); // true

const str = ""; // 空文字列
console.log(str.length === 0); // true

const str = "   "; // 空白文字列
console.log(str.trim() === ""); // true

const str = ""; // 空文字列
console.log(Object.is(str, "")); // true
console.log(Object.is(str, null)); // false
console.log(Object.is(str, undefined)); // false

const str = ""; // 空文字列
const result = str ? str : "空文字列です";
console.log(result); // "空文字列です"

const str = ""; // 空文字列
const regex = /^$/;
console.log(regex.test(str)); // true

実行方法

上記のコードをJavaScriptファイルに保存し、ブラウザで開きます。 コンソールを開くと、結果が表示されます。

JavaScriptで空/未定義/null文字列をチェックするその他の方法

Optional Chainingは、nullまたはundefinedへのアクセス時にエラーが発生するのを防ぐために使用できる演算子です。

const obj = {
  name: "John Doe",
  age: 30,
};

const name = obj?.name; // "John Doe"
const age = obj?.age; // 30

// nullまたはundefinedの場合、デフォルト値を返す
const address = obj?.address?.city ?? "不明"; // "不明"

Optional Chainingは、nullまたはundefinedの可能性がある値を安全にアクセスする方法を提供します。

Nullish Coalescing Operatorは、左側のオペランドがnullまたはundefinedの場合に右側のオペランドを返す演算子です。

const name = "John Doe";
const age = 30;

const greeting = name ?? "名無し"; // "John Doe"
const unknownAge = age ?? "不明"; // 30

// nullまたはundefinedの場合のみデフォルト値を返す
const address = obj?.address?.city ?? "不明"; // "不明"

삼항演산자는 조건에 따라 두 개의 값 중 하나를 반환하는 연산자입니다.

const name = "John Doe";
const age = 30;

const greeting = name ? name : "名無し"; // "John Doe"
const unknownAge = age ? age : "不明"; // 30

// nullまたはundefinedの場合のみデフォルト値を返す
const address = obj?.address?.city ? obj?.address?.city : "不明"; // "不明"

삼항演산자는 다양한 조건에 따라 값을 반환할 수 있는 유연한 방법입니다.

.length 프로パティは、文字列の長さを返します。

const str = ""; // 空文字列

if (str.length === 0) {
  // 空文字列処理
}

.length プロパティは、空文字列かどうかを簡単にチェックする方法です。

.trim() 메서드는 문자열의 양쪽 끝에 있는 공백 문자를 제거합니다.

const str = "   "; // 공백 문자열

if (str.trim() === "") {
  // 공백 문자열 처리
}

.trim() 메서드는 공백 문자열かどうか를 체크하는 방법입니다.

비교 함수는 두 개의 값을 비교하여 부울 값을 반환합니다.

const str = ""; // 空文字列

if (str === "" || str === null || str === undefined) {
  // 空/未定義/null 문자열 처리
}

비교 함수는 다양한 조건을 사용하여 문자열을 체크할 수 있는 방법입니다.