JavaScript: 配列から null、undefined、空文字を削除する

JavaScript で、配列から「null」や「undefined」、 「"" 空文字」が入った要素を削除する処理を紹介します。

ループを使う方法と、filter() メソッドを使う方法を紹介します。

ループを使って削除する

ループ（for文）を使って削除する場合は、 次のようになります。


let arr = [1, 2, 3, 4, 5, null, undefined, 0, "", false];

for (let i = 0; i < arr.length; i++){
	if (arr[i] === null || arr[i] === undefined || arr[i] === ""){
		arr.splice(i, 1);  // 削除
		if (i > 0) i--;
	}
}

console.log(arr); // Array [ 1, 2, 3, 4, 5, 0, false ]

「null・undefined・空文字」以外にも削除したい値があれば、条件式に加えてください。

または削除したくない値があれば、条件式からはずしてください。

filter() メソッドを使って削除する

filter() メソッドを使ってnull・undefined・空文字を削除する場合は、 次のように記述します。


let arr = [1, 2, 3, 4, 5, null, undefined, 0, "", false];

let new_arr = arr.filter(function(x){
	return !(x === null || x === undefined || x === ""); 
})

console.log(new_arr); // Array [ 1, 2, 3, 4, 5, 0, false ]

filterメソッドのコールバック関数の戻り値は、 要素を残す場合はTrue、削除する場合はfalseなので、return分は

	return !(x === null || x === undefined || x === "");

のように「!（論理否定演算子）」を使って記述します。

falsy な値を削除する場合

falsy（false とみなされる値）をすべて削除していいなら、 シンプルに次のように記述できます。


let arr = [1, 2, 3, 4, 5, null, undefined, 0, "", false];

let new_arr = arr.filter(Boolean);

console.log(new_arr); // Array [ 1, 2, 3, 4, 5 ]

注意点として、この場合は null、undefined、空文字以外にも削除される値があることに 注意してください。

falseと見なされる値は次の通りです。

  • null
  • undefided
  • “” 空文字
  • 数値の 0
  • NaN
JavaScript入門