Você sabe como unir vetores?
Este artigo mostrará duas maneiras de unir vetores e retornar um novo vetor.
Serão utilizados os operadores Spread e Concat.
// Duas formas de unir vetores const circ = [‘círculo’, ‘esfera’]; const quadr = [‘quadrado’, ‘cubo’]; // Usando o Concat para unir os vetores: cons unirVet = [].concat(circ, quadr); // Usando o Spread para unir os vetores: const unirSpread = [...circ, ...quadr]; // E o resultado será: console.log(unirSpread); // [‘círculo’, ‘esfera’, ‘quadrado’, ‘cubo’]
Você também pode escrever o método Concat deste modo:
const circ = [‘círculo’, ‘esfera’]; const quadr = [‘quadrado’, ‘cubo’]; const unirVetor = circ.concat(quadr); console.log(unirVetor); E o resultado será: // [‘círculo’, ‘esfera’, ‘quadrado’, ‘cubo’] console.log(circ); // [‘círculo’, ‘esfera’]; console.log(quadr); // [‘quadrado’, ‘cubo’];
Este modo não altera o vetor existente.
Comparando os dois modos do concat:
// Versão 1 cons unirVet = [].concat(circ, quadr); // Versão 2 const unirVetor = circ.concat(quadr);
A versão 1 cria uma nova matriz e não manipula uma matriz existente. Visualmente falando, a versão 2 parece adicionar a matriz de quadrados à matriz de círculos.
A diferença entre Spread e Concat:
Spread:
O Spread quebra um array ou uma string em múltiplos elementos. Se você possui um array e quer criar um array com o existente fazendo parte dele, você pode usar o Spread.
let umaString = "Olá Mundo"; console.log(umaString); // exibe a string console.log(...umaString); // exibe cada caracter let umVetor = [11,22,33,44,55,66]; //cria um vetor console.log(umVetor); // mostra conteúdo o vetor console.log(...umVetor); // mostra o conteúdo de cada índice do vetor
Concat:
Já o Concat cria um novo vetor unindo os elementos que foram passados como parâmetro, não alterando a si mesmo ou aos argumentos passados, mas criando um novo vetor contendo uma cópia de si e dos argumentos.
A cópia é uma referência aos objetos. Se o objeto original for modificado, as mudanças serão visíveis no original e na cópia.
Strings e numbers (diferente dos objetos String e Number), o concat copia os valores de strings e numbers para o novo vetor, mas qualquer alteração no novo vetor não refletirá no original.
// Cria uma função que concatenará
// o vetor e a variável
function combinaVetor(vetor1, vetor2){
return [].concat(vetor1, vetor2);
}
// Crie um vetor
const ehVetor = ['carro', 'moto', 'onibus'];
// Crie uma variável
const notVetor = 7;
// Chamada da função
combinaVetor(ehVetor, notVetor);
// [“carro”, “moto”, “onibus”, 7]
Unindo arrays com Push:
Quando você utilizar o método Push, você não criará um novo array, mas sim manipulando um existente:
const meninos = ["joao", "josé"]; const meninas = ["maria", "vanessa"]; const alunos = meninos.push(...meninas); console.log(alunos); //Quando você usa o push, ele retornará o tamanho do vetor unido. console.log(meninos); ["joao", "josé", "maria", "vanessa"] // Retorna o vetor meninos modificado console.log(meninas); ["maria", "vanessa"]
Gostou deste artigo? Comente abaixo e compartilhe com seus amigos!