Heim > Web-Frontend > js-Tutorial > Hauptteil

Detaillierte Einführung in die Filterfunktion in JavaScript

黄舟
Freigeben: 2017-12-06 11:29:19
Original
5678 Leute haben es durchsucht

Ich glaube, dass alle Freunde, die Vue in JavaScript studiert haben, die Filterfunktion kennen, aber es gibt viele Freunde, die nicht wissen, was ein Filter ist Heute geben wir Ihnen eine ausführliche Einführung in die Filterfunktion in JavaScript!

Als ich die Rasterkomponente im Beispiel sah, war ich durch einen verschachtelten Code verwirrt. Nachdem ich um Hilfe gebeten habe, notiere ich ihn hiermit für spätere Anfragen:

Klicken Sie hier, um den gesamten Code anzuzeigen

Teil des Codeausschnitts:

<p style="margin-top: 5px; margin-bottom: 14px; line-height: normal;">data = data.filter(function (row) {<br/>    return <a href="http://www.php.cn/wiki/60.html" target="_blank">Object</a>.keys(row).some(function (key) {<br/>        return String(row[key]).toLowerCase().<br/>        indexOf(filterKey) > -1;<br/>    });<br/>});<br/><br/>data = [<br/>    { name: &#39;Chuck Norris&#39;, power: Infinity },<br/>    { name: &#39;Bruce Lee&#39;, power: 9000 },<br/>    { name: &#39;Jackie Chan&#39;, power: 7000},<br/>    { name: &#39;Jet Li&#39;, power: 8000 }<br/>]<br/></p>
Nach dem Login kopieren

Hinweis: Hier stellt filterKey die in der Eingabe eingegebene Zeichenfolge dar , hier gehen wir davon aus, dass ck

wobei row data[i] darstellt, nehmen Sie die erste Zeile als Beispiel für die Ausführung des Codes, row ist { name: &#39;Chuck Norris&#39;, power: Infinity }, dann Object.keys(row) = [&#39;name&#39;, &#39;power&#39;] , key bedeutet name und power. Die erste ist name, row[&#39;name&#39;] = &#39;Chuck Norris&#39;. Diese Zeichenfolge enthält die Zeichenfolge &#39;ck&#39;, sodass true nicht ausgeführt werden muss. Dann kehrt power oder row zum neuen Array zurück und durchläuft weiterhin die Daten unten. Wenn data[0] diese Zeichenfolge nicht enthält, durchlaufen Sie row[&#39;name&#39;]. Wenn alle row[&#39;power&#39;] sind, geben Sie false nicht zurück und fahren Sie mit dem Durchlaufen fort. row

Der gesamte Code beinhaltet die

Datenbindung von Vue, aber ich werde ihn nicht aufzeichnen, da ich mich immer noch in einem Zustand der Unwissenheit befinde.

Ich bin ein Front-End-Neuling. Wenn Sie in diesem Artikel Fehler finden oder ihn nicht gut verstehen, können Sie mir gerne einen Rat geben.

Ich lerne kürzlich die Rasterkomponente im Beispiel und war verwirrt über einen verschachtelten Code, den ich erst verstehen werde, nachdem ich um Hilfe gebeten habe für spätere Anfragen. :

Klicken Sie hier, um den gesamten Code anzuzeigen

Teil des Codeausschnitts:

data = data.filter(function (row) {
    return Object.keys(row).some(function (key) {
        return String(row[key]).toLowerCase().
        indexOf(filterKey) > -1;
    });
});

data = [
    { name: &#39;Chuck Norris&#39;, power: Infinity },
    { name: &#39;Bruce Lee&#39;, power: 9000 },
    { name: &#39;Jackie Chan&#39;, power: 7000},
    { name: &#39;Jet Li&#39;, power: 8000 }
]
Nach dem Login kopieren
Hinweis: Hier steht

für die eingegebene Zeichenfolge die Eingabe, Hier wird davon ausgegangen, dass die Eingabe filterKeyck

ist, wobei

row darstellt. Nehmen Sie die erste Zeile als Beispiel für die Ausführung des Codes, data[i] ist row, dann { name: 'Chuck Norris', power: Infinity }, Object.keys(row) = ['name', 'power'] steht für key und name. Die erste ist power, name. Diese Zeichenfolge enthält die Zeichenfolge row['name'] = 'Chuck Norris', sodass 'ck' nicht ausgeführt werden muss. Dann kehrt true oder power zum neuen Array zurück und durchläuft weiterhin die Daten unten. Wenn row diese Zeichenfolge nicht enthält, durchlaufen Sie data[0]. Wenn alle row['name'] sind, geben Sie row['power'] nicht zurück und fahren Sie mit dem Durchlaufen fort. falserowDer gesamte Code beinhaltet die Vue-Datenbindung, aber ich werde ihn nicht aufzeichnen, da ich mich immer noch in einem Zustand der Unwissenheit befinde.

Zusammenfassung:
Dieser Artikel stellt die Filterfunktion in JavaScript ausführlich anhand von Beispielcode vor. Ich glaube, dass Freunde es auch wissen werden Erfahren Sie mehr und hoffen Sie, dass es für Ihre Arbeit hilfreich sein wird!

Verwandte Empfehlungen:

Einfache Ajax-Anwendung und Filterschreibmethode

Detaillierte Einführung in das Filterattribut von CSS3

Die URL-Muster-Einstellungsmethode und die Zuordnungsregeln von Servlet und Filter

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in die Filterfunktion in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!