Introdução
O concat é um método utilizado para fazer a junção de duas partes e após essa junção ele retorna uma nova.
Este método no Javascript pode ser utilizado para Strings ou em Arrays, o comando é igual, para os dois tipos de dados.
str.concat(string2 [, ...stringN]) //sintaxe com string
arr.concat(valor1, valor2, ..., valorN) //sintaxe com array
O método não altera nenhum dos dados passados por parâmetro, ele somente pega os valores que foram passados por parâmetro e retorna um novo valor com a união de todos os parâmetros.
Concatenar string
Um exemplo onde pode ser utilizado é para concatenar um título ao nome de uma pessoa, por exemplo um médico, que tem o nome de João, pode-se utilizar o concat para deixar Dr. João.
let titulo = "Dr. ";
let nome = "João da Silva";
let nome_completo = titulo.concat(nome);
console.log(nome_completo);
E o resultado desse código é:
Em strings além desse método, é possível utilizar os Operadores de Atribuição que podem ter uma performance maior.
Concatenar array
Para fazer a junção de dados em arrays, há algumas formas, em casos onde se deseja somente juntar dois arrays distintos esse método funciona bem.
let array1 = [1, 2, 3];
let array2 = [4, 5, 6];
let array3 = array1.concat(array2);
console.log(array3);
O array que chama o método concat, sempre ficará primeiro na junção, caso você queira que o segundo array, fique com os dados na frente do segundo, ai precisa inverter a ordem dessa forma:
let array1 = [1, 2, 3];
let array2 = [4, 5, 6];
let array3 = array2.concat(array1);
console.log(array3);
Outro caso onde pode ser utilizado é para clonar os dados de um array para o outro. Essa é uma função muito útil, normalmente é utilizada nos sistemas para não mexer nos dados originais de um array, então clona para outro.
let array = ['a', 'b', 'c'];
let cloneArray = array.concat();
console.log(cloneArray);
Este método também pode ser utilizado em arrays de string normalmente, ele irá fazer a junção como no array de números.
Código fonte
Além do botão, para notificações é muito comum colocar em ícones de sino.
Todo o código fonte dos exemplos mostrados estão no meu CodeSandbox
Para ver outros canais onde o posto conteúdo, meu Github e também cursos, veja os Links do Programando Soluções.
Vídeo sobre o assunto
Caso queira, gravei um vídeo explicando sobre o concat:
Conclusão
O concat é uma função que pode ser útil no dia a dia, para resolver algum determinado problema com uma lógica que precise de junção de dados, além dele, há outras formas de resolver esses problemas, mas ele pode ser uma boa alternativa. Até o próximo post 🙂
Aprenda a testar Aplicações Javascript
Referências
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/String/concat
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Array/concat
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Expressions_and_Operators