JavaScript | filter()で配列から空値を削除する方法

2020-06-112021-11-25JavaScript 配列,JavaScript

JavaScriptのfilter()関数のオプションにBooleanを指定して配列から空値を削除する方法の紹介です。

filter(Boolean)の基本

filter()関数の引数にBooleanを指定することで、配列の値から空の値、0、null、undefinedとなっているものを削除して詰めます。

新しい配列 = 配列.filter(Boolean);

filter()関数は結果の配列を返しますが、元の配列に影響はしません。

0が削除されることに注意します。
また、半角スペースや改行コードなどは削除されません。

filter(Boolean)の動作サンンプル

サンプルでは、配列[ “JavaScript", 0, 1, " “, “", undefined, null]を用意して、filter(Boolean)を通しています。

空値、0、undefined、nullのデータが削除された結果を取得しています。

let array = [ "JavaScript", 0, 1, " ", "", undefined, null];

let new_array = array.filter(Boolean);

console.log(new_array);
//["JavaScript",1," "]

数値0の値を残したい場合

filter()関数は数値0（ゼロ）を偽値として判別され除外します。

配列内のデータが数値のみの場合であればfilter(Number.isFinite)を利用することで0を含めた数値を残し、空値、文字列などを除外した値を得ることが可能です。

let array = [ 0, 1, 2," ", "", undefined, null];

let new_array = array.filter(Number.isFinite);

console.log(new_array);
//[0,1,2]

文字列などと複合している場合、typeofなどを利用して数値かどうか判別して0を削除させない工夫が必要となります。