Detailliertes Beispiel für JavaScript-Array-Methoden

Detailliertes Beispiel für JavaScript-Array-Methoden

Einführung

veranschaulichen

Dieser Artikel stellt JavaScript-Array-Methoden anhand von Beispielen vor.

Methodeneinführung

join(): verkettet jedes Element im Array unter Verwendung des angegebenen Trennzeichens zu einem String

push(): Fügt ein neues Element am Ende eines Arrays hinzu

pop(): Entfernt das letzte Element in einem Array

shift(): Entfernt das erste Element eines Arrays

unshift(): Fügt ein neues Element an der ersten Position eines Arrays hinzu

slice(): Finde einige Elemente entsprechend den Bedingungen

splice(): ein Array hinzufügen, löschen und ändern

fill(): Diese Methode kann ein oder mehrere Elemente in einem Array mit einem bestimmten Wert füllen.

filter(): Funktion "Filter"

concat(): wird verwendet, um zwei oder mehr Arrays zu verketten

indexOf(): Erkennt den Index des ersten Vorkommens des aktuellen Wertes im Array

lastIndexOf(): Ermittelt den Index des letzten Vorkommens des aktuellen Wertes im Array

every(): Bestimmt, ob jedes Element im Array die Bedingung erfüllt

some(): Überprüft, ob im Array ein Element vorhanden ist, das die Bedingungen erfüllt

includes(): Bestimmt, ob ein Array einen angegebenen Wert enthält

sort(): Sortiert die Elemente eines Arrays

reverse(): kehrt die Reihenfolge eines Arrays um

forEach(): durchläuft jedes Element in einem Array (ES5 und darunter)

map(): durchlaufe jedes Element in einem Array (ES6)

copyWithin(): Wird verwendet, um Elemente von einer angegebenen Position in einem Array an eine andere angegebene Position im Array zu kopieren

find(): Gibt den passenden Wert zurück

findIndex(): Gibt den Index der passenden Position zurück

toLocaleString(), toString(): Konvertiert ein Array in einen String

flat(), flatMap(): Ein Array abflachen

Einträge (), Schlüssel (), Werte (): Durchlaufen Sie das Array.

Erstellen eines Arrays

Erstellungsmethode

JavaScript verfügt insgesamt über 11 Methoden zum Erstellen von Arrays:

[1, 3, 5];
neues Array(3);
Array(3);
 
Array.apply(null, neues Array(3))
Array.apply(null, Array(3));
Array.apply(null, {Länge: 3});
 
//ES6 schreibt Array.of(1, 2);
Array.von({Länge: 3});
Array(3).füllen(2);
Array(...Array(3));
[...Array(3)]

Beispiel

<!doctype html>
<html lang="de">
 
<Kopf>
    <meta charset="UTF-8">
    <title>Dies ist der Titel</title>
</Kopf>
 
<Text>
<Skript>
    sei arr1 = [1, 3, 5];
    lass arr2 = neues Array(3);
    sei arr3 = Array(3);
 
    lass arr4 = Array.apply(null, neues Array(3))
    Lassen Sie arr5 = Array.apply(null, Array(3));
    Lassen Sie arr6 = Array.apply(null, {Länge: 3});
 
    //ES6-Notation let arr7 = Array.of(1, 2);
    lass arr8 = Array.from({Länge: 3});
    sei arr9 = Array(3).fill(2);
    lass arr10 = Array(...Array(3));
    lass arr11 = [...Array(3)]
 
    Konsole.log(arr1);
    Konsole.log(arr2);
    Konsole.log(arr3);
    konsole.log(arr4);
    Konsole.log(arr5);
    Konsole.log(arr6);
    Konsole.log(arr7);
    Konsole.log(arr8);
    Konsole.log(arr9);
    Konsole.log(arr10);
    Konsole.log(arr11);
</Skript>
</body>
</html>

Kurze Ergebnisse:

Detaillierte Ergebnisse:

sichtbar:

Die folgenden beiden Methoden können keine Elemente und Indizes erstellen, sondern nur Längenattribute

neues Array(3);
Array(3);

Andere Methoden können Elemente, Indizes und Längenattribute erstellen.

Auswirkungen auf die Durchquerung

