review-javascript-arrays
Voltar à Trilha

Revisão de Arrays em JavaScript

Noções básicas sobre Array em JavaScript

  • Definição: Um array JavaScript é uma coleção ordenada de valores, cada um identificado por um índice numérico. Os valores em um array JavaScript podem ser de diferentes tipos de dados, incluindo números, strings, booleanos, objetos e até outros arrays. Arrays são contíguos na memória, o que significa que todos os elementos são armazenados em um único bloco contínuo de locais de memória, permitindo indexação eficiente e acesso rápido aos elementos pelo seu índice.
const developers = ["Jessica", "Naomi", "Tom"];
  • Acessando Elementos de Arrays: Para acessar elementos de um array, você precisará referenciar o array seguido pelo número do índice dentro de colchetes. Arrays em JavaScript são indexados a partir do zero, o que significa que o primeiro elemento está no índice 0, o segundo elemento está no índice 1, etc. Se você tentar acessar um índice que não existe no array, o JavaScript retornará undefined.
const developers = ["Jessica", "Naomi", "Tom"];
console.log(developers[0]) // "Jessica"
console.log(developers[1]) // "Naomi"

console.log(developers[10]) // undefined
  • Propriedade length: Esta propriedade é usada para retornar o número de itens em um array.
const developers = ["Jessica", "Naomi", "Tom"];
console.log(developers.length) // 3
  • Atualizando Elementos em um Array: Para atualizar um elemento em um array, você usa o operador de atribuição (=) para atribuir um novo valor ao elemento em um índice específico.
const fruits = ['apple', 'banana', 'cherry'];
fruits[1] = 'blueberry';

console.log(fruits); // ['apple', 'blueberry', 'cherry']

Arrays Bidimensionais

  • Definition: A two-dimensional array is essentially an array of arrays. É usado para representar dados que possuem uma estrutura natural em grade, como um tabuleiro de xadrez, uma planilha ou pixels em uma imagem. Para acessar um elemento em um array bidimensional, você precisa de dois índices: um para a linha e um para a coluna.
const chessboard = [
    ['R', 'N', 'B', 'Q', 'K', 'B', 'N', 'R'],
    ['P', 'P', 'P', 'P', 'P', 'P', 'P', 'P'],
    [' ', ' ', ' ', ' ', ' ', ' ', ' ', ' '],
    [' ', ' ', ' ', ' ', ' ', ' ', ' ', ' '],
    [' ', ' ', ' ', ' ', ' ', ' ', ' ', ' '],
    [' ', ' ', ' ', ' ', ' ', ' ', ' ', ' '],
    ['p', 'p', 'p', 'p', 'p', 'p', 'p', 'p'],
    ['r', 'n', 'b', 'q', 'k', 'b', 'n', 'r']
];

console.log(chessboard[0][3]); // "Q"

Desestruturação de Array

  • Definição: Desestruturação de array é um recurso do JavaScript que permite extrair valores de arrays e atribuí-los a variáveis de uma forma mais concisa e legível. Ele oferece uma sintaxe conveniente para desempacotar elementos de array em variáveis distintas.
const fruits = ["apple", "banana", "orange"];

const [first, second, third] = fruits;

console.log(first); // "apple"
console.log(second); // "banana"
console.log(third); // "orange"
  • Sintaxe Rest: Isso permite capturar os elementos restantes de um array que não foram desestruturados em um novo array.
const fruits = ["apple", "banana", "orange", "mango", "kiwi"];
const [first, second, ...rest] = fruits;

console.log(first); // "apple"
console.log(second); // "banana"
console.log(rest); // ["orange", "mango", "kiwi"]

Métodos Comuns de Array

  • Método push(): Este método é usado para adicionar elementos ao final do array e retornará o novo comprimento.
const desserts = ["cake", "cookies", "pie"];
desserts.push("ice cream");

console.log(desserts); // ["cake", "cookies", "pie", "ice cream"];
  • Método pop(): Este método é usado para remover o último elemento de um array e retornará esse elemento removido. Se o array estiver vazio, o valor retornado será undefined.
