Zusammenfassung praktischer Methoden für JS-Anfänger zur Verarbeitung von Arrays

Methode join(): verbindet alle Elemente eines Arrays unter Verwendung eines angegebenen Trennzeichens zu einem String

Beispiel:

myArr.join('-') // Verketten mit dem Symbol '-'

concat()-Methode: Zwei oder mehr Arrays zu einem Array zusammenführen

Beispiel:

meinArr.concat(arr1, arr2, ..., arrN)

Hinweis: Diese Methode ändert das vorhandene Array nicht. Es kann daher mit einem leeren Array zusammengeführt werden, um das alte Array zu kopieren, ohne die alten Array-Daten beim Bearbeiten der neuen Array-Daten zu verunreinigen.

sort()-Methode: wird verwendet, um die Elemente eines Arrays zu sortieren

Wird diese Methode ohne Parameter aufgerufen, werden die Elemente des Arrays alphabetisch sortiert, genauer gesagt in der Reihenfolge ihrer Zeichencodes. Dazu müssen die Array-Elemente zunächst (sofern notwendig) in Strings umgewandelt werden, um diese vergleichen zu können.

Beispiel:

myArr.sort() // Alphabetisch sortierenmyArr.sort(function(a, b) {
	Rückgabewert a - b
}) // In aufsteigender Reihenfolge, absteigende Reihenfolge ist b - a
// Pfeilfunktion schreibt myArr.sort((a, b) => a - b)

reverse()-Methode: Wird verwendet, um die Reihenfolge der Elemente in einem Array umzukehren

Beispiel:

meinArr.reverse()

push() / unshift() Methode: Fügt ein oder mehrere Elemente am Ende/Anfang eines Arrays hinzu und gibt die neue Länge zurück

Beispiel:

meinArr.push(Artikel1, Artikel2, ..., ArtikelN)
meinArr.unshift(Artikel1, Artikel2, ..., ArtikelN)

shift()-Methode: löscht das erste Element eines Arrays und gibt den Wert des ersten Elements zurück

Beispiel:

meineArr.shift()

pop()-Methode: Löscht ein Element eines Arrays (standardmäßig das letzte Element) und gibt den Wert des Elements zurück.

Beispiel:

myArr.pop() // lösche das letzte Element des Arrays myArr.pop(1) // lösche das Element mit dem Index 1 im Array

splice()-Methode: Elemente zu einem Array hinzufügen/aus einem Array entfernen und die entfernten Elemente zurückgeben

myArr.splice(Index, Anzahl, Element1, Element2, ..., ElementN)
// Index erforderlich. Ganzzahl, die die Position zum Hinzufügen/Entfernen von Elementen angibt. Verwenden Sie negative Zahlen, um die Position vom Ende des Arrays anzugeben. // Anzahl erforderlich. Die Anzahl der zu löschenden Elemente. Wenn auf 0 gesetzt, werden Elemente nicht entfernt // Element1, Element2, ..., ElementN Optional. Hinzufügen neuer Elemente zum Array

forEach()-Methode: Mit dieser Methode wird jedes Element des Arrays aufgerufen und an die Callback-Funktion übergeben (entspricht der for-Schleife).

Beispiel:

myArr.forEach(Funktion (Element, Index, arr) {
 wenn (Index === 3) {
 Artikel = 123
 } 
}) // Durchlaufe das Array und ändere den Wert des Elements am Index 3 auf 123
// Pfeilfunktion schreibt myArr.forEach((v, i, arr) => if (i === 3) { v = 123 })

Hinweis: Die folgenden Methoden erkennen keine leeren Arrays und ändern das ursprüngliche Array nicht.

Methode indexOf(): Ermittelt, ob ein Element in einem Array vorhanden ist und gibt den Index zurück, andernfalls wird -1 zurückgegeben.

Beispiel:

meinArr.indexOf(Artikel)

Hinweis: Bei der Methode indexOf() muss die Groß-/Kleinschreibung beachtet werden!

slice()-Methode: extrahiert einen Teil einer Zeichenfolge und gibt den extrahierten Teil als neue Zeichenfolge zurück (kopiert oberflächlich die Elemente des Arrays)

Beispiel:

const newArr = meinArr.slice(0, 1)
// Extrahiere die Elemente des Arrays myArr vom Index 0 bis 1 // Parameter:
// begin (optional): Indexwert, akzeptiert negative Werte, beginnt mit dem Extrahieren von Elementen aus dem ursprünglichen Array ab diesem Index, der Standardwert ist 0.
// Ende (optional): Indexwert (nicht enthalten), negative Werte werden akzeptiert und die Extraktion der ursprünglichen Array-Elemente endet vor diesem Index. Der Standardwert ist das Ende des Arrays (einschließlich des letzten Elements).

every()-Methode: Wird verwendet, um zu erkennen, ob die Elemente im Array die angegebenen Bedingungen (von der Funktion bereitgestellt) erfüllen (z. B. ob ein bestimmter Wert wahr ist).

Wenn ein Element die Bedingung nicht erfüllt, gibt der gesamte Ausdruck „false“ zurück und beendet den Test. Wenn alle Elemente die Bedingung erfüllen, wird „true“ zurückgegeben.

Beispiel:

const state = meinArr.every(Funktion (Element, Index, arr) {
 Retoure Artikel > 10
}) //Überprüfen Sie, ob alle Elemente des Arrays myArr größer als 10 sind und geben Sie einen Booleschen Wert status zurück.
// Pfeilfunktion schreibt const state = myArr.every((v, i, arr) => v > 10)

some()-Methode: Wird verwendet, um zu ermitteln, ob die Elemente im Array die angegebenen Bedingungen (von der Funktion bereitgestellt) erfüllen (z. B. ob ein bestimmter Wert wahr ist).

Wenn es ein Element gibt, das die Bedingung erfüllt, gibt der gesamte Ausdruck „true“ zurück und beendet die Erkennung. Wenn es kein Element gibt, das die Bedingung erfüllt, gibt er „false“ zurück.

Beispiel:

const state = meinArr.some(function (item, index, arr) {
 Retoure Artikel > 10
}) //Überprüfen Sie, ob das Array myArr Elemente größer als 10 enthält und geben Sie einen Booleschen Wert state zurück.
// Pfeilfunktion const state = myArr.some((v, i, arr) => v > 10)

Methode „includes()“: Wird verwendet, um zu bestimmen, ob das Array den angegebenen Wert enthält. Wenn ein passender Wert gefunden wird, wird „true“ zurückgegeben, andernfalls „false“.

Hinweis: Bei der Methode „includes()“ wird zwischen Groß- und Kleinschreibung unterschieden.

Parameter:
Suchwert: Erforderlich, der zu suchende Wert

start: optional, legen Sie die Position fest, ab der die Suche beginnen soll, Standard ist 0

Beispiel:

const state = myArr.includes(3) // Prüfe, ob Element 3 im Array myArr existiert und gib einen Booleschen Wert state zurück
const state = myArr.includes(3, 3) // Prüfe, ob Element 3 im Array myArr ab Index 3 vorhanden ist und gib einen Booleschen Wert state zurück

filter()-Methode: Erstellt ein neues Array. Die Elemente im neuen Array werden erhalten, indem alle Elemente überprüft werden, die die Bedingungen im angegebenen Array erfüllen.

Beispiel:

const newArr = meinArr.filter(function (item, index, arr) {
 Retoure Artikel > 10
}) //Überprüfe, ob alle Elemente im Array myArr größer als 10 sind und gib ein neues Array newArr zurück
// Pfeilfunktion schreibt const newArr = myArr.filter((v, i, arr) => v > 10)

map()-Methode: Gibt nach dem Aufruf der Funktion ein neues Array zurück, in dem die Elemente die Werte der ursprünglichen Array-Elemente sind

Die map()-Methode verarbeitet die Elemente im ursprünglichen Array der Reihe nach.

Beispiel:

const newArr = meinArr.map(function (item, index, arr) {
 Retourenartikel * 10
}) // Multipliziere alle Elemente im Array myArr mit 10 und gib ein neues Array newArr zurück
// Pfeilfunktion schreibt const newArr = myArr.map((v, i, arr) => v * 10)

Beispiel (Typ für verschachtelte Array-Objekte):

const newArr = meinArr.map(function (item, index, arr) {
 zurückkehren {
 ID: Artikel-ID,
 neuesElement: '123'
 }
}) // Verarbeite die Elemente oder neuen Elemente im angegebenen Objektelement im Array myArr und gib ein neues Array newArr zurück
// Pfeilfunktion schreibt const newArr = myArr.map((v, i, arr) => {
 zurückkehren {
 Ich würde: v.id,
 neuesElement: '123'
 }
})