Die Auswirkung auf forEach, for ... in und for ... of ist dieselbe: Arrays ohne Elemente werden übersprungen und nur Werte mit Elementen (einschließlich undefinierter) werden durchlaufen.

Detaillierte Erklärung

Das Prinzip von Array.apply(null, {length: 2})

Dieser Artikel stellt das Prinzip von Array.apply(null, {length: 2}) vor.

var arrayLike = {Länge: 2}

↓↓

Array.apply(null, arrayLike)

↓↓

Array(arrayLike[0], arrayLike[1]) // Übergebe den Wert jedes Elements in einem leeren Array nacheinander an die Methode Array()

↓↓

Array (undefined, undefined) // Der Wert jedes Elements in einem leeren Array ist undefiniert

//Endgültige Ausgabe [undefiniert, undefiniert]

Zuordnungstransformation

Wenn Sie das Array weiter transformieren möchten, können Sie der Methode Array.from() als zweites Argument eine Mapping-Funktion übergeben. Diese Funktion konvertiert jeden Wert des Array-Objekts in die Zielform und speichert ihn an der entsprechenden Position des Ziel-Arrays.

Funktion arga(...args) {  
     gibt Array.from(args, Wert => Wert + 1) zurück;
}
 
lass arr = arga('arr', 26, 'pop');
console.log(arr);//['arr1',27,'pop1']

Wenn Ihre Zuordnungsfunktion an einem Objekt arbeiten muss, können Sie der Methode Array.from() manuell ein drittes Argument übergeben, um diesen Wert innerhalb der Zuordnungsfunktion anzugeben.

const Helfer = {
  Unterschied: 1,
  add(Wert) {
    Rückgabewert + this.diff;
  }
}
 
Funktion übersetzen() {
 //Argumente sind ein arrayähnliches Objekt, das den an die Funktion übergebenen Argumenten entspricht. return Array.from(Argumente, Helper.add, Helper); 
}
 
lass arr = übersetzen('liu', 26, 'Mann');
console.log(arr); // ["liu1", 27, "man1"]

Methoden

verbinden()

Mit der Methode join() werden alle Elemente eines Arrays in einen String umgewandelt.

Elemente werden durch das angegebene Trennzeichen getrennt. Standardmäßig werden Kommas als Trennzeichen verwendet.

var arr = [1,2,3];
konsole.log(arr.join()); // 1,2,3
konsole.log(arr.join("-")); // 1-2-3
console.log(arr); // [1, 2, 3] (das ursprüngliche Array bleibt unverändert)

Mit der Methode join() kann ein String wiederholt werden. Geben Sie einfach den String und die Anzahl der Wiederholungen ein, und der wiederholte String wird zurückgegeben. Die Funktion lautet wie folgt:

Funktion repeatString(str, n) {
    //Ein leeres Array der Länge n+1 wird mithilfe von string zu einem String verkettet, der zu einer Wiederholung von n Strings wird. return new Array(n + 1).join(str);
}
console.log(repeatString("abc", 3)); // abcabcabc
console.log(repeatString("Hi", 5)); // HiHiHiHiHi

push() und pop()

Die push()-Methode fügt einem Array Elemente vom Ende des Arrays hinzu. Es können ein oder mehrere Elemente hinzugefügt werden.

Die Methode pop() wird verwendet, um das letzte Element eines Arrays zu entfernen und das entfernte Element zurückzugeben.

var arr = ["Lily","lucy","Tom"];
var count = arr.push("Jack","Sean");
konsole.log(Anzahl); // 5
konsole.log(arr); // ["Lily", "lucy", "Tom", "Jack", "Sean"]
var item = arr.pop();
konsole.log(Element); // Sean
konsole.log(arr); // ["Lily", "lucy", "Tom", "Jack"]

shift() und unshift()

Die Methode shift() wird verwendet, um das erste Element eines Arrays daraus zu entfernen und den Wert des ersten Elements zurückzugeben.

Die Methode unshift() fügt am Anfang eines Arrays ein oder mehrere Elemente hinzu und gibt die neue Länge zurück.

var arr = ["Lily","lucy","Tom"];
var count = arr.unshift("Jack","Sean");
konsole.log(Anzahl); // 5
Konsole.log(arr); //["Jack", "Sean", "Lily", "lucy", "Tom"]
var item = arr.shift();
konsole.log(Element); // Jack
konsole.log(arr); // ["Sean", "Lily", "lucy", "Tom"]

