JavaScript の filter() メソッドについての深い理解 (コード付き)

この記事で紹介するのは JavaScript の filter() メソッドです。これは JavaScript で広く使用されています。 必要な方は参考にしていただければ幸いです。助けてください、あなたは助けました。

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

var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);
console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

構文

var array = arr.filter(function(item,index,array){})
// 一般都传一个参数

戻り値

テストに合格した要素のコレクションの新しい配列 (テストに合格しなかった場合)テストは空の配列を返します

説明

フィルターは配列内の各要素に対してコールバック関数を 1 回呼び出し、コールバックが true または同等の値を返す原因となるすべての要素を使用します。 true value の要素を含む新しい配列を作成します。コールバック関数は、値が割り当てられているインデックスに対してのみ呼び出され、削除されたインデックスや値が割り当てられていないインデックスに対しては呼び出されません。コールバック関数のテストに失敗した要素はスキップされ、新しい配列には含まれません。

filter 走査される要素の範囲は、コールバック関数が初めて呼び出される前に決定されます。 filter を呼び出した後に配列に追加された要素は、filter によってトラバースされません。既存の要素が変更されている場合、コールバック関数に渡される値は、フィルターがそれらを走査した時点の値です。削除された要素、または値が割り当てられていない要素は走査されません。 (理解できない場合は、前に書いた forEach メソッドを読んでください)

例

すべての小さな値をフィルタリングして除外する

//下例使用 filter 创建了一个新数组，该数组的元素由原数组中值大于 10 的元素组成。
function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44]

Filter JSON無効なエントリです

// 以下示例使用filter()创建具有非零id的json。
var arr = [
  { id: 15 },
  { id: -1 },
  { id: 0 },
  { id: 3 },
  { id: 12.2 },
  { },
  { id: null },
  { id: NaN },
  { id: 'undefined' }
];
var invalidEntries = 0;
function isNumber(obj) {
  return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj);
} 
function filterByID(item) {
  if (isNumber(item.id) && item.id !== 0) {
    return true;
  } 
  invalidEntries++;
  return false; 
}
var arrByID = arr.filter(filterByID);
console.log('Filtered Array\n', arrByID); 
// Filtered Array
// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]
console.log('Number of Invalid Entries = ', invalidEntries); 
// Number of Invalid Entries = 5

配列内で検索

// 下面的示例使用filter()根据搜索条件过滤数组内容
var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
/**
 * Array filters items based on search criteria (query)
 */
function filterItems(query) {
  return fruits.filter(function(el) {
      return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
  })
}
console.log(filterItems('ap')); // ['apple', 'grapes']
console.log(filterItems('an')); // ['banana', 'mango', 'orange']
//如果输入的字母是不相连的，那么久得不到你想要的结果
console.log(filterItems('al'));// []
// 输出结果为空

通常、フィルタリングとフィルタリングには filter メソッドが使用されます。

フィルター メソッドが一部の環境でサポートされていない場合は、mdn Web サイトにアクセスして、問題の MDN Array.prototype.filter() メソッドを解決してください。

以上がJavaScript の filter() メソッドについての深い理解 (コード付き)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。