find() / findIndex()-Methode: Gibt den Wert/Index des ersten Elements des Arrays zurück, das den Test besteht (Beurteilung innerhalb der Funktion). Wenn kein Element die Bedingungen erfüllt, geben Sie „undefined / -1“ zurück.

Beispiel:

const val = meinArr.find(function (item, index, arr) {
 Retoure Artikel > 10
}) // Gibt den Wert val des ersten Elements im Array myArr zurück, der größer als 10 ist, oder undefined, wenn kein Element vorhanden ist

const val = meinArr.findIndex(function (item, index, arr) {
 Retoure Artikel > 10
}) // Gibt den Index des ersten Elements im Array myArr zurück, das größer als 10 ist, oder -1, wenn es keines gibt

Methode „reduce()“: Gibt nach dem Aufruf der Funktion ein neues Array zurück, in dem die Elemente die Werte der ursprünglichen Array-Elemente sind

Diese Methode erhält zwei Parameter: die auszuführende Funktion und den an die Funktion übergebenen Anfangswert.

Auszuführende Funktion (total, currentValue, currentValue, arr):

total: erforderlich, Anfangswert oder Rückgabewert nach der Berechnung

currentValue: erforderlich, aktuelles Element;

currentValue: optional, aktueller Elementindex;

arr: optional, das Array-Objekt, zu dem das aktuelle Element gehört

Beispiel 1:

const meinArr = [1, 2, 3]
const sum = meinArr.reduce(Funktion(pre, cur, index, arr) {
 console.log(vorher, aktuell)
 return pre + aktuell
})
console.log(Summe)
// Die Ausgabewerte sind // 1, 2
// 3, 3
// 6

Beispiel 2 (Festlegen des anfänglichen Iterationswerts):

const meinArr = [1, 2, 3]
const sum = meinArr.reduce(Funktion(pre, cur, index, arr) {
 console.log(vorher, aktuell)
 Zurück Vorherige + Aktuelle
}, 2)
console.log(Summe)
// Die Ausgabewerte sind // 2, 1
// 3, 2
// 5, 3
// 8

Anwendung:

1. Summen und Produkte finden

const myArr = [1, 2, 3, 4]
const result1 = meinArr.reduce(Funktion(vor, aktuell) {
 return pre + aktuell
})
const result2 = meinArr.reduce(Funktion(vor, aktuell) {
 Rückgabewert vor * aktuell
})
console.log(Ergebnis1) // 6
console.log(Ergebnis2) // 24

2. Zählen Sie, wie oft jedes Element im Array vorkommt

const myArr = ['liang','qi','qi','liang','ge','liang'] 
const arrResult = meinArr.reduce((pre,cur) => {
 wenn (aktuell in vor) {
  vor[aktuell]++
 }anders{
  vor[aktuell] = 1
 }
 Rückkehr vor
},{})
console.log(arrResult) // Ergebnis: {liang: 3, qi: 2, ge: 1}

3. Summieren Sie die Eigenschaften eines Objekts

const meinArr = [
 {
  Name: 'liangqi',
  Höhe: 55
 },{
  Name: 'mingming',
  Höhe: 66
 },{
  Name: 'lele',
  Höhe: 77
 }
]
const Ergebnis = myArr.reduce((a,b) => {
 a = a + b.Gewicht
 zurückgeben
},0)
console.log(Ergebnis) // Ergebnis: 198

Array.of () -Methode: Wird verwendet, um einen Satz von Werten in ein neues Array zu konvertieren

Beispiel:

Array.von() // []
Array.of(undefiniert) // [undefiniert]
Array.von(1) // [1]
Array.von(1, 2) // [1, 2]

flat()-Methode: Die Array-Flattening-Methode wird auch Array-Flattening, Array-Flattening und Array-Dimensionsreduzierung genannt. Sie wird verwendet, um verschachtelte Arrays in eindimensionale Arrays umzuwandeln und ein neues Array zurückzugeben

Beispiel:

const myArr = [1, [2, 3, [4, 5, [12, 3, "zs"], 7, [8, 9, [10, 11, [1, 2, [3, 4]]]]]]]
console.log(myArr.flat(Infinity)) // [1, 2, 3, 4, 5, 12, 3, "zs", 7, 8, 9, 10, 11, 1, 2, 3, 4]

Zusammenfassen

Dies ist das Ende dieses Artikels über Array-Verarbeitung für JS-Anfänger. Weitere relevante Inhalte zur JS-Array-Verarbeitung finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!