Gatsby Logo

「Array.prototype.filter()」メソッドで配列のfalsyな要素を除去する

2020-10-20

filter()メソッドを使うことで、配列のfalsyな要素(0, null, undefined, false)を除去することができる。

JS
const array = [0, 1, null, 3, undefined, 5, false, 7, '', 9]
const hoge = array.filter(num => num)
console.log(hoge) // [ 1, 3, 5, 7, 9]

解説

Array.prototype.filter()は、与えられたcallback関数を配列の各要素に対して一度ずつ呼び出し、callbacktrueと評価される値を返したすべての要素からなる新しい配列を生成します。

引用:Array.prototype.filter() - JavaScript | MDN

通常は、以下のようにcallback関数に条件式を定義するが、要素をそのままreturnすることによって、trueに評価される要素だけの配列を作ることができる。

JS
const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

参考

Gatsby Tutorial Starter - Justin Formentin