Heim > Web-Frontend > js-Tutorial > Zusammenfassung häufig verwendeter Array-Methoden in JS

Zusammenfassung häufig verwendeter Array-Methoden in JS

php中世界最好的语言
Freigeben: 2018-03-07 14:51:05
Original
2100 Leute haben es durchsucht

Dieses Mal werde ich Ihnen eine Zusammenfassung der in JS häufig verwendeten Array-Methoden geben. Was sind die Vorsichtsmaßnahmen bei der Verwendung von Daten in JS? Hier sind praktische Fälle.

1. Die concat()-Methode wird verwendet, um zwei oder mehr Arrays zusammenzuführen. Diese Methode ändert das vorhandene Array nicht, sondern gibt ein neues Array zurück.

Beispiel:
var array1 = ['a', 'b', 'c'];

var array2 = ['d', 'e', ​​​​' f'];

console.log(array1.concat(array2));

// ["a", "b", "c", "d", " e", "f"]

2. Die filter()-Methode erstellt ein neues Array, das alle Elemente des Tests enthält, die von der bereitgestellten Funktion implementiert werden. (kann zum Filtern verwendet werden)

Beispiel:
function isBigEnough(value) {
return value >= 10;
}

var filtered = [12 , 5, 8, 130, 44].filter(isBigEnough);

// gefiltert ist [12, 130, 44]

// ES6-Weg

const isBigEnough = value => value >= 10;

let [...spread]= [12, 5, 8, 130, 44];

let filtered = spread. filter( isBigEnough);

3. Die Methode find() gibt den Wert des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird undefiniert zurückgegeben.

Beispiel:
function isBigEnough(element) {
return element >= 15;
}

[12, 5, 8, 130, 44 ].find(isBigEnough); // 130

4. Die Methode findIndex() gibt den Index des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird -1 zurückgegeben.

function isBigEnough(element) {
return element >= 15;
}

[12, 5, 8, 130, 44].findIndex(isBigEnough );
// Index des 4. Elements im Array wird zurückgegeben,
// dies ergibt also „3“

5 Die Methode forEach() gibt das Element zurück, das ausgeführt wird die bereitgestellte Funktion einmal. (Entspricht der for-Schleife in JavaScript)

Beispiel:

const arr = ['a', 'b', 'c'];

arr.forEach(function(element) {
console.log(element);
});

arr.forEach( element => console.log(element));

// a
// b
// c

6 Die Ergebnisse der indexOf()-Methode finden Sie in Das Array Der erste Index eines bestimmten Elements oder -1, wenn es nicht existiert.

Beispiel:
let a = [2, 9, 7, 8, 9];
a.indexOf(2); // 0
a.indexOf(6 ); // -1
a.indexOf(7); // 2
a.indexOf(8); // 3
a.indexOf(9); >if (a.indexOf(3) === -1) {

// Element existiert nicht im Array

}

7 Die Methode „map()“ erstellt ein new Ein Array, dessen Ergebnis das Ergebnis des Aufrufs einer bereitgestellten Funktion für jedes Element im Array ist.

Beispiel:

// ES6

let Zahlen = [1, 5, 10, 15];
let Doubles = Zahlen.map( x => x ** 2);

// verdoppelt ist jetzt [1, 25, 100, 225]

// Zahlen ist immer noch [1, 5, 10, 15]


const zahlen = [ 2, 4, 8, 10];

lassen Sie Hälften = Zahlen.map(x => x / 2);


lassen Sie Zahlen = [1, 4, 9];

lassen Sie Wurzeln = zahlen.map(Math.sqrt);

// Wurzeln sind jetzt [1, 2, 3]
// Zahlen sind immer noch [1, 4, 9]

8 Die Methode pop() entfernt das letzte Element aus dem Array und gibt den Wert des Elements zurück. Diese Methode ändert die Länge des Arrays.

Beispiel:

let a = [1, 2, 3];

a.length; // 3

a.pop();

console.log(a); // [1, 2]

a.length; // 2


9 Die Methode „reduce()“ gilt für Akkumulatoren und Arrays Wenden Sie auf jedes Element in (von links nach rechts) eine Funktion an und reduzieren Sie es auf einen einzelnen Wert.

Beispiel:

const array1 = [1, 2, 3, 4];

const Reducer = (Akkumulator,

aktueller
Wert) => ;akkumulator +currentValue;// 1 + 2 + 3 + 4console.log(array1.reduce(reducer));

// erwartete Ausgabe: 10

// 5 + 1 + 2 + 3 + 4


console.log(array1.reduce(reducer, 5));

// erwartete Ausgabe: 15

// gefiltert ist [12, 130, 44 ]

10. Array.isArray() wird verwendet, um zu bestimmen, ob der übergebene Wert ein Array ist

Beispiel:

