Vamos lá
Vamos lá, sobre Map: seu conceito é basicamente uma estrutura chave-valor, ou seja, teremos chaves únicas que são atreladas a determinados valores, bem como o nosso conhecido objeto do javascript mas com algumas diferenças:
Tipos das chaves
No objeto o tipo de dado que as chaves podem assumir estão restritos a números inteiros, strings e símbolos. Já no Map o tipo poe ser praticamente qualquer um (inteiros, strings, arrays, objetos, etc...)
const obj = {
1: "Chave Número Inteiro",
"A": "Chave String",
[Symbol()]: "Chave Símbolo",
[[1, 2, 3]]: "Chave Array" // Erro!
[{ chave: "valor" }]: "Chave Objeto" // Erro!
};
Ordem dos elementos
No objeto a ordem dos elementos não é obrigatóriamente preservada, já nos Maps a ordem é preservada.
const obj = {
"A": "Item 1",
2: "Item 2",
1: "Item 3"
};
console.log(Object.keys(obj)); // ["1", "2", "A"]
Para mais detalhes sobre o Map e suas diferenças é bom dar uma olhada na documentação:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map
Map
Então vamos logo por a mão no código, vamos passar por cada método do Map e explicar a função de cada um, blz?
Definição
Para definir um Map é bem simples, para o nosso exemplo vamos criar um Map que servirá para guardar o nome e o email de diferentes alunos, o nome do aluno será a chave única que estará atrelada ao email do aluno.
// Criando um Map vazio, o primeiro tipo é o tipo da chave
// E o segundo tipo é o tipo do valor.
const alunos = new Map<string, string>();
Adicionando Valores
Agora precisamos adicionar os alunos nessa estrutura, certo? Para isso o Set conta com o método set
que recebe dois parâmetros:
-
Map.set(key, value)
-key
é a chave que queremos atribuir o valorvalue
.
Então digamos que precisamos adicionar 2 alunos novos e seus respectivos emails:
- carlos, carlos@estudante.com
- bianca, bianca@aluna.com
Para isso, basta fazer:
alunos.set("carlos", "carlos@estudante.com");
alunos.set("bianca", "bianca@aluna.com");
Recuperando Valores
Digamos agora que precisamos verificar qual o email de Bianca, para enviar as notas da prova para ela. Para isso podemos usar o método get
do Map;
-
Map.get(key)
-key
é a chave do qual você deseja pegar o valor, é retornado então o valor caso exista, caso não exista é retornadoundefined
.
// Pegando o email dos alunos
const emailBianca = alunos.get("bianca");
console.log(emailBianca); // "bianca@aluna.com"
// Pegando email de um aluno que não está cadastrado
const emailFulano = alunos.get("fulano");
console.log(emailFulano); // undefined
Verificando Valores
Para prevenir esse problema de pegar o valor de uma chave que não existe, nós podemos simplesmente verificar se a chave realmente existe no Map, e para isso podemos usar o método has
:
-
Map.has(key)
- Verifica se no Map existe a chavekey
cadastrada e retornatrue
caso exista,false
caso não exista.
// Verificando se o Fulano está cadastrado
const fulanoExiste = alunos.has("fulano");
console.log(fulanoExiste); // false
Removendo Chaves e Valores
Agora caso seja necessário remover um aluno cadastrado, tanto sua chave (nome) quanto seu valor (email), podemos utilizar o método delete
:
-
Map.delete(key)
- Remove a chavekey
e seu valor atrelado, retornatrue
caso a chave exista e tenha sido removida oufalse
caso a chave não exista e nada tenha sido removido.
// Removendo carlos
const carlosRemovido = alunos.delete("carlos");
console.log(carlosRemovido); // true
// Removendo um aluno que não existe
const fulanoRemovido = alunos.delete("fulano");
console.log(fulanoRemovido); // false
Verificando Tamanho e Limpando
Podemos também utilizar mais uma propriedade e um método bem úteis. A propriedade size
e o método clear
:
-
Map.size
- Retorna um número inteiro contendo a quantidade de chaves presentes no Map. -
Map.clear()
- Limpa todos os valores do Map, ao final o Map não terá mais nada cadastrado nele.
// Verificando o tamanho do nosso map de alunos
// Tinhamos cadastrado 2 alunos no começo e removemos carlos
// anteriormente, então deve ter somente 1 aluno.
const quantidadeDeAlunos = alunos.size;
console.log(quantidadeDeAlunos); // 1
E agora, adivinha? Virou o ano, nova turma e precisamos limpar o Set para poder cadastrar os novos alunos que chegarão, então:
// Limpando nosso set
alunos.clear();
// Verificando o tamanho
console.log(alunos.size); // 0
E é isso, bem simples né? Para mais informações sobre a estrutura de dados e detalhes mais específicos sempre recomendo que leiam a documentação, segue o link:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map
Top comments (0)