Sortieren()

Die Methode sort() wird zum Sortieren der Elemente eines Arrays verwendet.

Die Sortierreihenfolge kann alphabetisch oder numerisch sowie aufsteigend oder absteigend sein.

Die Standardsortierreihenfolge ist aufsteigend alphabetisch.

var arr1 = ["a", "d", "c", "b"];
console.log(arr1.sort()); // ["a", "b", "c", "d"]
arr2 = [13, 24, 51, 3];
console.log(arr2.sort()); // [13, 24, 3, 51]
console.log(arr2); // [13, 24, 3, 51] (das Element-Array wird geändert)

Um das obige Problem zu lösen, kann die Methode sort() eine Vergleichsfunktion als Parameter erhalten, sodass wir angeben können, welcher Wert vor welchem ​​Wert kommt.

Die Vergleichsfunktion verwendet zwei Argumente und gibt eine negative Zahl zurück, wenn das erste Argument vor dem zweiten kommen soll, 0, wenn die beiden Argumente gleich sind, oder eine positive Zahl, wenn das erste Argument nach dem zweiten kommen soll. Hier ist eine einfache Vergleichsfunktion:

Funktion vergleichen(Wert1, Wert2) {
    wenn (Wert1 < Wert2) {
        Rückgabe -1;
    } sonst wenn (Wert1 > Wert2) {
           Rückgabe 1;
    } anders {
        gebe 0 zurück;
    }
}
arr2 = [13, 24, 51, 3];
console.log(arr2.sort(vergleichen)); // [3, 13, 24, 51]

Wenn Sie eine Vergleichsfunktion verwenden müssen, um ein absteigendes Sortierergebnis zu erzielen, vertauschen Sie einfach die von der Vergleichsfunktion zurückgegebenen Werte:

Funktion vergleichen(Wert1, Wert2) {
    wenn (Wert1 < Wert2) {
        Rückgabe 1;
    } sonst wenn (Wert1 > Wert2) {
        Rückgabe -1;
    } anders {
        gebe 0 zurück;
    }
}
arr2 = [13, 24, 51, 3];
console.log(arr2.sort(vergleichen)); // [51, 24, 13, 3]

umkehren()

Mit der Methode reverse() wird die Reihenfolge der Elemente in einem Array umgekehrt.
var arr = [13, 24, 51, 3];
Konsole.log(arr.reverse()); //[3, 51, 24, 13]
console.log(arr); //[3, 51, 24, 13] (das ursprüngliche Array ändert sich)

concat()

Die Methode concat() wird verwendet, um zwei oder mehr Arrays zu verketten.

Diese Methode verändert das vorhandene Array nicht, sondern gibt einfach eine Kopie des verketteten Arrays zurück.

var arr = [1,3,5,7];
var arrCopy = arr.concat(9,[11,13]);
console.log(arrCopy); //[1, 3, 5, 7, 9, 11, 13]
console.log(arr); // [1, 3, 5, 7] (das ursprüngliche Array wird nicht geändert)

Aus den obigen Testergebnissen können wir Folgendes ableiten: Wenn die Eingabe kein Array ist, werden die Parameter direkt am Ende des Arrays hinzugefügt. Wenn die Eingabe ein Array ist, wird jedes Element im Array dem Array hinzugefügt. Was aber, wenn ein zweidimensionales Array übergeben wird?

var arrCopy2 = arr.concat([9,[11,13]]);
console.log(arrCopy2); //[1, 3, 5, 7, 9, Array[2]]
console.log(arrCopy2[5]); //[11, 13]

Scheibe()

slice(): Gibt ein neues Array zurück, das aus Elementen vom angegebenen Startindex bis zum Endindex im ursprünglichen Array besteht.

Die Methode slice() kann einen oder zwei Parameter akzeptieren, die Start- und Endpositionen der zurückzugebenden Elemente.

Mit nur einem Argument gibt die Methode slice() alle Elemente ab der durch das Argument angegebenen Position bis zum Ende des aktuellen Arrays zurück.

Wenn zwei Argumente vorhanden sind, gibt diese Methode die Elemente zwischen der Start- und Endposition zurück, jedoch ohne die Endposition.

Wenn eine negative Zahl erscheint, wird die Zahl an dieser Position durch die negative Zahl plus die Länge des Arrays ersetzt (6).

var arr = [1,3,5,7,9,11];
var arrCopy = arr.slice(1);
var arrCopy2 = arr.slice(1,4);
var arrCopy3 = ​​​​arr.slice(1,-2); //entspricht arr.slice(1,4)
var arrCopy4 = arr.slice(-4,-1); // entspricht arr.slice(2,5)
console.log(arr); //[1, 3, 5, 7, 9, 11] (das ursprüngliche Array bleibt unverändert)
console.log(arrCopy); //[3, 5, 7, 9, 11]
console.log(arrCopy2); //[3, 5, 7]
console.log(arrCopy3); //[3, 5, 7]
console.log(arrCopy4); //[5, 7, 9]

spleißen()

splice(): Eine sehr leistungsfähige Array-Methode, die vielseitig einsetzbar ist und zum Löschen, Einfügen und Ersetzen verwendet werden kann.

1. Löschen Sie das Element und geben Sie das gelöschte Element zurück

Sie können eine beliebige Anzahl von Elementen löschen, indem Sie nur zwei Parameter angeben: die Position des ersten zu löschenden Elements und die Anzahl der zu löschenden Elemente. Beispielsweise entfernt splice(0,2) die ersten beiden Elemente im Array.

var arr = [1,3,5,7,9,11];
var arrRemoved = arr.splice(0,2);
console.log(arr); //[5, 7, 9, 11]
console.log(arrEntfernt); //[1, 3]

2. Fügen Sie dem angegebenen Index ein Element hinzu

Sie können eine beliebige Anzahl von Elementen an einer angegebenen Position einfügen, indem Sie drei Parameter angeben: die Startposition, 0 (die Anzahl der zu entfernenden Elemente) und die einzufügenden Elemente. Beispielsweise fügt splice(2,0,4,6) 4 und 6 beginnend bei Position 2 im aktuellen Array ein.

var array1 = [22, 3, 31, 12];
array1.splice(1, 0, 12, 35); //[]
 
console.log(array1); // [22, 12, 35, 3, 31, 12]

3. Ersetzen Sie das Element an der angegebenen Indexposition

Sie können eine beliebige Anzahl von Elementen an einer angegebenen Position einfügen und gleichzeitig eine beliebige Anzahl von Elementen löschen, indem Sie nur drei Parameter angeben: die Startposition, die Anzahl der zu löschenden Elemente und die beliebige Anzahl der einzufügenden Elemente. Die Anzahl der eingefügten Elemente muss nicht mit der Anzahl der gelöschten Elemente übereinstimmen. Beispielsweise löscht splice (2,1,4,6) das Element an Position 2 im aktuellen Array und fügt dann 4 und 6 beginnend bei Position 2 ein.

const array1 = [22, 3, 31, 12];
array1.splice(1, 1, 8); //[3]
 
konsole.log(array1); // [22, 8, 31, 12]

indexOf() und lastIndexOf()

Nimmt zwei Argumente an: das zu suchende Element und (optional) einen Index, der angibt, wo die Suche beginnen soll.

indexOf(): Sucht rückwärts vom Anfang des Arrays (Position 0).

lastIndexOf: Vorwärtssuche vom Ende des Arrays aus.

Beide Methoden geben die Position des gesuchten Elements im Array zurück oder -1, wenn es nicht gefunden wird. Der strikte Gleichheitsoperator wird beim Vergleichen des ersten Arguments mit jedem Element im Array verwendet.

var arr = [1,3,5,7,7,5,3,1];
konsole.log(arr.indexOf(5)); //2
console.log(arr.lastIndexOf(5)); //5
console.log(arr.indexOf(5,2)); //2
console.log(arr.lastIndexOf(5,4)); //2
konsole.log(arr.indexOf("5")); //-1

fürJedes()

forEach(): Durchläuft ein Array und führt für jedes Element im Array eine bestimmte Funktion aus. Diese Methode hat keinen Rückgabewert. Parameter sind alle Funktionstypen und werden standardmäßig übergeben.

Die Parameter sind: der zu durchlaufende Array-Inhalt, der entsprechende Array-Index, das Array selbst

var arr = [11, 22, 33, 44, 55];
arr.forEach(Funktion(x, Index, a){
    Konsole.log(x + '|' + Index + '|' + (a === arr));
});