Array.isArray([ 1 , 2, 3]);

// true

Array.isArray({foo: 123});
// false
Array.isArray("foobar"); / false
Array.isArray(undefiniert);
// false


11 Die Methode Array.from() erstellt ein neues Array-Beispiel aus einem Array-ähnlichen oder iterierbaren Objekt.

Beispiel: const bar = ["a", "b", "c"];

Array.from(bar);

// ["a" , "b", "c"]

Array.from('foo');
// ["f", "o", "o"]


12. Die Methode fill() füllt alle Elemente in einem Array vom Startindex bis zum Endindex mit einem festen Wert.

Beispiel: var array1 = [1, 2, 3, 4];

// mit 0 füllen von Position 2 bis Position 4
console.log(array1.fill(0, 2, 4));
// erwartete Ausgabe: [1, 2, 0, 0]

// mit 5 von Position 1 füllen
console.log(array1.fill(5, 1));
// erwartete Ausgabe: [1, 5, 5, 5]

console.log(array1.fill(6));
// erwartete Ausgabe: [6, 6, 6, 6]

Syntax:
arr.fill(value[, start[, end]])
Das heißt (gefüllter Wert, Startwert (Index), Endwert (beginnend bei 1))

13. )-Methode wird verwendet, um zu bestimmen, ob ein Array einen bestimmten Wert enthält. Je nach Situation gibt sie „true“ zurück, wenn sie einen Wert enthält, andernfalls gibt sie „false“ zurück.

Beispiel:
let a = [1, 2, 3];

a.includes(2);
// true

a.includes(4);
// false

14. Die Methode join() verkettet alle Elemente eines Arrays (oder eines arrayähnlichen Objekts) zu einem String und geben Sie diese Zeichenfolge zurück.

Beispiel:
let a = ['Wind', 'Rain', 'Fire'];

console.log(a.join()); >// Standard ist ","
// 'Wind,Rain,Fire'

console.log(a.join("")); ""

// "WindRainFire"

console.log(a.join("-"));

// Trennzeichen "-"

// 'Wind- Rain-Fire '

15. Die push()-Methode fügt ein oder mehrere Elemente am Ende des Arrays hinzu und gibt die Länge des neuen Arrays zurück.

Beispiel:

var number = [1, 2, 3];

numbers.push(4);

console.log(numbers); >// [1, 2, 3, 4]

numbers.push(5, 6, 7);

console.log(numbers)// [1, 2, 3, 4, 5, 6, 7]

16. Die Methode ReduceRight() akzeptiert eine Funktion als Akkumulator (Akkumulator) und jeden Wert des Arrays (von rechts nach links). Auf einen einzigen Wert reduzieren. Entgegen der Ausführungsrichtung von Array.prototype.reduce()

Beispiel: let flattened = [[0, 1],

[2, 3],

[4, 5]
].reduceRight((a, b) => {
return a.concat(b);
}, []);

/ / flattened ist [4, 5, 2, 3, 0, 1]

17. Die Methode „shift()“ löscht das erste Element aus dem Array und gibt den Wert des Elements zurück. Diese Methode ändert die Länge des Arrays.

Beispiel: let a = [1, 2, 3];let b = a.shift();

console.log(a);
// [2, 3]

console.log(b);

// 1

18. Die Slice()-Methode gibt eine Sequenz vom Anfang zurück to end Shallow kopiert einen Teil des ausgewählten Arrays (ohne das Ende) in ein neues Array-Objekt. Das ursprüngliche Array wird nicht geändert.

Beispiel: var Animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals .slice(2));

// erwartete Ausgabe: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));

// erwartete Ausgabe: Array ["camel", "duck"]

console.log(animals.slice(1, 5));

// erwartete Ausgabe: Array ["bison" , „Kamel“, „Ente“, „Elefant“]

19. Die Methode some() testet, ob einige Elemente im Array den von der bereitgestellten Funktion implementierten Test bestehen.

Beispiel: const isBiggerThan10 = (element, index, array) => 5, 8, 1, 4].some(isBiggerThan10); // false

[12, 5, 8, 1, 4].some(isBiggerThan10);
// true

20. Die Methode sort() verwendet einen In-Place-Algorithmus, um die Elemente des Arrays zu sortieren und das Array zurückzugeben. sort Sortieren ist nicht unbedingt stabil. Die Standardsortierreihenfolge basiert auf String-Unicode-Codepunkten.


Beispiel:

var Fruit = ['Kirschen', 'Äpfel', 'Bananen'];
fruit.sort();

// ['Äpfel', 'bananas', 'cherries']

21. Die splice()-Methode ändert den Inhalt eines Arrays, indem sie vorhandene Elemente entfernt und/oder neue Elemente hinzufügt.


Beispiel:
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];

