Estruturas de dados em JavaScript

Estruturas de dados em JavaScript

Neste artigo vamos falar sobre estruturas de dados em JavaScript. Cada estrutura é como se fosse uma ferramenta, cada uma tem sua utilidade dependendo da tarefa. Vamos explorar as principais estruturas de dados no JavaScript e ver exemplos de sua utilização.

 

O que você vai ver neste artigo?

 

  • Array
  • Objeto
  • Map
  • Set
  • Pilha
  • Fila
  • Lista Ligada

 

 

Arrays

 

Os arrays são como caixas organizadas onde cada item tem uma posição, que é chamada de índice

 

const frutas = ["maçã", "banana", "laranja"];

frutas.push("uva"); // Adiciona "uva" ao final

console.log(frutas); // ["maçã", "banana", "laranja", "uva"]

console.log(frutas.includes("banana")); // true

 

Objetos

 

Nos objetos, armazenamos as informações organizadas por rótulos e valores.

 

const livro = {

  titulo: "O Senhor dos Anéis",

  autor: "J.R.R. Tolkien",

  paginas: 1178

};

livro.genero = "Fantasia"; // Adicionando nova chave-valor

console.log(livro);

 

Map

 

Com um Map, você pode usar qualquer coisa como chave: números, strings ou até objetos.

 

const estoque = new Map();

estoque.set("maçã", 10);

estoque.set("banana", 5);

console.log(estoque.get("maçã")); // 10

estoque.delete("banana");

console.log(estoque.has("banana")); // false

 

Set

 

Ideal para garantir que não haja duplicatas na sua coleção de itens.

 

const visitantes = new Set();

visitantes.add("Alice");

visitantes.add("Bob");

visitantes.add("Alice"); // Ignorado, pois já existe

console.log(visitantes); 

 

Pilha

 

As pilhas, também chamadas de Stack, são usadas quando você precisa gerenciar ações recentes, como em um editor com "desfazer/refazer".

 

class Pilha {

  constructor() {

    this.itens = [];

  }

  push(item) {

    this.itens.push(item); // Adiciona no topo

  }

  pop() {

    return this.itens.pop(); // Remove do topo

  }

}

const historico = new Pilha();

historico.push("Página 1");

historico.push("Página 2");

console.log(historico.pop()); 

 

Fila

 

A fila, também conhecida como Queue, é usada quando a ordem de chegada é importante, como em filas de banco.

 

class Fila {

  constructor() {

    this.itens = [];

  }

  enqueue(item) {

    this.itens.push(item); // Adiciona no final

  }

  dequeue() {

    return this.itens.shift(); // Remove do início

  }

}

const atendimento = new Fila();

atendimento.enqueue("Cliente 1");

atendimento.enqueue("Cliente 2");

console.log(atendimento.dequeue()); 

 

Lista Ligada

 

A lista ligada, ou Linked List, é uma estrutura menos comum no dia a dia. Elas são ótimas para manipular dados dinamicamente.

 

class Node {

  constructor(valor) {

    this.valor = valor;

    this.proximo = null;

  }

}

class ListaLigada {

  constructor() {

    this.cabeca = null;

  }

  adicionar(valor) {

    const novoNo = new Node(valor);

    if (!this.cabeca) {

      this.cabeca = novoNo;

    } else {

      let atual = this.cabeca;

      while (atual.proximo) {

        atual = atual.proximo;

      }

      atual.proximo = novoNo;

    }

  }

  imprimir() {

    let atual = this.cabeca;

    while (atual) {

      console.log(atual.valor);

      atual = atual.proximo;

    }

  }

}

const lista = new ListaLigada();

lista.adicionar(10);

lista.adicionar(20);

lista.imprimir(); 

 

Quando Utilizar?

 

Com tantas estruturas a nossa disposição, você deve estar se perguntando quando usar cada uma delas. Segue uma explicação de como elas podem ser utilizadas.

 

Array: Sempre que precisar de uma lista ordenada simples.

Objeto: Para representar coisas com atributos.

Map: Quando precisar de chaves não convencionais ou manter a ordem de inserção.

Set: Quando precisar de valores únicos.

Pilha: Para desfazer ações ou processar dados no estilo "último entra, primeiro sai".

Fila: Para filas de processamento.

Lista Ligada: Quando precisar adicionar/remover elementos dinamicamente em posições específicas.

 

 

Está começando e deseja saber o que precisa estudar de HTML e JavaScript? Não deixe de conferir os roteiros de estudo de HTML e JavaScript!. São dezenas de conteúdos para você melhorar suas habilidades.

Roteiro de estudos - HTML e CSS

Roteiro de estudos - Javascript

 

Outros conteudos que podem ser de seu interesse

Operações de agregação com JavaScript
15/03/2020JAVASCRIPT

Operações de agregação com JavaScript

Veja como extrair de um array a soma, média, maior e menor valor

Saiba mais...
Geolocalização do usuário
11/01/2020JAVASCRIPT

Geolocalização do usuário

Veja como obter o IP e a localização do visitante do seu site utilizando JavaScript

Saiba mais...

Conteúdo sobre banco de dados sem complicação!