Search code examples
javascriptarraystypescriptecmascript-6operators

spread operator vs array.concat()


What is the difference between spread operator and array.concat()

let parts = ['four', 'five'];
let numbers = ['one', 'two', 'three'];
console.log([...numbers, ...parts]);

Array.concat() function

let parts = ['four', 'five'];
let numbers = ['one', 'two', 'three'];
console.log(numbers.concat(parts));

Both results are same. So, what kind of scenarios we want to use them? And which one is best for performance?


Solution

  • Well console.log(['one', 'two', 'three', 'four', 'five']) has the same result as well, so why use either here? :P

    In general you would use concat when you have two (or more) arrays from arbitrary sources, and you would use the spread syntax in the array literal if the additional elements that are always part of the array are known before. So if you would have an array literal with concat in your code, just go for spread syntax, and just use concat otherwise:

    [...a, ...b] // bad :-(
    a.concat(b) // good :-)
    
    [x, y].concat(a) // bad :-(
    [x, y, ...a]    // good :-)
    

    Also the two alternatives behave quite differently when dealing with non-array values.