web-dev-qa-db-fra.com

Que signifie la notation "..." (triple point) dans les tableaux?

Je ne comprends pas ce que le ... la notation fait exactement.

J'ai essayé un exemple simple avec Babel pour le comprendre ( voir l'exemple ), mais il semble que:

Syntaxe ES6

let myArray = [1, 2, 3, ...18];

console.log(myArray); // [1, 2, 3]
console.log(myArray[4]);// undefined
console.log(myArray.length); // 3

est la même que cette syntaxe ES5 :

"use strict";

function _toConsumableArray(arr) { 
    if (Array.isArray(arr)) { 
        for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) {
             arr2[i] = arr[i];
        }
        return arr2;
     } else { 
        return Array.from(arr); 
     } 
}

var myArray = [1, 2, 3].concat(_toConsumableArray(18));

console.log(myArray); // [1, 2, 3]
console.log(myArray[4]); // undefined
console.log(myArray.length); // 3

MAIS: Que fait ce code? Parce que la sortie (console.log) est le même que dans ce code (ES5):

var myArray = [1,2,3];

console.log(myArray); // [1, 2, 3]
console.log(myArray[4]);// undefined
console.log(myArray.length); // 3

Que fait le ...18 signifie la notation?

25
Aral Roca

Le ... ( ( opérateur de propagation ) fonctionne en renvoyant chaque valeur de l'index 0 indexer length-1:

Comme exemple:

[...'18'] // returns ['1', '8']

ce qui reviendrait à:

['18'[0], '18'[1]]

Maintenant, pour obtenir un tableau de 1 à 18, tu peux le faire:

[...Array(19).keys()].slice(1)

Ou ceci avec carte:

[...Array(18)].map(_=>i++,i=1)

J'espère que ça aide.

27
user4227915

L'expression [1, 2, 3, ...18] est invalide.

Vous ne pouvez pas utiliser ... avec un nombre . Vous ne pouvez utiliser que ... avec un objet itérable comme un tableau , chaîne ou Objet .

Il est intéressant de noter que Tracur - un autre transpilateur - génère une erreur lorsqu'il est alimenté avec le même code:

TypeError : Impossible de diffuser un objet non itérable.

Je ne suis pas intime avec le spécification mais je pense que cela pourrait être un "bug" Babel.

4
Alex Booker