Heim  >  Artikel  >  Web-Frontend  >  Vertiefendes Verständnis der filter()-Methode in JavaScript (mit Code)

Vertiefendes Verständnis der filter()-Methode in JavaScript (mit Code)

yulia
yuliaOriginal
2018-09-14 15:46:423301Durchsuche

Was dieser Artikel Ihnen bringt, ist die filter()-Methode in JavaScript, die auch in JavaScript weit verbreitet ist Sie hat einen gewissen Referenzwert Hilfe Du hast geholfen. Die Methode

filter() erstellt ein neues Array, das alle Elemente des Tests enthält, die von der bereitgestellten Funktion implementiert werden.

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"]

Syntax

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

Rückgabewert

Ein neues Array der Sammlung von Elementen, die den Test bestanden haben, falls nicht Der Test gibt ein leeres Array zurück.

Beschreibung

Filter ruft die Rückruffunktion einmal für jedes Element im Array auf und verwendet alle Elemente, die dazu führen, dass der Rückruf „true“ oder einen gleichwertigen Wert zurückgibt auf true Erstellt ein neues Array mit den Wertelementen. Die Rückruffunktion wird nur für Indizes aufgerufen, denen Werte zugewiesen wurden, und nicht für Indizes, die gelöscht wurden oder denen nie Werte zugewiesen wurden. Elemente, die den Callback-Funktionstest nicht bestehen, werden übersprungen und nicht in das neue Array aufgenommen.

filter Der Bereich der durchlaufenen Elemente wurde bestimmt, bevor die Callback-Funktion zum ersten Mal aufgerufen wird. Elemente, die nach dem Aufruf von Filter zum Array hinzugefügt werden, werden vom Filter nicht durchlaufen. Wenn vorhandene Elemente geändert wurden, sind die Werte, die sie an die Rückruffunktion übergeben, die Werte in dem Moment, in dem der Filter sie durchläuft. Elemente, die gelöscht wurden oder denen nie ein Wert zugewiesen wurde, werden nicht durchlaufen. (Wenn Sie es nicht verstehen, lesen Sie bitte die zuvor beschriebene forEach-Methode)

Beispiel

Alle kleinen Werte filtern und ausschließen

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

JSON filtern Ungültiger Eintrag

// 以下示例使用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

Suche im Array

// 下面的示例使用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'));// []
// 输出结果为空

Die Filtermethode wird im Allgemeinen zum Filtern und Filtern verwendet.

Wenn die Filtermethode in einigen Umgebungen nicht unterstützt wird, besuchen Sie bitte die MDN-Website, um das Problem mit der MDN-Methode Array.prototype.filter() zu lösen.

Das obige ist der detaillierte Inhalt vonVertiefendes Verständnis der filter()-Methode in JavaScript (mit Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn