Heim > Artikel > Web-Frontend > js-Array-Methode
Der Inhalt dieses Artikels ist die js-Array-Methode. Jetzt teile ich sie mit allen und kann auch als Referenz für Freunde in Not verwendet werden
Array-Erstellung
Es gibt zwei Möglichkeiten, Arrays in JavaScript zu erstellen Die erste ist die Verwendung von Array Konstruktor:
1 1 2 3 var arr1 = new Array(); //创建一个空数组 var arr2 = new Array(20); // 创建一个包含20项的数组 var arr3 = new Array("lily","lucy","Tom"); // 创建一个包含3个字符串的数组 2 3 1 2 3 var arr4 = []; //创建一个空数组 var arr5 = [20]; // 创建一个包含1项的数组 var arr6 = ["lily","lucy","Tom"]; // 创建一个包含3个字符串的数组 |
var arr1 = new Array(); //Erstellen Sie ein leeres Array var arr2 = neu Array(20); // Erstellen Sie eine Datei mit 20Array von Elementen var arr3 = neu Array("lily","lucy","Tom"); / / Erstellen Sie eine Datei mit 3Array von Strings |
1 2 3 |
var arr4 = []; //Erstellen Sie eine leeres Array var arr5 = [20]; // Erstellen Sie ein Array mit 1 Elementen var arr6 = ["lily","lucy","Tom"]; // Erstellen Sie eine Array mit 3 Strings td> |
Verwenden Sie beim Lesen und Festlegen von Werten eines Arrays eckige Klammern und geben Sie einen numerischen Index basierend auf 0 für den entsprechenden Wert an:
1 1 2 3 4 var arr6 = ["lily","lucy","Tom"]; // 创建一个包含3个字符串的数组 alert(arr6[0]); //lily arr6[1] = "mary"; //修改第二项为mary arr6[3] = "sean"; //增加第四项为sean 2 3 4
var arr6 = ["lily"
,
1 2 3 |
var arr = ["lily","lucy","Tom"]; // 创建一个包含3个字符串的数组 arr[arr.length] = "sean"; //在下标为3处(也就是数组尾部)添加一项"sean" arr.length = arr.length-1; //将数组的最后一项删除 |
alert(arr6[ 0 ]); //lily arr6[1] = "mary"; //Ändern Sie das zweite Element in mary arr6[3] = "sean"; / /Fügen Sie das vierte Element als sean
1 2 3 |
var arr = ["lily","lucy","Tom"]; // Erstellen Sie ein Array 3 🎜 > arr[arr.length] = " Sean "; // ist tiefgestellt als 3 Hinzufügen ein Element unter "sean" arr.length = arr.length-1; //Das letzte Element im Array löschen |
Wenn Sie vor ECMAScript 5 feststellen müssen, ob ein Objekt ein Array-Objekt ist, können wir instanceof Array Um es zu beurteilen, aber das Problem mit dem instanceof -Operator besteht darin, dass er davon ausgeht, dass es nur eine globale Ausführungsumgebung gibt. Wenn die Webseite mehrere Frames enthält, gibt es tatsächlich mehr als zwei verschiedene globale Ausführungsumgebungen und damit mehr als zwei verschiedene Versionen des Array -Konstruktors. Wenn Sie ein Array von einem Frame an einen anderen übergeben, hat das übergebene Array einen anderen Konstruktor als das Array, das nativ im zweiten Frame erstellt wurde.
ECMAScript 5 Methode Array.isArray() hinzugefügt. Der Zweck dieser Methode besteht darin, letztendlich zu bestimmen, ob ein Wert ein Array ist, unabhängig vom globalen Ausführungskontext, in dem er erstellt wurde.
Array-Methoden
Im Folgenden werden die Methoden von Arrays vorgestellt, darunter Array-Prototypmethoden und andere von Objekt Von Objekten geerbte Methoden Hier stellen wir nur die Prototypmethoden von Arrays vor. Die wichtigsten Array-Prototypmethoden sind wie folgt:
join() push()
und pop()shift()
und unshift()sort()
reverse()
concat()
slice()
splice()
indexOf()
und lastIndexOf() (ES5Neu)forEach()
(ES5Neu) map()
(ES5Neu) Filter ( )
(ES5Neu) jedes()
(ES5 Neu)einige()
(ES5Neu) reduce()
und ReduceRight() (neu in ES5)
Neue Methodenbrowser-Unterstützung für ES5:
Opera 11+ Firefox 3.6 +
Safari 5 +
Chrome 8+
Internet Explorer 9+
Für unterstützte Browserversionen können Sie ArrayPrototype-Erweiterung an übergeben implementieren. Die Grundfunktionen jeder Methode werden im Folgenden ausführlich vorgestellt.
1, join()
join(separator ): fasst die Elemente des Arrays zu einer Zeichenfolge zusammen, wobei separator als Trennzeichen verwendet wird. Bei dieser Methode wird das Standardkomma verwendet Erhält nur einen Parameter: das Trennzeichen.
1 2 3 4 |
var arr = [1,2,3]; console.log(arr.join()); // 1,2,3 console.log(arr.join("-")); // 1-2-3 console.log(arr); // [1, 2, 3] (das ursprüngliche Array bleibt unverändert) |
Doppelte Zeichenfolgen können durch die Methode join() realisiert werden. Übergeben Sie einfach die Zeichenfolge und die Wiederholt kann die wiederholte Zeichenfolge wie folgt zurückgegeben werden:
1 2 3 4 5 |
function repeatString(str, n) { return new Array(n + 1).join(str); } console.log(repeatString("abc", 3)); // abcabcabc console.log(repeatString("Hi", 5)); // HiHiHiHiHi |
2, push() und pop()
push(): kann eine beliebige Anzahl von Parametern empfangen, sie nacheinander am Ende des Arrays hinzufügen und die geänderte Länge des Arrays zurückgeben.
pop(): Entfernen Sie das letzte Element vom Ende des Arrays, reduzieren Sie den Wert Länge des Arrays, und geben Sie dann den entfernten Artikel zurück.
1 1 2 3 4 5 6 7 var arr = ["Lily","lucy","Tom"]; var count = arr.push("Jack","Sean"); console.log(count); // 5 console.log(arr); // ["Lily", "lucy", "Tom", "Jack", "Sean"] var item = arr.pop(); console.log(item); // Sean console.log(arr); // ["Lily", "lucy", "Tom", "Jack"] 2 3 4 5 6 7 |
var arr = ["Lily","lucy","Tom"]; var count = arr.push("Jack","Sean"); console.log(count); // 5 console.log(arr); // ["Lily", "lucy", "Tom", "Jack", "Sean"] var item = arr.pop(); console.log(item); // Sean console.log(arr); // ["Lily", "lucy", "Tom", "Jack"] |
3, shift() und unshift()
shift(): Löschen Sie das erste Element des ursprünglichen Arrays und geben Sie den Wert des gelöschten Elements zurück. Wenn das Array leer ist, geben Sie undefiniert . unshift:
Parameter am Anfang des ursprünglichen Arrays hinzufügen und die Länge des Arrays zurückgeben.
Dieser Satz von Methoden und die oben genannten push() und pop() Methoden Genau entsprechend ist einer der Anfang des Operationsarrays und der andere das Ende des Operationsarrays.
1
2 3 4 5 6 7 |
var arr = ["Lily","lucy","Tom"]; var count = arr.unshift("Jack","Sean"); console.log(count); // 5 console.log(arr); //["Jack", "Sean", "Lily", "lucy", "Tom"] var item = arr.shift(); console.log(item); // Jack console.log(arr); // ["Sean", "Lily", "lucy", "Tom"] |
4, sort()
sort() : Ordnen Sie die Array-Elemente in aufsteigender Reihenfolge an ——, d. h. der kleinste Wert steht vorne und der größte Wert hinten.
Beim Sortieren ruft die Methode sort() toString() auf Konvertierungsmethode und vergleicht dann die resultierenden Zeichenfolgen, um zu bestimmen, wie sortiert werden soll. Selbst wenn jedes Element im Array ein numerischer Wert ist, vergleicht die Methode sort() Zeichenfolgen, sodass die folgende Situation auftritt:
1
2 3 4 5 |
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 Metaarray wurde geändert) |
Um das obige Problem zu lösen, kann die Methode sort() eine Vergleichsfunktion als Parameter erhalten, damit wir angeben können, welcher Wert davor steht welcher Wert. Die Vergleichsfunktion empfängt zwei Parameter und gibt eine negative Zahl zurück, wenn der erste Parameter vor dem zweiten liegen sollte. Wenn die beiden Parameter gleich sind, gibt sie 0 zurück, wenn der erste Parameter sein sollte Nach dem zweiten wird eine positive Zahl zurückgegeben. Das Folgende ist eine einfache Vergleichsfunktion:
1 1 2 3 4 5 6 7 8 9 10 11 function compare(value1, value2) { if (value1 < value2) { return -1; } else if (value1 > value2) { return 1; } else { return 0; } } arr2 = [13, 24, 51, 3]; console.log(arr2.sort(compare)); // [3, 13, 24, 51] 2 3 4 5 6 7 8 9 10 11 td> |
function compare(value1, value2) { if (value1 < value2) {<🎜><🎜> < strong>return<🎜> -1;<🎜><🎜> } <🎜>else<🎜> if<🎜> (value1 > value2) { return 1; } else { return 0; } } arr2 = [13, 24, 51, 3]; console.log(arr2.sort(compare)); // [3, 13 , 24, 51] |
如果需要通过比较函数产生降序排序的结果,只要交换比较函数返回的值即可:
1 1 2 3 4 5 6 7 8 9 10 11 function compare(value1, value2) { if (value1 < value2) { return 1; } else if (value1 > value2) { return -1; } else { return 0; } } arr2 = [13, 24, 51, 3]; console.log(arr2.sort(compare)); // [51, 24, 13, 3] 2 3 4 5 6 7 8 9 1 2 3 var arr = [13, 24, 51, 3]; console.log(arr.reverse()); //[3, 51, 24, 13] console.log(arr); //[3, 51, 24, 13](原数组改变) 10 11 |
function compare(value1, value2) { if (value1 < value2) {<🎜><🎜> <🎜>return<🎜><🎜> 1;<🎜><🎜> } <🎜><🎜>else<🎜> if<🎜><🎜> ( value1 > value2) { return -1; } else { return 0;} } arr2 = [13, 24, 51, 3]; console.log(arr2.sort(compare)); // [51, 24, 13, 3] |
Tabelle>5、reverse()reverse():反转数组项的顺序。
1 2 3 |
var arr = [13, 24, 51, 3]; Konsole. log(arr.reverse()); //[3, 51, 24, 13] console.log(arr); //[3, 51, 24, 13](原数组改变) |
6, concat()
concat() : Parameter zum ursprünglichen Array hinzufügen. Diese Methode erstellt zunächst eine Kopie des aktuellen Arrays, fügt dann die empfangenen Parameter am Ende der Kopie hinzu und gibt schließlich das neu erstellte Array zurück. Ohne Argumente an die Methode concat() zu übergeben, kopiert sie einfach das aktuelle Array und gibt die Kopie zurück.
1 1 2 3 4 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](原数组未被修改) 2 3 1 2 3 var arrCopy2 = arr.concat([9,[11,13]]); console.log(arrCopy2); //[1, 3, 5, 7, 9, Array[2]] console.log(arrCopy2[5]); //[11, 13] 4 |
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 wurde nicht geändert) |
1 2 3 |
var arrCopy2 = arr.concat ([9,[11,13]]); console.log(arrCopy2); //[1, 3, 5, 7, 9, Array[2]] console.log(arrCopy2[5]); //[ 11, 13] |
Im obigen Code ist das fünfte Element des Arrays arrCopy2 ein Array mit zwei Elementen, nämlich concat -Methode kann nur jedes Element im eingehenden Array zum Array hinzufügen. Wenn einige Elemente im eingehenden Array Arrays sind, wird dieses Array-Element auch zu arrCopy2 als ein Element hinzugefügt in.
7, slice()
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, bei denen es sich um die Start- und Endpositionen der zurückzugebenden Elemente handelt. Mit nur einem Parameter gibt die Methode slice() alle Elemente zurück, beginnend an der durch diesen Parameter angegebenen Position und endend am Ende des aktuellen Arrays. Wenn zwei Argumente angegeben werden, gibt diese Methode Elemente zwischen der Start- und Endposition - zurück, jedoch ohne die Endposition.
1
2 3 4 5 6 7 8 9 10 |
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); var arrCopy4 = arr.slice(-4,-1 ); console.log(arr); rgb( 0,130,0);">//[1, 3, 5, 7, 9, 11](Das ursprüngliche Array hat sich nicht geä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] | tr> tbody>
arrCopy legt nur einen Parameter fest, d. h. der Startindex ist 1, sodass das zurückgegebene Array der Index 1 (einschließlich des Index 1) beginnt am Ende des Arrays. arrCopy2
legt zwei Parameter fest und gibt den Startindex (einschließlich 1) an den Endindex (nicht Subarray einschließlich 4). arrCopy3
legt zwei Parameter fest. Der Abschlussindex ist eine negative Zahl. Addieren Sie die negative Zahl zum Wert der Array-Länge (6), um die Zahl an dieser Position zu ersetzen, sodass sie von 1 bis 4 beginnt ( exklusives) Array. arrCopy4
Beide Parameter in sind negative Zahlen, also addieren Sie die Array-Länge 6, um sie in eine positive Zahl umzuwandeln entspricht slice(2,5).
8, splice()
splice(): Eine sehr leistungsstarke Array-Methode. Sie hat viele Verwendungsmöglichkeiten und kann Löschen, Einfügen und Ersetzen implementieren.
Löschen: Sie können eine beliebige Anzahl von Elementen löschen. Geben Sie einfach2 Parameter an: die Position und den Inhalt des ersten Elements, das gelöscht werden soll Die Anzahl der gelöschten Elemente. Beispielsweise löscht splice(0,2) die ersten beiden Elemente im Array.
Einfügen: Sie können eine beliebige Anzahl von Elementen an der angegebenen Position einfügen. Geben Sie einfach 3 Parameter an: Startposition, 0 (die Anzahl der zu löschenden Elemente) und die einzufügenden Elemente. Beispielsweise fügt splice(2,0,4,6) 2 >4 und 6. Ersetzung: Sie können beliebig viele Elemente an der angegebenen Position einfügen und gleichzeitig beliebig viele Elemente löschen. Geben Sie einfach
3 Parameter: Startposition, Anzahl der zu löschenden Elemente und eine beliebige Anzahl einzufügender 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 der aktuellen Array-Position 2 und dann Entfernen Sie das Element aus der aktuellen Array-Position 2 beginnen Sie mit dem Einfügen von 4 und 6 . Die Methode splice() gibt immer ein Array zurück, das die aus dem ursprünglichen Array entfernten Elemente enthält, oder einen leeren Wert, wenn keine Elemente entfernt wurden.
2 3 4 5 6 7 8 9 10 |
var arr = [1,3,5,7,9,11]; var arrRemoved = arr.splice(0,2); console.log(arr); //[5, 7, 9, 11] console.log(arrRemoved); //[1, 3] var arrRemoved2 = arr.splice(2,0,4, 6); console.log(arr); // [5, 7, 4, 6, 9, 11] console.log(arrRemoved2); // [] var arrRemoved3 = arr.splice(1,1,2,4); console.log(arr); // [5, 2, 4, 4, 6, 9, 11] console.log(arrRemoved3); //[7] |
9、indexOf()和 lastIndexOf()
indexOf():接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中,从数组的开头(位置 0)开始向后查找。
lastIndexOf:接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中,从数组的末尾开始向前查找.
这两个方法都返回要查找的项在数组中的位置,或者在没找到的情况下返回- 1。在比较第一个参数与数组中的每一项时,会使用全等操作符。
1 2 3 4 5 6 |
var arr = [1,3,5,7,7,5,3,1]; console.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 console.log(arr.indexOf("5")); //-1 |
10, forEach()
forEach() : Durchlaufen Sie das Array und führen Sie die angegebene Funktion für jedes Element im Array aus. Diese Methode hat keinen Rückgabewert. Die Parameter sind alle vom Typ Funktion. Standardmäßig werden folgende Parameter übergeben: der entsprechende Array-Index und das Array selbst.
1 1 2 3 4 5 6 7 8 9 10 var arr = [1, 2, 3, 4, 5]; arr.forEach(function(x, index, a){ console.log(x + '|' + index + '|' + (a === arr)); }); // 输出为: // 1|0|true // 2|1|true // 3|2|true // 4|3|true // 5|4|true 2 3 4 5 6 7 8 9 10 |
var arr = [1, 2, 3, 4, 5]; arr.forEach( function(x, index, a){ console.log( x + '|' 1 2 3 4 5 var arr = [1, 2, 3, 4, 5]; var arr2 = arr.map(function(item){ return item*item; }); console.log(arr2); //[1, 4, 9, 16, 25] }); // Die Ausgabe ist: // 1|0|true // 2|1|true // 3|2| true // 4|3|true// 5|4|true |
1 2 3 4 5 td> |
var arr = [1, 2, 3, 4, 5]; var arr2 = arr.map(Funktion(item){ return item*item; }); console.log(arr2); //[1, 4, 9, 16, 25] |
12, filter()
filter() :"Filter"Funktion führt jedes Element im Array die angegebene Funktion aus und gibt ein Array zurück, das die Filterbedingungen erfüllt.
1 1 2 3 4 5 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; var arr2 = arr.filter(function(x, index) { return index % 3 === 0 || x >= 8; }); console.log(arr2); //[1, 4, 7, 8, 9, 10] 2 3 4 5 |
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];var arr2 = arr.filter( Funktion
return index % 3 === 0 ||. p style="text-align:left;">console.log(arr2); ;"> //[1, 4, 7, 8, 9, 10] |
1 2 3 4 5 6 7 8 9 |
var arr = [1, 2, 3, 4, 5] ; var arr2 = arr.every(function(x) { return x < 10; }); console.log(arr2); //true var arr3 = arr.every(function(x) { return x < 3; }); console.log(arr3); // false |
14、some()
some() :判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true。
1 1 2 3 4 5 6 7 8 9 var arr = [1, 2, 3, 4, 5]; var arr2 = arr.some(function(x) { return x < 3; }); console.log(arr2); //true var arr3 = arr.some(function(x) { return x < 1; }); console.log(arr3); // false 2 3 4 5 6 7 8 9 |
var arr = [1, 2, 3, 4, 5]; var arr2 = arr.some(Funktion(x) { return x < 3; }); console.log(arr2); //true var arr3 = arr.some(Funktion(x) { return x < 1; }); console.log(arr3); // false |
15, reduce() und ReduceRight()
Beide Methoden durchlaufen alle Elemente des Arrays und erstellen dann einen endgültigen Rückgabewert. Die Methode reduce() beginnt beim ersten Element des Arrays und geht nacheinander bis zum Ende. Und ReduceRight() beginnt beim letzten Element des Arrays und geht vorwärts zum ersten Element.
Beide Methoden erhalten zwei Argumente: eine Funktion, die für jedes Element aufgerufen wird, und (optional) einen Anfangswert, der als Grundlage für die Zusammenführung verwendet wird.
Die an Reduce() und ReduceRight() übergebenen Funktionen empfangen 4 Parameter: vorheriger Wert, aktueller Wert, Index des Elements und Array-Objekt. Jeder von dieser Funktion zurückgegebene Wert wird automatisch als erstes Argument an das nächste Element übergeben. Die erste Iteration erfolgt über das zweite Element des Arrays, sodass das erste Argument das erste Element des Arrays und das zweite Argument das zweite Element des Arrays ist.
Der folgende Code verwendet reduce(), um die Array-Summierung zu implementieren. Am Anfang wird dem Array ein Anfangswert hinzugefügt 10 .
1 1 2 3 4 5 var values = [1,2,3,4,5]; var sum = values.reduceRight(function(prev, cur, index, array){ return prev + cur; },10); console.log(sum); //25 2 3 4 5 td> |
var
function return },10); console.log(sum); //25 | tr>
Das obige ist der detaillierte Inhalt vonjs-Array-Methode. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!