Dando continuidade a minha série de artigos sobre TypeScript, hoje eu irei apresentar o map. Caso você tenha interesse em ler os primeiros artigos dessa serie, segue o link de cada um deles abaixo:
- TypeScript: Operadores lógicos
- TypeScript: brincando com Arduino
- TypeScript: Tipagem
- TypeScript: operadores aritméticos
- TypeScript 3.4: O que veio de novidade?
- TypeScript: Enums
- TypeScript: conhecendo o type never
Bom, para quem não conhece o Map ele é uma das novidades do ES6, ele nos permite trabalhar com o conceito de coleção com chave e valor. Sua sintaxe é bem simples, basta instanciar ele e utilizar o get e o set para manipular os seus valores. Para ficar mais claro, vamos a alguns exemplos práticos:
Para criar um novo map basta utilizar o operador new:
let exMap = new Map();
E para popular ele nós devemos utilizar o operador set:
exMap.set("casa", 2);
Agora para resgatar um valor, nós podemos utilizar o get:
exMap.get('casa') // 2
Mas como eu passei acima, o map nos permite trabalhar com coleções. Abaixo você tem um trecho de código com um exemplo de um map com uma coleção.
let languages = new Map(); languages.set("C#", 1); languages.set("JavaScript", 2); languages.set("PHP", 3); languages.forEach((value: string, key: number) => { console.log(key, value); });
Resultado do código acima:

Além dos operadores get e set, o map tem outros operadores que nos permitem: deletar uma chave, limpar todos os registros de uma coleção e verificar a quantidade de itens inseridos. Abaixo você tem um trecho de código demonstrando cada um deles:

Bem legal né?
Bom, a ideia desse artigo era demonstrar mais uma das funcionalidades do TS que podem nos ajudar no nosso dia dia 😉
Espero que tenham gostado e até um próximo artigo pessoal.
Fonte: https://medium.com/@programadriano/dica-r%C3%A1pida-typescript-conhecendo-o-ts-ignore
Gostou deste artigo? Deixe seu comentário abaixo!