Heim >Web-Frontend >js-Tutorial >AvaScript-Array-Methoden, die jeder Entwickler beherrschen sollte (Teil 2)
JavaScript bietet einen leistungsstarken Satz integrierter Array-Methoden, die die Arbeit mit Daten erheblich erleichtern.
In diesem Beitrag werden wir vier häufig verwendete Array-Methoden untersuchen: concat(), reverse(), fill() und join().
Jede dieser Methoden ist ein wertvolles Werkzeug zur Bearbeitung von Arrays auf unterschiedliche Weise. Lasst uns eintauchen!
Wenn Sie unseren vorherigen Beitrag noch nicht gelesen haben, lesen Sie unbedingt Teil 1 für weitere nützliche Array-Techniken! Dadurch erhalten Sie einen vollständigen Überblick über noch leistungsfähigere Array-Methoden.
Mit der concat()-Methode können Sie mehrere Arrays oder Werte in einem neuen Array zusammenführen. Das ursprüngliche Array wird nicht verändert, sondern ein neues mit dem kombinierten Inhalt zurückgegeben.
arr.concat(value1, value2, ...);
Wenn das Argument ein Array ist, werden alle Elemente aus diesem Array kopiert; andernfalls wird das Argument selbst kopiert.
const arr = [1, 2]; // Merging arr with another array [3, 4] const arr1 = arr.concat([3, 4]); console.log(arr1); // Output: [1, 2, 3, 4] // Merging arr with two arrays [3, 4] and [5, 6] const arr2 = arr.concat([3, 4], [5, 6]); console.log(arr2); // Output: [1, 2, 3, 4, 5, 6] // Merging arr with two arrays and additional values 5 and 6 const arr3 = arr.concat([3, 4], 5, 6); console.log(arr3); // Output: [1, 2, 3, 4, 5, 6]
Die Methode reverse() kehrt die Reihenfolge der Elemente im ursprünglichen Array um. Im Gegensatz zu anderen Array-Methoden ändert reverse() das ursprüngliche Array direkt und gibt es auch zurück.
arr.reverse();
const arr = [1, 2, 3, 4, 5]; // Reverses the array in place and returns the reversed array const reversedArr = arr.reverse(); console.log(reversedArr); // Output: [5, 4, 3, 2, 1] // Original array is also reversed console.log(arr); // Output: [5, 4, 3, 2, 1]
Die Methode fill() füllt alle Elemente in einem Array mit einem angegebenen Wert. Es handelt sich um eine Mutator-Methode, das heißt, sie ändert das ursprüngliche Array und gibt die aktualisierte Version zurück.
arr.fill(value, start, end)
Wichtig: Der Endindex ist nicht enthalten – er fungiert als exklusive Grenze. Das bedeutet, dass die Füllung unmittelbar vor dem Element am Endindex stoppt.
const nums1 = [15, 27, 19, 2, 1]; const nums2 = [25, 28, 34, 49]; const nums3 = [8, 9, 3, 7]; // Fill all elements with 5 const newNums1 = nums1.fill(5); console.log(nums1); // Output: [5, 5, 5, 5, 5] console.log(newNums1); // Output: [5, 5, 5, 5, 5] // Fill elements from index 1 to 3 with 25 nums2.fill(25, 1, 3); console.log(nums2); // Output: [25, 25, 25, 49] // Fill elements from index -2 to end with 15 (negative index counts from the end) nums3.fill(15, -2); console.log(nums3); // Output: [8, 9, 15, 15]
Die Methode join() fügt alle Elemente eines Arrays zu einer einzigen Zeichenfolge zusammen. Standardmäßig werden die Elemente durch ein Komma getrennt, Sie können jedoch ein benutzerdefiniertes Trennzeichen angeben.
arr.join(separator);
const movies = ["Animal", "Jawan", "Pathaan"]; // Join elements with a custom separator " | " const moviesStr = movies.join(" | "); console.log(moviesStr); // Output: "Animal | Jawan | Pathaan" // The original array remains unchanged console.log(movies); // Output: ["Animal", "Jawan", "Pathaan"] // Join elements with no separator const arr = [2, 2, 1, ".", 4, 5]; console.log(arr.join("")); // Output: "221.45" // Join elements with a custom separator " and " const random = [21, "xyz", undefined]; console.log(random.join(" and ")); // Output: "21 and xyz and "
Die Methoden concat(), reverse(), fill() und join() sind leistungsstarke Werkzeuge für die Arbeit mit Arrays in JavaScript.
Diese Methoden sind für eine effektive Array-Manipulation unerlässlich und können dazu beitragen, Ihren Code sauberer und effizienter zu machen.
Das obige ist der detaillierte Inhalt vonAvaScript-Array-Methoden, die jeder Entwickler beherrschen sollte (Teil 2). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!