Häufig verwendete Javascript-Array-Methoden.

In diesem Beitrag lernen wir häufig verwendete Javascript-Array-Methoden kennen, die Iteration und Rückruffunktionen verwenden, um ihre Funktionalität zu erreichen.

Iteration bezieht sich auf die wiederholte Ausführung einer Reihe von Anweisungen oder Codeblöcken, die es uns ermöglicht, denselben Vorgang mehrmals auszuführen.

Einfach ausgedrückt ist ein Callback eine Funktionsdefinition, die als Argument an eine andere Funktion übergeben wird.

Der Einfachheit halber konzentrieren wir uns auf diese drei Punkte.

1. Wenn eine bestimmte Array-Methode verwendet werden soll.
2. Was die Array-Methode zurückgibt.
3. Codebeispiel der Array-Methode. **

Bevor wir fortfahren, wollen wir verstehen, wie diese Array-Methoden strukturiert sind.

// Array-Methode (Rückruf (die Bedingung, die wir für jedes Element in unserem Array ausführen möchten))

Jede dieser Array-Methoden ist eine Funktion, die einen Rückruf als Argument empfängt. In diesem Rückruf geben wir die Bedingungen an, die wir für jedes unserer Array-Elemente ausführen möchten.

Wir werden dieses Array von Objekten für unsere Beispiele verwenden.

`const data = [
{
„userId“: 1,
„Benutzername“: „Francis“,
„message“: „Hey, wie geht’s?“,
„timestamp“: „2024-02-18T12:30:00Z“,
„status“: „online“,
„messageSent“: 28,
„role“: „user“,
„passCode“: „293087O7764“

},
{
„userId“: 2,
„Benutzername“: „Moses“,
„message“: „Nicht schlecht, ich arbeite nur an einem Projekt.“,
„timestamp“: „2024-02-18T12:35:00Z“,
„status“: „abwesend“,
„messageSent“: 74,
„role“: „user“,
„passCode“: „675147O2234“
},
{
„userId“: 3,
„Benutzername“: „Vicky“,
„message“: „Hey Leute! Was ist der neueste Klatsch?“,
„timestamp“: „2024-02-18T12:40:00Z“,
„status“: „online“,
„messageSent“: 271,
„role“: „Moderator“,
„passCode“: „76352O8069“

},
{
„userId“: 4,
„Benutzername“: „Junior“,
„message“: „Nicht viel, nur chillen. Wie wäre es mit dir?“,
„timestamp“: „2024-02-18T12:45:00Z“,
„status“: „offline“,
„messageSent“: 125,
„role“: „admin“,
„passCode“: „21876O3483“
}
]`

forEach: forEach wird verwendet, wenn wir eine Bedingung für alle unsere Array-Elemente ausführen möchten. forEach gibt undefiniert zurück.

Funktion getMessageSent(users){
sei sumMessageSent = 0;
users.forEach(function(user){
sumMessageSent += user.messageSent;
})
return sumMessageSent;
}
getMessageSent(data) // Ausgabe: 498

Reduzieren: Reduzieren wird verwendet, um ein Array auf einen einzelnen Wert zu reduzieren. Beispielsweise kann dieses Array [8, 7, 3] auf die Zahl 18 reduziert werden. Ein Reduzierer gibt einen einzelnen Wert zurück.

Die Reduzierfunktion übernimmt zwei Parameter: erstens den Reduzierer (der sich aus der Summe und dem Strom zusammensetzt) ​​und zweitens den Anfangswert

Die Summe: Dies wird im Volksmund als Akkumulator bezeichnet. Die Summe, wie ich sie nenne, ist der zuletzt berechnete Wert der Reduzierfunktion.

Der Strom bezieht sich auf ein einzelnes Array-Element. in unserem Fall haben wir vier Artikel (aktuell).

Der Anfangswert ist der Wert, den wir der Gesamtsumme beim ersten Aufruf zuweisen. Sagen Sie einfach, dass der Anfangswert der Standardwert des Gesamtwerts ist

const getMessageSent = (Benutzer) => {
returnusers.reduce((total, current) => total += current.messageSent, 0)
}

getMessageSent(data) // Ausgabe: 498

filter: Array.filter wird verwendet, wenn wir nur Elemente im Array sammeln möchten, die eine bestimmte Bedingung erfüllen. array.filter gibt ein Array zurück.

const onlineUsers = (users) => {
returnusers.filter(user => user.status === "online")
}

onlineUsers(data) // Ausgabe: [Objektobjekt]

find Array.find wird verwendet, wenn wir nur das erste Array-Element abrufen möchten, das die im Rückruf definierte Bedingung erfüllt. array.find gibt das erste Element NICHT in einem Array, sondern im Format des Elements zurück. In unserem Fall ist es ein Objekt oder undefiniert, wenn keine Übereinstimmung gefunden wurde.

const getUserRole = (Benutzer) => {
Geben Sie „users.find(user => user.role === „user“)
“ zurück }

getUserRole(data) // Ausgabe: {userId: 1, Benutzername: 'Francis', Nachricht: "Hey, wie geht's?", Zeitstempel: '2024-02-18T12:30:00Z', Status: ' online‘, …}

Beachten Sie, dass nur der erste Benutzer zurückgegeben wurde, der die Bedingung erfüllt.

map Array.map wird verwendet, wenn wir die Elemente im Array transformieren möchten. array.map gibt ein Array transformierter Elemente zurück, die die Bedingung in unserem Rückruf erfüllen.

const getUserNameAndPass = (Benutzer) => {
returnusers.map((user) => {
const userPassCode = user.passCode.slice(-4);
return${user.username} ${userPassCode.padStart(
user.passCode.length,
„★“
)};
});
};

getUserNameAndPass(data)// Ausgabe:['Francis ★★★★★★★7764', 'Moses ★★★★★★★2234', 'Vicky ★★★★★★8069', 'Junior ★ ★★★★★3483']

every array.every wird verwendet, wenn wir prüfen möchten, ob alle Array-Elemente unsere definierte Bedingung erfüllt haben. array.every gibt einen booleschen Wert zurück. true, wenn alle Elemente die Bedingung erfüllen, und false, wenn eines der Elemente die Bedingung nicht erfüllt.

const isOnline = data.every(user => dataItem.status === 'online')

console.log(isOnline) // Ausgabe:false

Some array.some wird verwendet, wenn wir überprüfen möchten, ob einige der Array-Elemente eine bestimmte Bedingung erfüllen. array.some gibt einen booleschen Wert zurück. „true“, wenn einige der Elemente die Bedingung bestanden haben, und „false“, wenn alle Elemente die Bedingung bestanden haben oder nicht bestanden haben.

const isOnline = data.every(user => dataItem.status === 'online')

console.log(isOnline) // Ausgabe: true

Dies sind einige der am häufigsten verwendeten Array-Methoden.

Das obige ist der detaillierte Inhalt vonHäufig verwendete Javascript-Array-Methoden.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!