Espalhar

Espalhar na concatenação de vários arrays

Operador de propagação em javascript permite que as matrizes sejam expandidas como seus elementos, o que é útil ao concatenar várias matrizes. por exemplo,

const a = ["a","b","c"]
const b = ["d","e","f"]
const c = ["g","h","i"]

const d = a.concat(b).concat(c)

const d = [...a,...b,...c]

//When logging d into console we get the same output i.e 
// ["a","b","c","d',"e","f","g","h","i"]

const d = [...a,"whatever",...b,"whatever2",...c]

quando temos que passar vários argumentos em uma chamada de função, o spread vem como uma grande ajuda tornando nosso código muito mais legível e limpo,

function add(a,b,c){
  console.log(`The sum is: ${a+b+c}`)
}
const numbers = [1,2,3]
add(...numbers)

//Output
// The sum is: 6

também podemos gerar a cópia de um array conforme nossa necessidade com a ajuda do spread em javascript.

const a = ["a","b","c"]
const b = [...a]

b.push("d")
console.log(a)
console.log(b)

//Output:
// [ 'a', 'b', 'c' ]
//[ 'a', 'b', 'c', 'd' ]

Rest é semelhante a Spread no caso de sua sintaxe, mas é completamente oposto em termos de funcionamento.

function sayHello(name,...topics){
    topics.map((topic) => 
    console.log(`Sometimes ${topic} is more art than ${topic}, ${name}!`)
    )
}
sayHello("Morty","Science","Programming")

//Output:
//Sometimes Science is more art than Science, Morty!
//Sometimes Programming is more art than Programming, Morty!

Conclusão

Para encerrar tudo isso, o operador Spread é usado para desestruturar uma matriz em seus elementos individuais, enquanto o operador rest é usado para construir uma matriz a partir dos elementos fornecidos.