7

Funções para manipular Arrays com JavaScript 1

#JavaScript
Anna Maria
Anna Maria

Vão ser dois artigos com esse assunto, o segundo o link ta no final da página.

Meu artigo anterior ensinando a ter ser um servidor e um domínio GRÁTIS com o GitHub Pages!


Funções para manipular Arrays com JavaScript


Para adicionar no Array:


Push

Adiciona um ou mais elementos no final do array 

EX:

var vetor1 = new Array(1, 2, 3, 2, 7);
    vetor1.push(9, 5);
    console.log(vetor1);

Irá retornar o tamanho do array e os valores dentro dele: (7) [1, 2, 3, 2, 7, 9, 5]

*Foi adicionado 9 e 5 no final


Unshift

Adiciona um ou mais elementos no inicio do array 

EX:

var vetor1 = new Array(1, 2, 3, 4, 5);
vetor1.unshift(-1, 0);
console.log(vetor1);

Irá retornar o tamanho do array e os valores dentro dele:

(7) [-1, 0, 1, 2, 3, 4, 5]

*foi adicionado -1 e 0 no começo

______________________________________________________________________________________

Para remover no Array:


Pop

remove o último elemento do array

EX:

var vetor1 = new Array(1, 2, 3, 2, 7);
    var ultimo = vetor1.pop();
    console.log(ultimo);

Irá retornar o item removido: 7


Shift

remove o primeiro elemento do array

EX:

var vetor1 = new Array(1, 2, 3, 4, 5);
    var primeiro = vetor1.shift();
    console.log(primeiro);

Irá retornar o item removido: 1

______________________________________________________________________________________

Para juntar dois Arrays:


Contact

Concatena/junta um ou mais Arrays e armazena num 

novo array

EX:

var vetor1 = new Array(1, 2, 3);
    var vetor2 = new Array(4, 5, 6);
    var vetor3 = new Array(7, 8, 9);
    var result = vetor1.concat(vetor2, vetor3);
    console.log(result);

Irá retornar o tamanho do array e os valores dentro dele:

(9) [1, 2, 3, 4, 5, 6, 7, 8, 9]

______________________________________________________________________________________

Para "Fatiar Arrays":


Slice

Essa função recebe como parâmetros dois valores inteiros e retorna uma fração do array original com base nos limites que foram informados.

O primeiro parâmetro indica a posição do primeiro elemento do Array a fazer parte da seleção, enquanto o segundo parâmetro indica a posição seguinte a do último elemento selecionado(um a mais que a posição deste).


Nesse exemplo abaixo, selecionamos os elementos 2, 3, e 4 do array original, informando a posição do elemento 2 (primeiro da seleção) e do elemento 5 (sucessor do 4 que é o final da seleção).

EX:

var vetor1 = new Array(1, 2, 3, 4, 5);
    var selecao = vetor1.slice(1, 4);
    console.log(selecao);

Irá retornar o tamanho do array e os valores dentro dele:

(3)[2, 3, 4]

______________________________________________________________________________________

Para adicionar novos elementos enquanto remove elementos antigos:


Splice

Serve para remover e/ou adicionar itens de/em um array. A chamada a este método requer dois ou vários (três ou mais) parâmetros.

O primeiro parâmetro representa a posição do elemento a ser removido (começando do zero) e o segundo indica a quantidade de elementos a serem removidos do array, a partir da posição indicada. Caso não se deseje remover nenhum item, basta passar 0 (zero) como segundo parâmetro. No exemplo a abaixo o segundo e o terceiro elementos são removidos.

EX1:

var vetor1 = new Array(1, 2, 3, 4, 5);
    vetor1.splice(1,2);
    console.log(vetor1)

Aqui ta basicamente dizendo:

"A partir do valor que ta no índice 1(2), remova ele e o próximo(3)"

Irá retornar o tamanho do array e os valores dentro dele:

(3) [1, 4, 5]


Caso se deseje apenas inserir elementos em determinada posição, basta informá-la como primeiro parâmetro, informar 0 (zero) no segundo e, a partir daí, informar o(s) elemento(s) a ser(em) adicionado(s)

EX2:

var vetor1 = new Array(1, 2, 3, 4, 5);
    vetor1.splice(1, 0, 9, 8);
    console.log(vetor1);

Aqui ta basicamente dizendo:

"Antes da posição 1(2), adicione 9 e 8"

Irá retornar o tamanho do array e os valores dentro dele:

(7) [1, 9, 8, 2, 3, 4, 5]


Uma terceira forma de usar essa função seria para remover e adicionar elementos ao mesmo tempo

EX3:

var vetor1 = new Array(1, 2, 3, 4, 5);
    vetor1.splice(1,2, 9, 8);
    document.write(vetor1);

Aqui ta basicamente dizendo:

"Na primeira posição (1) , remova os dois elementos seguintes e depois adicione mais dois (9, 8)."

Será retornado: (5) [1, 9, 8, 4, 5]


Segundo artigo  👈


Baseado nesse artigo: https://www.gigasystems.com.br/artigo/89/funcoes-para-manipulacao-de-arrays-com-javascript

______________________________________________________________________________________

Olá, meu nome é Anna Maria eu sou uma desenvolvedora Front-End.

Me desafiei a postar um ou dois artigos por dia aqui na DIO, com assunto diversos, mas principalmente coisas que eu tive/tenho dificuldade.

Então decidi compartilhar com vocês.


💜 Me siga para ver mais artigos

💜 Curta

💜 Comente o que achou

💜 Se ficar com alguma dúvida pode me contatar

💜 Discord: imnotannamaria#1935 |

💜LinkedIn: www.linkedin.com/in/anna-maria-573801191/

💜Email: aannamariabr@outlook.com


_Anna Maria

2
113

Comentários (2)

1
Anna Maria

Anna Maria

13/12/2020 21:57

Obrigado : )


1
Igla Generoso

Igla Generoso

13/12/2020 21:55

Parabéns Anna! Muito top o artigo! :-)

Desenvolvedora Front-End | JavaScript | CSS | HTML

Brasil