myFish.splice(2, 0, ' drum'); // 'drum' an Index 2 einfügen

// myFish wird zu ["angel", "clown", "drum", "mandarin", "sturgeon"]myFish.splice (2, 1); // Ein Element aus Index 2 löschen (d. h. das Element „Trommel“)

// myFish wird zu [„Angel“, „Clown“, „Mandarin“, „Sturgeon“]


Syntax:

array.splice(start)


array.splice(start, deleteCount)

array.splice(start, deleteCount , item1, item2, .. .)

Parameter:
Start
Gibt die Startposition der Änderung an (ab 0 gezählt). Wenn die Länge des Arrays überschritten wird, wird der Inhalt ab dem Ende des Arrays hinzugefügt. Wenn es sich um einen negativen Wert handelt, wird die Zahl ab dem Ende des Arrays angegeben (wenn nur der Startparameter verwendet wird). Ohne deleteCount bedeutet ein Element wie :array.splice(start), dass die Elemente von [start, end] gelöscht werden.
deleteCount optional
Ganzzahl, die die Anzahl der zu entfernenden Array-Elemente angibt. Wenn deleteCount 0 ist, werden keine Elemente entfernt. In diesem Fall sollte mindestens ein neues Element hinzugefügt werden. Wenn deleteCount größer als die Gesamtzahl der Elemente nach Start ist, werden alle Elemente nach Start gelöscht (einschließlich der Startposition).
Wenn deleteCount weggelassen wird, entspricht es (arr.length - start).
item1, item2, ... Optional
Die Elemente, die dem Array hinzugefügt werden sollen, beginnend mit der Startposition. Wenn nicht angegeben, entfernt splice() nur Array-Elemente.
Die Spleißmethode verwendet den Parameter deleteCount, um zu steuern, ob gelöscht oder hinzugefügt werden soll:
Der Startparameter ist erforderlich und gibt die Startposition an (gezählt von 0), z. B.: start=0 beginnt mit dem ersten Start> ;= Array. Länge-1 bedeutet, dass mit dem letzten begonnen wird.
①. Löschen Sie die Elemente [Start, Ende] von der Startposition.
array.splice(start)
② Löschen Sie die Elemente [start, Count] beginnend mit der Startposition.
array.splice(start, deleteCount)
③ Elemente item1, item2, ... beginnend an der Startposition hinzufügen.
array.splice(start, 0, item1, item2, ...)

22. toString() gibt einen String zurück, der das angegebene Array und seine Elemente darstellt.

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

Beispiel:

let a = [1, 2, 3];
a.unshift(4, 5);

console.log( a);
//[4, 5, 1, 2, 3]


24 Die Methode substring() wird verwendet, um den Index zwischen zwei angegebenen Indizes zu extrahieren Zeichenkette dazwischen.
Beispiel:
var str="Hello world!";
document.write(str.substring(3)+"
");// Lo World!
document.write(str.substring(3,7));//lo w

Syntax:
string.substring(from, to)

Parameter
von
Erforderlich. Eine nichtnegative Ganzzahl, die die Position des ersten Zeichens der zu extrahierenden Teilzeichenfolge im Zeichenfolgenobjekt angibt.
bis
Optional. Eine nicht negative Ganzzahl, die eine Position weiter im String-Objekt liegt als das letzte Zeichen des zu extrahierenden Teilstrings.
Wenn dieser Parameter weggelassen wird, wird der zurückgegebene Teilstring an das Ende des Strings gesetzt.

25. Die substr()-Methode kann die angegebene Anzahl von Zeichen beginnend mit dem Startindex in der Zeichenfolge extrahieren.
Beispiel
var str="Hallo Welt!"
document.write(str.substr(3));//lo world!
document.write(str.substr(3 ) ,7));p//lo worl
Syntax:
stringObject.substr(start,length)

Parameter:
start
Erforderlich. Der Startindex der zu extrahierenden Teilzeichenfolge. Muss ein numerischer Wert sein. Wenn dieser Parameter negativ ist, deklariert er die Position ab dem Ende der Zeichenfolge. Das heißt, -1 bezieht sich auf das letzte Zeichen in der Zeichenfolge, -2 bezieht sich auf das vorletzte Zeichen und so weiter.
Länge
optional. Die Anzahl der Zeichen in der Teilzeichenfolge. Muss ein numerischer Wert sein. Wenn dieser Parameter weggelassen wird, wird die Zeichenfolge vom Anfang bis zum Ende von stringObject zurückgegeben.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Verwandte Lektüre:

So stellen Sie die Größe des Logos in der Android-App ein

Wie lauten die benutzerdefinierten Anweisungen? Vue.JS So verwenden Sie PEGjs mit

Node.js

Das obige ist der detaillierte Inhalt vonZusammenfassung häufig verwendeter Array-Methoden in JS. 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