Die Ausgabe ist:

11|0|wahr

22|1|wahr

33|2|wahr

44|3|wahr

55|4|wahr

Karte()

Die Methode map() gibt ein neues Array zurück, dessen Elemente die Werte sind, die durch den Aufruf der Funktion auf den Elementen des ursprünglichen Arrays verarbeitet wurden.

Die map()-Methode verarbeitet die Elemente im ursprünglichen Array in der Reihenfolge, in der sie platziert wurden.

Diese Methode ändert das ursprüngliche Array nicht.

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(Funktion(Element){
    Artikel*Artikel zurückgeben;
});
console.log(arr2); //[1, 4, 9, 16, 25]

Filter()

filter(): „Filter“-Funktion, jedes Element im Array führt die angegebene Funktion aus und gibt ein Array zurück, das die Filterbedingungen erfüllt.

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(Funktion(x, Index) {
    Rückgabeindex % 3 === 0 || x >= 8;
});
console.log(arr2); //[1, 4, 7, 8, 9, 10]

fill() (neu in ES6)

Die Methode fill() füllt ein oder mehrere Elemente in einem Array mit einem bestimmten Wert. Wenn ein einzelnes Argument übergeben wird, füllt die Methode das gesamte Array mit dem Wert dieses Arguments.

sei arr = [1, 2, 3, 'cc', 5];
arr.fill(1);
konsole.log(arr);//[1,1,1,1,1];

Wenn Sie nicht alle Elemente im Array ändern möchten, sondern nur einen Teil davon, können Sie die optionalen Parameter Startposition und Endposition verwenden (ausgenommen das Element an der Endposition).

3 Parameter: Füllwert, Startpositionsparameter, Endpositionsparameter (ausschließlich des Elements an der Endposition)

sei arr = [1, 2, 3, 'arr', 5];
 
arr.fill(1, 2);
konsole.log(arr); //[1,2,1,1,1]
 
arr.fill(0, 1, 3);
console.log(arr); //[1,0,0,1,1];

jeder()

every(): Bestimmt, ob jedes Element im Array die Bedingungen erfüllt. Nur wenn alle Elemente die Bedingungen erfüllen, wird true zurückgegeben.

var arr = [1, 2, 3, 4, 5];
 
var arr2 = arr.every(Funktion(x) {
    gebe x < 10 zurück;
});
console.log(arr2); //wahr
 
var arr3 = arr.every(Funktion(x) {
    gebe x < 3 zurück;
});
console.log(arr3); // falsch

manche()

some(): Bestimmt, ob das Array Elemente enthält, die die Bedingungen erfüllen. Solange es ein Element gibt, das die Bedingungen erfüllt, wird „true“ zurückgegeben.

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.some(Funktion(x) {
    gebe x < 3 zurück;
});
console.log(arr2); //wahr
var arr3 = arr.some(Funktion(x) {
    gebe x < 1 zurück;
});
console.log(arr3); // falsch

schließt ein() (ES7)

Mit der Methode „includes()“ wird ermittelt, ob ein Array einen angegebenen Wert enthält. Wenn dies der Fall ist, wird „true“ zurückgegeben, andernfalls „false“.

Es gibt zwei Parameter: Der erste ist der (erforderliche) zu suchende Elementwert und der zweite ist die (optionale) Position, an der mit der Suche nach dem Element begonnen werden soll.

const array1 = [22, 3, 31, 12, 'arr'];
const umfasst = array1.umfasst(31);
console.log(enthält); // wahr
 
const includes1 = array1.includes(31, 3); // Beginnen Sie bei Index 3 und suchen Sie, ob 31 existiert console.log(includes1); // false

Beachten Sie, dass Includes den Operator === zum Vergleichen von Werten verwenden, mit einer Ausnahme: NaN wird als gleich sich selbst betrachtet.

lass Werte = [1, NaN, 2];
konsole.log(Werte.indexOf(NaN)); //-1
console.log(Werte.includes(NaN)); //wahr

reduce() und reduceRight()

Beide Methoden implementieren die Iteration über alle Elemente des Arrays (d. h. des Akkumulators) und erstellen dann einen endgültigen Rückgabewert.

Die Methode „reduce()“ beginnt mit dem ersten Element des Arrays und durchläuft es nacheinander bis zum Ende.

