Oi Renan, tudo certo?
Eles possuem a mesma ideia, realmente. Nesse caso que você postou, o resultado será o mesmo, não há diferença alguma. Porém, quando falamos sobre as diferenças entre o concat e o spread operator, podemos pontuar algumas delas:
- O método
concat() irá adicionar os elementos no final do array, enquanto o spread operator pode ser usado para adicionar elementos em qualquer parte do array. Veja no exemplo abaixo:
const nomes = ['Giovanna', 'Ana', 'Bia'];
const novosNomes = nomes.concat('Julia');
console.log(novosNomes); // ['Giovanna', 'Ana', 'Bia', 'Julia']
const nomes = ['Giovanna', 'Ana', 'Bia'];
const novosNomes = ['Julia', ...nomes];
console.log(novosNomes); // ['Julia', 'Giovanna', 'Ana', 'Bia']
Normalmente, nós usamos o spread operator quando queremos adicionar apenas um valor (um parâmetro), enquanto o método concat é ideal para ser usado com múltiplos parâmetros.
É preciso ter um pouco de cuidado quando trabalhamos com string com o spread operator e o concat. Veja o exemplo abaixo:
[].concat('Oie!');
// Isso irá retornar um array de 1 elemento: ['Oie']
[...'Oie'];
// Isso irá retornar um array com 3 elementos: ['O', 'i', 'e']
Isso significa que o spread operator literalmente espalha a string em elementos no array (cada caractere é um elemento), enquanto o método concat irá adicionar a string inteira como um elemento do array.
Espero ter ajudado, bons estudos =)
