Hallo

Ich habe in der vergangenen Woche einen ziemlich umfangreichen Artikel zum Rest- beziehungsweise Spread Operator geschrieben, der in ECMAScript 2015 eingeführt wurde und zu dem es bislang im Wiki noch keinen Artikel gab. Da sich die Semantik des Operators ... abhängig vom Kontext in dem er verwendet wird stark unterscheidet, sind es also eigentlich zwei verschiedene Artikel. Aber es erschien mir nicht sinnvoll, das auf zwei Seiten zu verteilen, zumal die Syntax dieselbe ist.

function name (parameter, ...rest) {
  console.log(rest);
  return rest;
}

const values = name(25, 50, 75); // [50, 75]

console.log(Array.isArray(values)); // true

Der Operator kann zum Beispiel dazu verwendet werden um Restparameter zu erstellen. Dabei wird ein (anders als das Objekt arguments) echtes Array mit den beim Aufruf an die Funktion übergebenen Werten erzeugt, die nicht zuvor an formale Parameter gebunden wurden.

const numbers = [15, 30, 45, 60];

let [first, second, ...rest] = numbers;

console.log(rest); // [45, 60]

Bei der Destrukturierung iterierbarer Objekte wie zum Beispiel Arrays erfüllt der Operator denselben Zweck, das heißt, auch hier wird ein Array mit den zuvor nicht gebundenen Werten erzeugt.

const part1 = [10, 15],
      part2 = [25, 30];

const list = [5, ...part1, 20, ...part2, 35];

console.log(list.length); // 7

Als Spread Operator kann der Operator dazu verwendet werden, die Werte eines iterierbaren Objektes in ein Array einzufügen. Wird er also wie hier in einem Arrayliteral notiert und ihm Objekt übergeben, welches ein Iterable Interface implementiert hat, dann iteriert er über dieses Objekt und fügt die Werte an der Stelle in das Array ein, an der er notiert wurde.

const numbers = new Set([3, 17, 5, 11, 31]);

let max = Math.max(...numbers);

console.log(max); // 31

Genauso verhält er sich, wenn er bei der Übergabe von Argumenten notiert wird. Erwartet die Funktion, so wie zum Beispiel Math.max die zu übergebenden Werte als einzelne Argumente, liegen diese aber in einem iterierbaren Objekt vor, dann kann der Operator dazu verwendet werden, die Werte aus dem referenzierten Objekt zu lesen und sie in Argumente umzuwandeln.

Also, wer mag, kann ja mal einen Blick auf Artikel zum Rest- oder Spread-Operator werfen.

Gruß,

Orlok