filter()メソッドは、提供された関数によって実装されるテストをパスした要素から成る新しい配列を作成します。

文法

arr.filter(callback[, thisArg])

引数	説明
callback	配列の各要素をテストする関数を指定します。
thisArg	callback実行時にthisとして使用される値を指定します。

説明

filterは、配列の各要素ごとに提供されたcallback関数を呼び出し、 callbackがtrueの値を返した値による新しい配列を構成します。 callbackは値が割り当てられている配列のインデックスに対してのみ実行され、 削除、または値が割り当てられていないインデックスに対しては実行されません。 callbackのテストに渡されなかった配列の要素は単純にスキップされ、 新しい配列には含まれません。

callbackは3つの引数を使用して実行されます。

1. 要素の値
2. 要素のインデックス番号
3. 巡っている配列のオブジェクト

もしthisArgパラメーターがfilterに提供されると、 callback実行時に、そのthis値として渡されます。 そうでなければ、undefinedの値がそのthis値として渡されます。 callbackによって最終的に供給されるthis値は、 関数によるthisの取り扱いの通常の規則に沿って決定されます。(翻訳に自信なし)

filterは呼び出し元の配列を変更しません。

コールバックの最初の実行前に、filterによって設定された要素の範囲が処理されます。 filterが呼び出された後に追加された要素は、callbackの対象にはなりません。 もし配列内の要素が変更、または削除された場合は、 filterがそれらの値を参照する時の値でcallbackに渡され、 削除された要素であれば、その渡す対象から外されます。

例

例: フィルタによる小さな値の除外

下記のサンプルはfilterを使用して、 10未満の要素を削除してフィルタリングされた配列を作成します。

function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

Polyfill

filterは、5thエディションのECMA-262標準で追加されたため、 標準実装の全てに提供されていないかもしれません。 あなたのスクリプトが始まる前に下記のコードを挿入することで、 ネイティブでECMA-262実装のfilterがサポートされない環境でも、filterが使用可能になります。 このアルゴリズムは、5thエディションのECMA-262の正確な仕様の1つであり、 fun.callがFunction.prototype.callの元の値を評価するとみなし、 Array.prototype.pushがその元の値を持ちます。(翻訳に自信なし)

if (!Array.prototype.filter)
{
  Array.prototype.filter = function(fun /*, thisArg */)
  {
    "use strict";

    if (this === void 0 || this === null)
      throw new TypeError();

    var t = Object(this);
    var len = t.length >>> 0;
    if (typeof fun !== "function")
      throw new TypeError();

    var res = [];
    var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
    for (var i = 0; i < len; i++)
    {
      if (i in t)
      {
        var val = t[i];
        //注意: 技術的な観点から、これは次のインデックスで、
        //      pushがObject.prototypeとArray.prototypeのプロパティによって
        //      影響される可能性があるか、Object.definePropertyすべきです。
        //      ただし、メソッドのnewと衝突する事は稀であるため、
        //      代わりにより互換性を広く取る事を選択しています。(翻訳に自信なし)
        if (fun.call(thisArg, val, i, t))
          res.push(val);
      }
    }

    return res;
  };
}

仕様

ブラウザ互換性

デスクトップ

機能	Chrome	Firefox (Gecko)	IE	Opera	Safari
基本	◯	1.5 (1.8)	9	◯	◯

モバイル

機能	Android	Chrome for Android	Firefox Mobile	IE Mobile	Opera Mobile	Safari Mobile
基本	◯	◯	1.0 (1.8)	◯	◯	◯

関連項目

• Array.prototype.forEach()
• Array.prototype.every()
• Array.prototype.some()

 Back to top