Javascript Array slice (), splice ()

Elemente eines Arrays in ein anderes Array kopieren / löschen und ersetzen

array.slice() kopiert Elemente von einem Startindex bis zu einem Endindex in ein neues Array.

array.splice() löscht Elemente aus dem Array, ersetzt sie durch neue Elemente und gibt die ersetzen Elemente zurück.

array.slice()

Javascript slice(start[, end]) kopiert einen Bereich eines Arrays in ein anderes Array. start ist die Anfangsposition und end die Position nach dem ausgeschnittenen Bereich. Wenn eine der beiden Zahlen negativ ist, wird vom Ende des Arrays aus gezählt.

Das Original-Array bleibt erhalten – die Methode array.slice() ist nicht destruktiv.

                0     1    2     3       4       5
const arr = ["Anna", "Benno", , "Emma", "Lasse", "Molly"];

let a = arr.slice (0, 3);
let b = arr.slice (4);
let c = arr.slice (0, -2);

console.log ("%c a " + arr.slice(0,3));
console.log ("%c b " + arr.slice(4));
console.log ("%c c " + arr.slice(0, -2));


arr.slice(0,3)
schneidet die Elemente vom Index 0 bis zum Index vor 3 aus. Das Resultat ist ein Javascript Array der Länge 3: Der letzte Index ist ein leerer Platz oder Loch (sparse Arrays).
arr.slice(4)
schneidet das Element mit dem Index 4 aus. Wenn im Aufruf nur der Startindex angegeben ist, setzt slice() die Länge des Arrays als zweites Argument.
arr.slice(0, -2);
schneidet die Elemente vom Index 0 bis zum Index -2 + 5 = 3 aus. Wenn also einer der Indexwerte negativ ist, wird die Länge des Arrays addiert.
arr.slice()
kopiert das vollständige Array.

array.splice()

splice() fügt Elemente an einer beliebigen Position des Arrays ein oder löscht eine Anzahl von Elementen ab einer beliebigen Position.

Javascript array.splice(start, c [, e]) fügt c Elemente, die als Parameter e1, e2, … ec aufgeführt sind, in das Array ab Position start ein und überschreibt dabei vorhandene Elemente.

//             start              
//              0       1       2      3       4       5
let colors = ["rot", "grün", "blau", "gelb", "oliv", "grau"];

let out = colors.splice(0, 3, "lila", "braun", "ocker");

console.log ("out " + out);
console.log ("colors " + colors);

Die Anweisung colors.splice(0, 3, "lila", "braun", "ocker"); schneidet ab Position 0 drei Elemente aus colors und setzt drei neue Elemente lila, braun und ocker hinzu. Also enthält das Array colors am Ende der Anweisung lila, braun, ocker, gelb, oliv, grau.

Die Methode verändert das Array. Alles was aus dem Array herausgeschnitten wurde, kann einer Variablen übergeben werden.

[Log]  out rot,grün,blau 
[Log]  colors lila,braun,ocker,gelb,oliv,grau 

Werden die optionalen Parameter e nicht benutzt, löscht splice(start, delcount) delcount Elemente ab Position start. Die folgenden Elemente werden neu durchnummeriert – mit splice(start, delcount) entstehen keine Lücken oder Löcher im Array.

colors.splice(1, 3); schneidet ab Position 1 drei Elemente aus colors aus, so dass "lila", "olive" und "grau" bleiben.

//        0      1       2       3      4      5
//        |      |       |       |      |      |
//	"lila","braun","ocker","gelb","oliv","grau"
[Log]  colors lila,olive,grau

array insert

Mit dem dritten Argument fügt array.splice() ein neues Element in ein Array ein.

// Das Original-Array
let myarray = ["EINS", "ZWEI", "VIER"];
// splice(position, numberOfItemsToRemove, item)
myarray.splice(2, 0, "DREI");
console.log (myarray);
[LOG] myarray EINS,ZWEI,DREI,VIER

Die Methode array.insert() zum Array-Prototype hinzufügen:

Array.prototype.insert = function (index, item) {
  this.splice(index, 0, item);
};
.slice(0,3) array