HTML: Markup language
CSS: Styling language
JavaScript: Scripting language
Web APIs: Programming interfaces
All web technology
Learn web development
Discover our tools
Get to know MDN better
Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.
View in English Always switch to English
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.
Die slice() Methode von Array Instanzen gibt eine flache Kopie eines Teils eines Arrays in ein neues Array-Objekt zurück, das von start bis end ausgewählt wurde (end ist nicht inbegriffen), wobei start und end die Indizes von Elementen in diesem Array darstellen. Das ursprüngliche Array wird nicht verändert.
slice()
Array
start
end
const animals = ["ant", "bison", "camel", "duck", "elephant"]; console.log(animals.slice(2)); // Expected output: Array ["camel", "duck", "elephant"] console.log(animals.slice(2, 4)); // Expected output: Array ["camel", "duck"] console.log(animals.slice(1, 5)); // Expected output: Array ["bison", "camel", "duck", "elephant"] console.log(animals.slice(-2)); // Expected output: Array ["duck", "elephant"] console.log(animals.slice(2, -1)); // Expected output: Array ["camel", "duck"] console.log(animals.slice()); // Expected output: Array ["ant", "bison", "camel", "duck", "elephant"]
slice() slice(start) slice(start, end)
Nullbasierter Index, bei dem die Extraktion beginnt, in eine Ganzzahl umgewandelt.
-array.length <= start < 0
start + array.length
start < -array.length
0
start >= array.length
Nullbasierter Index, bei dem die Extraktion endet, in eine Ganzzahl umgewandelt. slice() extrahiert bis, aber nicht einschließlich end.
-array.length <= end < 0
end + array.length
end < -array.length
end >= array.length
undefined
array.length
Ein neues Array, das die extrahierten Elemente enthält.
Die slice() Methode ist eine kopierende Methode. Sie verändert this nicht, sondern gibt stattdessen eine flache Kopie zurück, die einige der gleichen Elemente wie die des ursprünglichen Arrays enthält.
this
Die slice() Methode bewahrt leere Stellen. Wenn der ausgeschnittene Teil lückenhaft ist, ist das zurückgegebene Array ebenfalls lückenhaft.
Die slice() Methode ist generisch. Sie erwartet nur, dass der this-Wert eine length-Eigenschaft und integerindizierte Eigenschaften hat.
length
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"]; const citrus = fruits.slice(1, 3); // fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'] // citrus contains ['Orange','Lemon']
In diesem Beispiel extrahiert slice(1, 3) Elemente vom Index 1 bis, aber nicht einschließlich, Index 3, was zu einem neuen Array ['Orange', 'Lemon'] führt.
slice(1, 3)
1
3
['Orange', 'Lemon']
const fruits = ["Apple", "Banana", "Orange", "Mango", "Pineapple"]; const tropical = fruits.slice(2); console.log(tropical); // ['Orange', 'Mango', 'Pineapple']
In diesem Beispiel extrahiert slice(2) Elemente vom Index 2 bis zum Ende des Arrays.
slice(2)
2
const fruits = ["Apple", "Banana", "Orange", "Mango", "Pineapple"]; const lastTwo = fruits.slice(-2); console.log(lastTwo); // ['Mango', 'Pineapple']
In diesem Beispiel extrahiert slice(-2) die letzten zwei Elemente des Arrays. Bei Verwendung eines negativen Index mit der slice Methode werden negative Indizes vom Ende des Arrays aus gezählt, beginnend bei -1 für das letzte Element, -2 für das vorletzte Element und so weiter. Der negative Index -2 selbst ist eingeschlossen, da er der Ausgangspunkt der Extraktion ist.
slice(-2)
slice
-1
-2
| | | | | | | S | L | I | C | E | | | | | | | -5 -4 -3 -2 -1 <--- read from reverse
const fruits = ["Apple", "Banana", "Orange", "Mango", "Pineapple"]; // Using positive start index and negative end index const sliceExample = fruits.slice(1, -1); console.log(sliceExample); // ['Banana', 'Orange', 'Mango']
In diesem Beispiel beginnt slice(1, -1) mit der Extraktion ab Index 1 und geht bis zu, aber schließt nicht ein, das Element bei Index -1 (welches das letzte Element ist). Dies ergibt ein neues Array mit ['Banana', 'Orange', 'Mango']. Die slice Methode schließt immer das Element am angegebenen Endindex aus, unabhängig davon, ob es positiv oder negative ist.
slice(1, -1)
['Banana', 'Orange', 'Mango']
read from start ---> 0 1 2 3 4 | | | | | | | S | L | I | C | E | | | | | | | -5 -4 -3 -2 -1 <--- read from reverse
Im folgenden Beispiel erstellt slice ein neues Array, newCar, aus myCar. Beide beinhalten eine Referenz zum Objekt myHonda. Wenn die Farbe von myHonda auf Lila geändert wird, reflektieren beide Arrays die Änderung.
newCar
myCar
myHonda
// Using slice, create newCar from myCar. const myHonda = { color: "red", wheels: 4, engine: { cylinders: 4, size: 2.2 }, }; const myCar = [myHonda, 2, "cherry condition", "purchased 1997"]; const newCar = myCar.slice(0, 2); console.log("myCar =", myCar); console.log("newCar =", newCar); console.log("myCar[0].color =", myCar[0].color); console.log("newCar[0].color =", newCar[0].color); // Change the color of myHonda. myHonda.color = "purple"; console.log("The new color of my Honda is", myHonda.color); console.log("myCar[0].color =", myCar[0].color); console.log("newCar[0].color =", newCar[0].color);
Dieses Skript schreibt:
myCar = [ { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }, 2, 'cherry condition', 'purchased 1997' ] newCar = [ { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }, 2 ] myCar[0].color = red newCar[0].color = red The new color of my Honda is purple myCar[0].color = purple newCar[0].color = purple
Die slice() Methode liest die length-Eigenschaft von this. Sie liest dann die integerindizierten Eigenschaften von start bis end und definiert sie auf einem neu erstellten Array.
const arrayLike = { length: 3, 0: 2, 1: 3, 2: 4, 3: 33, // ignored by slice() since length is 3 }; console.log(Array.prototype.slice.call(arrayLike, 1, 3)); // [ 3, 4 ]
Die slice() Methode wird oft mit bind() und call() verwendet, um eine Hilfsmethode zu erstellen, die ein array-ähnliches Objekt in ein Array konvertiert.
bind()
call()
// slice() is called with `this` passed as the first argument const slice = Function.prototype.call.bind(Array.prototype.slice); function list() { return slice(arguments); } const listResult = list(1, 2, 3); // [1, 2, 3]
Das von slice() zurückgegebene Array kann lückenhaft sein, wenn die Quelle lückenhaft ist.
console.log([1, 2, , 4, 5].slice(1, 4)); // [2, empty, 4]
JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.
Array.prototype.slice
core-js
Array.prototype.pop()
Array.prototype.shift()
Array.prototype.concat()
Array.prototype.splice()
TypedArray.prototype.slice()
String.prototype.slice()