Difference between [...arr] and slice()

JavaScript
1

Hello there,

Not so new to FCC, but brand new to the forum (although been lurking for some time). I’m working through the Javascript part of FCC’s lessons (on the functional programming part) and something I’m confused with is this:

let someArr = [1, 2, 3, 4, 5]; 
let copyArr = [...someArr]; 
let copyArr2 = someArr.slice();

Are both copyArr and copyArr2 exact copies of someArr or is one of them merely a reference? I understand the use-case for slice(), but what is it that [...] does?

2

Those three dots are called “spread”.

3

This has answered my question, thank you!
To anyone else also wondering, the .slice() will only work on arrays, where as spread ([…]) will work on any iterable.

4

But if those three dots were put in arguments, it called “rest parameter”

function add (...args) {
  //logic
}
5

You can also test it:

let someArr = [1, 2, 3, 4, 5]; 
let copyArr = [...someArr]; 
let copyArr2 = someArr.slice();
let copyArr3 = someArr;

console.log(someArr === copyArr); // false
console.log(someArr === copyArr2); // false
console.log(copyArr === copyArr2); // false
console.log(someArr === copyArr3); // true