


Beherrschen von Array-Funktionen in JavaScript: Slice, Splice und forEach
Array-Funktionen in JavaScript: Slice, Splice und forEach
JavaScript-Arrays verfügen über eine Reihe integrierter Methoden, die Ihnen bei der Bearbeitung und Interaktion mit Array-Elementen helfen. Drei häufig verwendete Array-Methoden sind slice, splice und forEach. Diese Methoden können Ihre Fähigkeit, sauber und effizient mit Arrays zu arbeiten, erheblich verbessern.
1. slice()-Methode
Die Methode „slice()“ wird verwendet, um einen Teil eines Arrays zu extrahieren, ohne das ursprüngliche Array zu ändern. Es erstellt eine flache Kopie eines Teils des Arrays und gibt ein neues Array zurück.
Syntax:
array.slice(start, end);
- Start: Der Index, bei dem mit der Extraktion begonnen werden soll. Das Element an diesem Index ist enthalten.
- Ende: Der Index, an dem die Extraktion beendet werden soll (nicht enthalten). Wenn es weggelassen wird, wird bis zum Ende des Arrays geschnitten.
Beispiele:
const arr = [1, 2, 3, 4, 5]; // Slice from index 1 to index 3 (excluding index 3) const newArr = arr.slice(1, 3); console.log(newArr); // Output: [2, 3]
- In diesem Beispiel gibt arr.slice(1, 3) ein neues Array zurück, das bei Index 1 beginnt und kurz vor Index 3 endet.
Wenn das Endargument weggelassen wird, kopiert Slice() alles vom Startindex bis zum Ende des Arrays:
const arr = [1, 2, 3, 4, 5]; // Slice from index 2 to the end const newArr = arr.slice(2); console.log(newArr); // Output: [3, 4, 5]
Negative Indizes:
Sie können auch negative Indizes verwenden, um vom Ende des Arrays abzuschneiden:
const arr = [1, 2, 3, 4, 5]; // Slice from index -3 to the end const newArr = arr.slice(-3); console.log(newArr); // Output: [3, 4, 5]
2. splice()-Methode
Die splice()-Methode wird verwendet, um ein Array durch Hinzufügen oder Entfernen von Elementen zu ändern. Es ändert das ursprüngliche Array und kann zum Einfügen oder Entfernen von Elementen an einem bestimmten Index verwendet werden.
Syntax:
array.splice(start, deleteCount, item1, item2, ..., itemN);
- Start: Der Index, an dem mit der Änderung des Arrays begonnen werden soll.
- deleteCount: Die Anzahl der Elemente, die ab dem Startindex entfernt werden sollen.
- item1, item2, ..., itemN: Elemente, die dem Array beginnend mit dem Startindex hinzugefügt werden sollen.
Beispiele:
const arr = [1, 2, 3, 4, 5]; // Remove 2 elements from index 2 const removedElements = arr.splice(2, 2); console.log(arr); // Output: [1, 2, 5] console.log(removedElements); // Output: [3, 4]
- In diesem Beispiel entfernt arr.splice(2, 2) 2 Elemente beginnend bei Index 2 (3 und 4).
Sie können splice() auch verwenden, um Elemente hinzuzufügen zum Array:
const arr = [1, 2, 3, 4, 5]; // Insert 6 and 7 at index 2 arr.splice(2, 0, 6, 7); console.log(arr); // Output: [1, 2, 6, 7, 3, 4, 5]
- Hier fügt arr.splice(2, 0, 6, 7) 6 und 7 an Index 2 ein, ohne irgendwelche Elemente zu entfernen (deleteCount ist 0).
Zusammen entfernen und hinzufügen:
Sie können splice() auch verwenden, um Elemente zu entfernen und hinzuzufügen in einem Vorgang:
array.slice(start, end);
3. forEach()-Methode
Die Methode forEach() wird verwendet, um über die Elemente eines Arrays zu iterieren und auf jedes Element eine Funktion anzuwenden. Im Gegensatz zu map() oder filter() gibt forEach() kein neues Array zurück; Es führt einfach die angegebene Funktion für jedes Element aus.
Syntax:
const arr = [1, 2, 3, 4, 5]; // Slice from index 1 to index 3 (excluding index 3) const newArr = arr.slice(1, 3); console.log(newArr); // Output: [2, 3]
-
Rückruf: Die Funktion, die für jedes Element ausgeführt werden soll.
- currentValue: Das aktuelle Element, das im Array verarbeitet wird.
- Index: Der Index des aktuellen Elements.
- Array: Das Array, für das forEach aufgerufen wird.
Beispiel:
const arr = [1, 2, 3, 4, 5]; // Slice from index 2 to the end const newArr = arr.slice(2); console.log(newArr); // Output: [3, 4, 5]
Pfeilfunktionen verwenden:
Sie können auch eine Pfeilfunktion verwenden, um den Code prägnanter zu gestalten:
const arr = [1, 2, 3, 4, 5]; // Slice from index -3 to the end const newArr = arr.slice(-3); console.log(newArr); // Output: [3, 4, 5]
Array-Elemente ändern:
Beachten Sie, dass forEach() zum Ausführen von Nebeneffekten (z. B. Protokollieren oder Aktualisieren von Werten) und nicht zum Zurückgeben oder Ändern des Arrays verwendet wird. Wenn Sie ein neues Array basierend auf dem vorhandenen benötigen, sollten Sie die Verwendung von map() in Betracht ziehen.
array.splice(start, deleteCount, item1, item2, ..., itemN);
Vergleich von Slice, Splice und forEach
Method | Purpose | Mutates Original Array | Returns Value |
---|---|---|---|
slice | Extracts a portion of an array without modifying it | No | A new array (shallow copy) |
splice | Adds/removes elements at specific positions in array | Yes | The removed elements (array) |
forEach | Executes a function on each array element | No | undefined |
Abschluss
- slice() eignet sich perfekt zum Extrahieren eines Teils eines Arrays, ohne das ursprüngliche Array zu ändern.
- splice() ermöglicht Ihnen das Entfernen, Ersetzen oder Hinzufügen von Elementen zu einem Array und ändert das ursprüngliche Array.
- forEach() ist ideal zum Durchlaufen von Array-Elementen und zum Ausführen von Nebenwirkungen, gibt jedoch kein neues Array zurück.
Diese Methoden sind wesentliche Werkzeuge bei der Arbeit mit Arrays in JavaScript und können Ihren Code effizienter und lesbarer machen.
Hallo, ich bin Abhay Singh Kathayat!
Ich bin ein Full-Stack-Entwickler mit Fachwissen sowohl in Front-End- als auch in Back-End-Technologien. Ich arbeite mit einer Vielzahl von Programmiersprachen und Frameworks, um effiziente, skalierbare und benutzerfreundliche Anwendungen zu erstellen.
Sie können mich gerne unter meiner geschäftlichen E-Mail-Adresse erreichen: kaashshorts28@gmail.com.
Das obige ist der detaillierte Inhalt vonBeherrschen von Array-Funktionen in JavaScript: Slice, Splice und forEach. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen

Häufig gestellte Fragen und Lösungen für das Ticket-Ticket-Ticket-Ticket in Front-End im Front-End-Entwicklungsdruck ist der Ticketdruck eine häufige Voraussetzung. Viele Entwickler implementieren jedoch ...

JavaScript ist der Eckpfeiler der modernen Webentwicklung. Zu den Hauptfunktionen gehören eine ereignisorientierte Programmierung, die Erzeugung der dynamischen Inhalte und die asynchrone Programmierung. 1) Ereignisgesteuerte Programmierung ermöglicht es Webseiten, sich dynamisch entsprechend den Benutzeroperationen zu ändern. 2) Die dynamische Inhaltsgenerierung ermöglicht die Anpassung der Seiteninhalte gemäß den Bedingungen. 3) Asynchrone Programmierung stellt sicher, dass die Benutzeroberfläche nicht blockiert ist. JavaScript wird häufig in der Webinteraktion, der einseitigen Anwendung und der serverseitigen Entwicklung verwendet, wodurch die Flexibilität der Benutzererfahrung und die plattformübergreifende Entwicklung erheblich verbessert wird.

Es gibt kein absolutes Gehalt für Python- und JavaScript -Entwickler, je nach Fähigkeiten und Branchenbedürfnissen. 1. Python kann mehr in Datenwissenschaft und maschinellem Lernen bezahlt werden. 2. JavaScript hat eine große Nachfrage in der Entwicklung von Front-End- und Full-Stack-Entwicklung, und sein Gehalt ist auch beträchtlich. 3. Einflussfaktoren umfassen Erfahrung, geografische Standort, Unternehmensgröße und spezifische Fähigkeiten.

Diskussion über die Realisierung von Parallaxe -Scrolling- und Elementanimationseffekten in diesem Artikel wird untersuchen, wie die offizielle Website der Shiseeido -Website (https://www.shiseeido.co.jp/sb/wonderland/) ähnlich ist ...

Zu den neuesten Trends im JavaScript gehören der Aufstieg von Typenkripten, die Popularität moderner Frameworks und Bibliotheken und die Anwendung der WebAssembly. Zukunftsaussichten umfassen leistungsfähigere Typsysteme, die Entwicklung des serverseitigen JavaScript, die Erweiterung der künstlichen Intelligenz und des maschinellen Lernens sowie das Potenzial von IoT und Edge Computing.

JavaScript zu lernen ist nicht schwierig, aber es ist schwierig. 1) Verstehen Sie grundlegende Konzepte wie Variablen, Datentypen, Funktionen usw. 2) Beherrschen Sie die asynchrone Programmierung und implementieren Sie sie durch Ereignisschleifen. 3) Verwenden Sie DOM -Operationen und versprechen Sie, asynchrone Anfragen zu bearbeiten. 4) Vermeiden Sie häufige Fehler und verwenden Sie Debugging -Techniken. 5) Die Leistung optimieren und Best Practices befolgen.

Wie fusioniere ich Array -Elemente mit derselben ID in ein Objekt in JavaScript? Bei der Verarbeitung von Daten begegnen wir häufig die Notwendigkeit, dieselbe ID zu haben ...

Erforschen Sie die Implementierung der Funktion des Bedien- und Drop-Einstellungsfunktion der Panel ähnlich wie VSCODE im Front-End. In der Front-End-Entwicklung wird VSCODE ähnlich wie VSCODE implementiert ...