const desserts = ["cake", "cookies", "pie"];
desserts.pop();

console.log(desserts); // ["cake", "cookies"];
  • Método shift(): Este método é usado para remover o primeiro elemento de um array e retornar esse elemento removido. Se o array estiver vazio, o valor retornado será undefined.
const desserts = ["cake", "cookies", "pie"];
desserts.shift();

console.log(desserts); // ["cookies", "pie"];
  • Método unshift(): Este método é usado para adicionar elementos ao início do array e retornará o novo comprimento.
const desserts = ["cake", "cookies", "pie"];
desserts.unshift("ice cream");

console.log(desserts); // ["ice cream", "cake", "cookies", "pie"];
  • Método indexOf(): Este método é útil para encontrar o primeiro índice de um elemento específico dentro de um array. Se o elemento não puder ser encontrado, ele retornará -1.
const fruits = ["apple", "banana", "orange", "banana"];
const index = fruits.indexOf("banana");

console.log(index); // 1
console.log(fruits.indexOf("not found")); // -1
  • Método splice(): Este método é usado para adicionar ou remover elementos de qualquer posição em um array. O valor retornado pelo método splice() será um array dos itens removidos do array. Se nada for removido, então um array vazio será retornado. Este método irá modificar o array original, alterando-o no local em vez de criar um novo array. O primeiro argumento especifica o índice no qual começar a modificar o array. O segundo argumento é o número de elementos que você deseja remover. Os argumentos seguintes são os elementos que você deseja adicionar.
const colors = ["red", "green", "blue"];
colors.splice(1, 0, "yellow", "purple");

console.log(colors); // ["red", "yellow", "purple", "green", "blue"]
  • Método includes(): Este método é usado para verificar se um array contém um valor específico. Este método retorna true se o array contém o elemento especificado e false caso contrário.
const programmingLanguages = ["JavaScript", "Python", "C++"];

console.log(programmingLanguages.includes("Python")); // true
console.log(programmingLanguages.includes("Perl")); // false
  • Método concat(): Este método cria um novo array ao mesclar dois ou mais arrays.
const programmingLanguages = ["JavaScript", "Python", "C++"];
const newList = programmingLanguages.concat("Perl");

console.log(newList); // ["JavaScript", "Python", "C++", "Perl"]
  • Método slice(): Este método retorna um novo array contendo uma cópia superficial de uma parte do array original, especificada pelos índices de início e fim. O novo array contém referências aos mesmos elementos do array original (não duplicatas). Isso significa que, se os elementos forem primitivos (como números ou strings), os valores são copiados; mas se os elementos forem objetos ou arrays, as referências são copiadas, não os próprios objetos.
const programmingLanguages = ["JavaScript", "Python", "C++"];
const newList = programmingLanguages.slice(1);

console.log(newList); // ["Python", "C++"]
  • Spread Syntax: A spread syntax é usada para criar cópias superficiais de um array.
const originalArray = [1, 2, 3];
const shallowCopiedArray = [...originalArray];

shallowCopiedArray.push(4);

console.log(originalArray); // [1, 2, 3]
console.log(shallowCopiedArray); // [1, 2, 3, 4]
  • Método split(): Este método divide uma string em um array de substrings e especifica onde cada divisão deve acontecer com base em um separador fornecido. Se nenhum separador for fornecido, o método retorna um array contendo a string original como um único elemento.
const str = "hello";
const charArray = str.split("");

console.log(charArray); // ["h", "e", "l", "l", "o"]
  • Método reverse(): Este método inverte um array no local.
const desserts = ["cake", "cookies", "pie"];
console.log(desserts.reverse()); // ["pie", "cookies", "cake"]
  • Método join(): Este método concatena todos os elementos de um array em uma única string, com cada elemento separado por um separador especificado. Se nenhum separador for fornecido ou uma string vazia ("") for usada, os elementos serão unidos sem nenhum separador.
const reversedArray = ["o", "l", "l", "e", "h"];
const reversedString = reversedArray.join("");

console.log(reversedString); // "olleh"