reduceRight() beginnt beim letzten Element im Array und durchläuft es vorwärts zum ersten Element.

4 Parameter: vorheriger Wert, aktueller Wert, Index des Elements und Array-Objekt.

var-Werte = [1,2,3,4,5];
var Summe = Werte.ReduceRight(Funktion(vorherige, aktuelle, Index, Array){
    Rückgabewert für vorherige + aktuelle;
},10); //Das Array wird zunächst mit einem Anfangswert von 10 hinzugefügt, der Standardwert von 0 ist optional
console.log(Summe); //25

toLocaleString() und toString()

Konvertieren eines Arrays in einen String

const array1 = [22, 3, 31, 12];
const str = array1.toLocaleString();
const str1 = array1.toString();
 
console.log(str); // 22,3,31,12
konsole.log(str1); // 22,3,31,12

find() und findIndex()

Sowohl die Methode find() als auch die Methode findIndex() akzeptieren zwei Parameter: eine Rückruffunktion und einen optionalen Wert, der verwendet wird, um dies innerhalb der Rückruffunktion anzugeben.

Die Rückruffunktion kann drei Parameter akzeptieren: ein Element des Arrays, die dem Element entsprechende Indexposition und das Array selbst.

Die Rückruffunktion sollte „true“ zurückgeben, wenn das angegebene Element die von Ihnen definierten Bedingungen erfüllt, und sowohl die Methoden find() als auch findIndex() beenden die Suche, wenn die Rückruffunktion zum ersten Mal „true“ zurückgibt.

Der Unterschied zwischen den beiden besteht darin, dass die Methode find() den übereinstimmenden Wert zurückgibt, während findIndex() den Index der übereinstimmenden Position zurückgibt.

sei arr = [1, 2, 3, 'arr', 5, 1, 9];
 
console.log(arr.find((Wert, Schlüssel, arr) => {
    Rückgabewert > 2;
})); // 3 gibt den passenden Wert zurück console.log(arr.findIndex((value, keys, arr) => {
    Rückgabewert > 2;
})); // 2 Gibt den Index der passenden Position zurück

Kopieren innerhalb von() (ES6)

Die Methode copyWithin() wird verwendet, um Elemente von einer angegebenen Position in einem Array an eine andere angegebene Position im Array zu kopieren.

Diese Methode ändert das vorhandene Array

//Kopiere die ersten beiden Elemente eines Arrays an die letzten beiden Positionen des Arrays let arr = [1, 2, 3, 'arr', 5];
 
arr.copyWithin(3, 0);
konsole.log(arr);//[1,2,3,1,2]

Standardmäßig kopiert die Methode copyWithin() immer bis zum Ende des Arrays, Sie können jedoch einen optionalen Parameter angeben, um zu begrenzen, wie viele Elemente überschrieben werden. Dieser dritte Parameter gibt die Position an, an der der Kopiervorgang endet (die Position selbst nicht mitgerechnet).

sei arr = [1, 2, 3, 'arr', 5, 9, 17];
 
//Ab Index 3 einfügen //Ab Index 0 kopieren //Kopieren bei Index 3 beenden arr.copyWithin(3, 0, 3);
konsole.log(arr);//[1,2,3,1,2,3,17]

flat() und flatMap() (ES6)

Die Methode flat() durchläuft ein Array rekursiv bis zu einer angegebenen Tiefe, fügt alle Elemente mit den Elementen im durchlaufenen Teilarray zu einem neuen Array zusammen und gibt es zurück.

Diese Methode gibt ein neues Array zurück und hat keine Auswirkungen auf die Originaldaten.

Parameter: Gibt die Strukturtiefe des zu extrahierenden verschachtelten Arrays an. Der Standardwert ist 1.

const arr1 = [0, 1, 2, [3, 4]];
 
Konsole.log(arr1.flat());
// erwartete Ausgabe: [0, 1, 2, 3, 4]
 
const arr2 = [0, 1, 2, [[[3, 4]]]];
 
console.log(arr2.flat(2));
// erwartete Ausgabe: [0, 1, 2, [3, 4]]
 
//Mit Infinity können Sie verschachtelte Arrays beliebiger Tiefe erweitern. var arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Unendlich);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
 
