I don't understand what the ... notation does exactly.

I tried a simple example with Babel to understand it (view the example), but it seems that:

ES6 syntax

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



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

console.log(myArray[4]);// undefined

console.log(myArray.length); // 3

is the same as this ES5 syntax:

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

BUT: What does this code do? Because the output (console.log) is the same as in this code (ES5):

var myArray = [1,2,3];



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

console.log(myArray[4]);// undefined

console.log(myArray.length); // 3

What does the ...18 notation mean?