割とif(variable)みたいな感じでエラーチェック済ませがちだったけど、空のオブジェクト空の配列だとtrueになって条件分岐の中入ってしまうんですよね。
ほんでObject.key()とかを毎回の記述するのがめんどいので共通の関数として実装なんてことはよくあると思います。ただ一回実装したらそのプロジェクトでは終わりで次のプロジェクトではまた調べて実装してみたいなんがめんどくさいので誰でも使える共通関数としてメモしておきます。
目次
Null,undefind,空オブジェクト,空配列の場合
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
const isEmpty = (value) => { // null または undefined if (value == null) return true; // 空配列 if (Array.isArray(value) && value.length === 0) return true; // 空オブジェクト if (typeof value === "object" && Object.keys(value).length === 0) return true; // 他の型は「空」と見なさない return false; }; // 使用例 console.log(isEmpty(null)); // true console.log(isEmpty(undefined)); // true console.log(isEmpty([])); // true console.log(isEmpty({})); // true console.log(isEmpty(0)); // false console.log(isEmpty("")); // false (文字列の空チェックは別途実装が必要) |
関数名に関して
isEmpty
isBlank
isNullOrUndefinedOrEmpty
あたりになるかと
個人的にはisEmpty
でいいかなと思ってます。
value == nullについて
これでundefindも含まれるのか？
って思う人もいると思うので軽く補足で
※これはJavaScript の 緩い等価演算子 (==) の挙動によるもの
null == null → true
undefined == undefined → true
null == undefined → true
って感じ
厳密等価 (===)だと
null === null → true
undefined === undefined → true
null === undefined → false
って感じになる
注意
value == nullの場合、空文字や、０、false自体は別な条件を設定する必要があるので注意
Faltyな値を基準にしたい場合
JavaScript では、以下の値が「Falsy（偽の値）」として評価されます：
undefinednullfalse0NaN- 空文字列（
''または""）
これらの値に対して !value を使うと、すべて true と評価されます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
const isEmpty = (value) => { if (!value) return true; // null, undefined, '', 0 など falsy 値をカバー if (Array.isArray(value) && value.length === 0) return true; // 空配列 if (typeof value === 'object' && Object.keys(value).length === 0) return true; // 空オブジェクト return false; }; // 使用例 console.log(isEmpty(null)); // true console.log(isEmpty(undefined)); // true console.log(isEmpty('')); // true console.log(isEmpty(0)); // true console.log(isEmpty([])); // true console.log(isEmpty({})); // true console.log(isEmpty('Hello')); // false console.log(isEmpty([1, 2])); // false console.log(isEmpty({ key: 'value' })); // false |
こっちのほうがはじく幅は広いので目的に応じて実装するのがいいかと
コメント