// Die leeren Elemente im Array abflachen. Wenn das ursprüngliche Array freie Stellen enthält, überspringt die Methode flat() diese. var arr4 = [1, 2, , 4, 5];
arr4.flat();
// [1, 2, 4, 5]

Die Methode flatMap() führt für jedes Mitglied des ursprünglichen Arrays eine Funktion aus. Dies entspricht der Ausführung von Array.prototype.map() und der anschließenden Ausführung der Methode flat() für das Array der Rückgabewerte.

Diese Methode gibt ein neues Array zurück, ohne das ursprüngliche Array zu ändern.

// Entspricht [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]

Einträge(), Schlüssel() und Werte() (ES6)

entries(), keys() und values() – werden zum Iterieren über ein Array verwendet. Sie alle geben ein Iteratorobjekt zurück, das mit einer for...of-Schleife iteriert werden kann.

Der Unterschied besteht darin, dass keys() eine Durchquerung von Schlüsselnamen, values() eine Durchquerung von Schlüsselwerten und entries() eine Durchquerung von Schlüssel-Wert-Paaren ist.

für (let index of ['a', 'b'].keys()) {  
    konsole.log(index);  
}  
// 0  
// 1  
 
für (let elem von ['a', 'b'].values()) {  
    Konsole.log(Element);  
}  
// 'A'  
// 'B'  
 
für (let [index, elem] of ['a', 'b'].entries()) {  
    console.log(index, element);  
}  
// 0 "ein"  
// 1 "b"

Wenn Sie die for...of-Schleife nicht verwenden, können Sie die nächste Methode des zu durchlaufenden Objekts manuell aufrufen.

sei Buchstabe = ['a', 'b', 'c'];  
let Einträge = Brief.Einträge();  
console.log(Einträge.nächstes().Wert); // [0, 'a']  
console.log(entries.next().value); // [1, 'b']  
console.log(einträge.nächstes().wert); // [2, 'c']

Oben finden Sie eine detaillierte Erläuterung der Beispiele für JavaScript-Array-Methoden. Weitere Informationen zu JavaScript-Array-Methoden finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!

Das könnte Sie auch interessieren:
  • Vollständige Liste der Javascript-Array-Methoden
  • Konvertierung eines eindimensionalen JS-Arrays in ein dreidimensionales Array
  • Detaillierte Erklärung der JS-Array-Methoden
  • Detaillierte Erläuterung gängiger Methoden von JavaScript-Arrays
  • js Array fill() Füllmethode
  • Lernen wir die Array-Methoden von Javascript kennen

<<:  Was Sie über Responsive Design wissen müssen

>>:  Implementierungscode der HTML-Floating-Promptbox-Funktion

Artikel empfehlen

Optimale Webseitenbreite und ihre kompatible Implementierungsmethode

1. Beim Entwerfen einer Webseite ist das Bestimmen...

So spielen Sie lokale Mediendateien (Video und Audio) mit HTML und JavaScript ab

Erstens kann JavaScript aus Sicherheitsgründen ni...

Grafisches Tutorial zur Installation und Konfiguration von MySQL 5.7.27 winx64

In diesem Artikel wird die Installations- und Kon...

Der Unterschied zwischen HTML-Block-Level-Tags und Inline-Tags

1. Blockebenenelement: bezieht sich auf die Fähigk...

Zusammenfassung der Wissenspunkte zu MySQL-Index, Sperre und Transaktion

Dieser Artikel fasst die Wissenspunkte zu MySql-I...

Implementierung der Bereitstellung des Nginx+ModSecurity-Sicherheitsmoduls

Inhaltsverzeichnis 1. Herunterladen 2. Bereitstel...

Beispielcode zum Zeichnen von Doppelpfeilen in gängigen CSS-Stilen

1. Mehrere Aufrufe eines einzelnen Pfeils Sobald ...

Einführung in die Verwendung von CSS3-Filterattributen

1. Einleitung Beim Schreiben von Animationseffekt...

Warum sollten MySQL-Felder NOT NULL verwenden?

Ich habe vor Kurzem in einer neuen Firma angefang...

Designtheorie: Zehn Tipps zur Inhaltspräsentation

<br /> Der Entwurf einer persönlichen Schrei...

Analyse des SELECT-Abfrageausdrucks in der MySQL-Datenbank

Ein großer Teil der Datenverwaltung besteht aus S...