image

Acesse bootcamps ilimitados e +650 cursos

50
%OFF
Article image
Gilmar Lima
Gilmar Lima14/08/2023 18:43
Compartilhe

O Poderoso Uso de Arrays no JavaScript: Exemplos e Explicações

  • #JavaScript

Espero que gostem desse artigo e que o conteúdo seja util pra vocês.

Boa leitura!

Os arrays são estruturas de dados fundamentais em praticamente todas as linguagens de programação, e o JavaScript não é exceção. Eles fornecem uma maneira eficiente de armazenar e manipular coleções de elementos relacionados. Neste artigo, exploraremos o poderoso uso de arrays no JavaScript, acompanhado por exemplos de códigos e explicações detalhadas.

Introdução aos Arrays no JavaScript

Em JavaScript, um array é uma coleção ordenada de valores, onde cada valor é acessado por um índice numérico. Os índices começam em 0 para o primeiro elemento, 1 para o segundo e assim por diante. Os arrays podem conter qualquer tipo de valor, incluindo números, strings, objetos e até mesmo outras arrays, tornando-os extremamente flexíveis e versáteis.

Criando Arrays

Existem várias maneiras de criar arrays em JavaScript. Aqui estão alguns exemplos:

// Criando um array vazio
let meuArrayVazio = [];


// Criando um array com valores iniciais
let numeros = [1, 2, 3, 4, 5];
let nomes = ["Alice", "Bob", "Charlie"];


// Criando um array de objetos
let pessoas = [
{ nome: "João", idade: 30 },
{ nome: "Maria", idade: 25 },
{ nome: "Carlos", idade: 40 }
];

Acessando Elementos

Para acessar elementos de um array, você pode usar a notação de colchetes, indicando o índice do elemento que deseja acessar:

console.log(numeros[0]);        // Saída: 1
console.log(nomes[2]);         // Saída: "Charlie"
console.log(pessoas[1].nome);        // Saída: "Maria"

Manipulando Arrays

Os arrays oferecem uma variedade de métodos para manipulação, como adicionar, remover e alterar elementos.

Adicionando Elementos

Método "push" Adiciona o valor ao final do array

Método "unshift" Adiciona o valor no inicio do array

numeros.push(6);       // Adiciona o valor 6 ao final do array "numeros"
nomes.unshift("David");      // Adiciona o valor "David" ao início do array "nomes"

Removendo Elementos

Método "pop" Remove o ultimo valor do array

Método "unshift" Remove o primeiro valor do array

let ultimoNumero = numeros.pop();      // Remove e retorna o último elemento do array "numeros"
let primeiroNome = nomes.shift();      // Remove e retorna o primeiro elemento do array "nomes"

Alterando Elementos

numeros[2] = 9;      // Altera o terceiro elemento do array "numeros" para o valor 9
pessoas[0].idade = 32;       // Altera a idade da primeira pessoa no array "pessoas" para 32

Iterando por um Array

for (let i = 0; i < numeros.length; i++) {
console.log(numeros[i]);
}

Você pode percorrer os elementos de um array usando loops, como o for e o forEach.

Usando o loop for

for (let i = 0; i < numeros.length; i++) {
console.log(numeros[i]);
}

Usando o método forEach

numeros.forEach(function(numero) {
console.log(numero);
});

Transformando Arrays

O JavaScript também oferece métodos poderosos para transformar arrays, como map, filter e reduce.

O método map

O método map permite criar um novo array aplicando uma função a cada elemento do array original:

let quadrados = numeros.map(function(numero) {
return numero * numero;
});

O método filter

O método filter cria um novo array com todos os elementos que passam em um teste definido por uma função:

let numerosPares = numeros.filter(function(numero) {
return numero % 2 === 0;
});

O método reduce

O método reduce executa uma função em cada elemento do array, acumulando um valor ao longo do processo:

let somaTotal = numeros.reduce(function(acumulador, numero) {
return acumulador + numero;
}, 0);

Conclusão

Os arrays são uma parte fundamental da linguagem JavaScript e desempenham um papel essencial no desenvolvimento de aplicativos da web interativos e dinâmicos. Eles oferecem uma variedade de métodos e operações que permitem a manipulação eficaz de coleções de dados. Com o conhecimento sobre como criar, acessar, manipular e transformar arrays, você estará bem equipado para enfrentar desafios de programação complexos e criar código mais limpo e eficiente. Experimente os exemplos e técnicas compartilhados neste artigo para aprimorar suas habilidades de programação em JavaScript.

Compartilhe
Comentários (2)

MR

Marley Ribeiro - 14/08/2023 22:23

Conteúdo show. Com pequenos exemplos

Ótimo para aprendizado.

Roger Carregal
Roger Carregal - 14/08/2023 19:12

Conteúdo bacana!

Bom para reforçar o que já aprendemos nos cursos.