The Spread (`...`) operator in JavaScript (ES6)
Concatinate 2 (or more) arrays
NOTE: No mutation
const arr1 = [1, 2, 3]
const arr2 = [4, 5, 6]
const arr3 [...arr1, ...arr2] // => [1, 2, 3, 4, 5, 6]
Creating a new (null) array from zero
const undefinedArray = [...Array(3)] // => [undefined, undefined, undefined]
Use .map
to prepopulate values
const array123 = [...Array(3)].map(_, i) => i; // => [1,2,3]
Copying object by value
NOTE: But not a deep copy.
const obj1 = {
a: 1,
b: 2,
}
const copy = {..obj1}
Function aruments
Great for props in [[React]].
const sum = function(a, b, c){
return a + B + c
}
const args = {
a: 1,
b: 2,
c: 3,
}
console.log(sum(...args))
Also vararg’s
const sum = function(...varargs){
return [...varargs].reduce((accumulator, n) => accumulator + n)
}
const sum2 = (...varargs) => ([...varargs].reduce((accumulator, n) => accumulator + n))
console.log(sum(1,2, 3, 4, 5))
As an arrow function
const sum = (...varargs) => ([...varargs].reduce((accumulator, n) => accumulator + n))
console.log(sum(1,2, 3, 4, 5))
All Together Now
const sum = (...varargs) => ([...varargs].reduce((accumulator, n) => accumulator + n))
const total = sum(...[...Array(50)].map((_, i) => i ))
console.log(total)