JavaScript - Principais métodos dos Arrays - I

 Hoje vamos apresentar os principais métodos usandos com arrays  na linguagem JavaScript.

O objetivo desta série de artigos sobre JavaScript é apresentar os conceitos básicos para poder usar o JavaScript em aplicações React, Angular, jQuery, etc., que interagem com aplicações ASP .NET Core ou ASP .NET MVC 5.

Eu estou usando o editor de código Visual Studio Code e testando o código JavaScript usando o terminal REPL do Node.js. (Você tem que ter o Nodejs instalado)

O Node.js é um ambiente de runtime JavaScript construído utilizando o interpretador de JavaScript V8 do Google Chrome.

Veja este artigo para saber como configurar o ambiente para Node e usar o terminal REPL e o VS Code.

Usando os métodos de arrays

Já sabemos como definir um array em JavaScript. Veremos agora os principais métodos dos arrays.

1- Convertendo Arrays para String : toString() e join()

O método toString() converte um array em uma string de valores(separados por vírgula).

Usando o terminal REPL (abra um prompt de comandos cmd e digite node) teremos:

var times = ["Palmeiras","Santos","Flamengo","Vasco"];
var lista = times.toString();

O método join() permite especificar um separador:

var times = ["Palmeiras","Santos","Flamengo","Vasco"];
var lista = times.join("/");

2- Adicionando elementos a um array : push() e unshift()

O método push() adiciona um novo elemento ao final de um array.

Vamos usar o terminal REPL agora incluindo várias linhas. Para isso coloque as linhas entre chaves { }.

Nota: O REPL usa (…) para indicar que está aguardando o código completo antes de executar. Basta fechar as chaves e teclar Enter para que o REPL avalie o JavaScript inserido. Para sair de dentro de um bloco (…) sem executar o que você já digitou, basta digitar .break ou pressionar Ctrl + C.

var times = ["Bahia","Fluminense","Cruzeiro"];
var lista = times.push("Santos");

Podemos continuar incluindo elementos no array. Vamos agora inclui mais dois elementos:

var times = ["Bahia","Fluminense","Cruzeiro"];
...
var lista = times.push("Curitiba", "Famengo");

Podemos usar o método unshift() incluir um novo elemento no início do array :

let frutas =["banana", "laranja","melancia","manga"];
frutas.unshift("abacate");

3- Removendo elementos de um array : pop() e shift()

O método pop() remove o último elemento de um array.

var times = ["Bahia","Fluminense","Cruzeiro","Santos","Curitiba","Flamengo"];
times.pop();

No exemplo removemos o elemento Flamengo do array original usando o método times.pop();

Podemos usar o método shift() para remover o primeiro elemento e deslocar os demais elementos para um índice menor:

let frutas =["banana", "melancia","abacaxi","manga"];
frutas.shift();
let frutaexcluida = frutas.shift();

Neste exemplo estamos usando let para declarar o array frutas.

"let permite que você declare variáveis limitando seu escopo no bloco, instrução, ou em uma expressão na qual ela é usada. Isso é inverso da keyword var, que define uma variável globalmente ou no escopo inteiro de uma função, independentemente do escopo de bloco."

Observe que podemos obter o elemento que foi excluido usando:  let frutaExcluida = frutas.shift();

4- Alterando elementos de um array

Como os elementos de um array são acessados usando o seu número de índice, que iniciam com zero. Podemos alterar os elementos de um array atribuindo um novo valor a um elemento existente usando o seu índice.

Podemos também usar a propriedade length para anexar um elemento ao array:

Podemos usando o método delete para deletar um elemento usando o seu índice no array:

Este método deixa um 'buraco' indefinido no seu array. Então prefira usar pop() ou shift().

5- Incluindo e excluindo elementos em um array com splice()

O método splice() pode ser usado para incluir e excluir elementos em um array a partir de uma posição definida.

Sintaxe :  
arrayObj.splice(start, deleteCount, [item1[, item2[, . . . [,itemN]]]])
a-) Incluindo elementos com splice()
Na instrução : frutas.splice(2,0,....);
- O primeiro parâmetro (2) define a posição onde os novos elementos serão incluidos.
- O segundo parâmetro (0) define quantos elementos serão removidos.
- Os parâmetros restantes "abacate","kiwi" definem os novos elementos que serão adicionados.
b-) Removendo elementos com splice()
 
Na instrução : frutas.splice(0,1); removemos um elemento na posição zero :
- O primeiro parâmetro (0) define a posição onde o elemento será removido
- O segundo parâmetro (1) define quantos elementos serão removidos.
- Como o demais parâmetro foram omitidos, nenhum elemento será adicionado;

6- Concatenando arrays

O método concat() cria um novo array mesclando arrays existentes:
Este método não altera os arrays existentes ele cria um novo array : criancas.
Podemos concatenar mais de um array:
O método concat() mesclou os 3 arrays.
7- Dividindo arrays
O método slice() divide uma parte de um array em um novo array.
Este método pode usar dois argumentos : slice(inicio, valor)
- inicio - Indica o índice o do elemento selecionado
- valor- indica quantos elementos serão selecionados.
Se valor for omitido será selecionado o restante do array a partir de inicio.

A seguir temos uma tabela resumindo os principais métodos apresentados:

Método Descrição
 concat() Junta dois ou mais arrays e retorna uma cópia dos arrays unidos
 join() Junta todos os elementos de um array em uma string
 pop() Remove o último elemento de um array e retorna esse elemento
 push() Adiciona novos elementos ao final de um array e retorna o novo tamanho
 shift() Remove o primeiro elemento de um array e retorna esse elemento
 slice() Seleciona uma parte de um array e retorna o novo array
 splice() Adiciona / Remove elementos de um array
 toString() Converte um array em uma string e retorna o resultado
 unshift() Adiciona novos elementos ao início de um array e retorna o novo tamanho

Na próxima parte veremos o métodos para realizar buscas em um array.

"E disse-lhe um: Senhor, são poucos os que se salvam? E ele lhe respondeu:
Porfiai por entrar pela porta estreita; porque eu vos digo que muitos procurarão entrar, e não poderão."
Lucas 13:23,24

  • Veja os Destaques e novidades do SUPER DVD Visual Basic (sempre atualizado) : clique e confira !

    Quer migrar para o VB .NET ?

    Quer aprender C# ??

    Quer aprender os conceitos da Programação Orientada a objetos ?

    Quer aprender o gerar relatórios com o ReportViewer no VS 2013 ?

      Gostou ?   Compartilhe no Facebook   Compartilhe no Twitter

    Referências:

    José Carlos Macoratti