diff options
Diffstat (limited to 'files')
15 files changed, 1324 insertions, 0 deletions
diff --git a/files/pt-br/web/javascript/reference/global_objects/map/@@iterator/index.md b/files/pt-br/web/javascript/reference/global_objects/map/@@iterator/index.md new file mode 100644 index 0000000000..52195c4cd3 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/@@iterator/index.md @@ -0,0 +1,86 @@ +--- +title: Map.prototype[@@iterator]() +slug: Web/JavaScript/Reference/Global_Objects/Map/@@iterator +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.@@iterator +--- +{{JSRef}} + + +<p class="seoSummary">O valor inicial da propriedade <strong><code>@@iterator</code></strong> + é o mesmo objeto função que o valor inicial do método {{jsxref("Map.prototype.entries()", "entries")}} +</p> + + +{{EmbedInteractiveExample("pages/js/map-prototype-@@iterator.html")}} + +## Sintaxe + +```js +myMap[Symbol.iterator] +``` + +### Valor retornado + +A função iterativa do map, que é a {{jsxref("Map.prototype.entries()", "entries()")}} por padrão + +## Exemplos + +### Usando o \[@@iterator]\() + +```js +const myMap = new Map() +myMap.set('0', 'foo') +myMap.set(1, 'bar') +myMap.set({}, 'baz') + +const mapIter = myMap[Symbol.iterator]() + +console.log(mapIter.next().value) // ["0", "foo"] +console.log(mapIter.next().value) // [1, "bar"] +console.log(mapIter.next().value) // [Object, "baz"] +``` + +### Usando o \[@@iterator]\() com for..of + +```js +const myMap = new Map() +myMap.set('0', 'foo') +myMap.set(1, 'bar') +myMap.set({}, 'baz') + +for (const entry of myMap) { + console.log(entry) +} +// ["0", "foo"] +// [1, "bar"] +// [{}, "baz"] + +for (const [key, value] of myMap) { + console.log(`${key}: ${value}`) +} +// 0: foo +// 1: bar +// [Object]: baz +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map.prototype.entries()")}} +- {{jsxref("Map.prototype.keys()")}} +- {{jsxref("Map.prototype.values()")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/@@species/index.md b/files/pt-br/web/javascript/reference/global_objects/map/@@species/index.md new file mode 100644 index 0000000000..dcae0f1697 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/@@species/index.md @@ -0,0 +1,54 @@ +--- +title: get Map[@@species] +slug: Web/JavaScript/Reference/Global_Objects/Map/@@species +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property +browser-compat: javascript.builtins.Map.@@species +--- +{{JSRef}} + +O Acessor de propriedade **`Map[@@species]`** retorna o construtor do `Map`. + +## Descrição + +O acessor `species` retorna o valor padrão do construtor dos objetos `Map` +Subclasses de construtores podem sobrescrever isso para mudar o construtor atribuído. + + +## Exemplos + +### Species em objetos ordinários + +A propriedade *species* retorna a função padrão do construtor, que é o construtor `Map` para objetos `Map`. + +```js +Map[Symbol.species]; // function Map() +``` + +### Species em objetos derivados + +Em uma objeto derivado (e.g. seu custom map `MyMap`), a `specie` do `MyMap` é o construtor do `MyMap`. +Porém, você deve querer sobrescrever isso, para retornar o objeto `Map` pai nos métodos derivados de sua classe. + +```js +class MyMap extends Map { + // Overwrite MyMap species to the parent Map constructor + static get [Symbol.species]() { return Map; } +} +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} +- {{jsxref("Symbol.species")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/@@tostringtag/index.md b/files/pt-br/web/javascript/reference/global_objects/map/@@tostringtag/index.md new file mode 100644 index 0000000000..7e65aa299c --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/@@tostringtag/index.md @@ -0,0 +1,43 @@ +--- +title: Map.prototype[@@toStringTag] +slug: Web/JavaScript/Reference/Global_Objects/Map/@@toStringTag +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property + - Prototype + - Reference +browser-compat: javascript.builtins.Map.@@toStringTag +--- +{{JSRef}} + +A propriedade **`Map[@@toStringTag]`** tem o valor inicial do `Map`. + +{{EmbedInteractiveExample("pages/js/map-prototype-@@tostringtag.html","shorter")}}{{js_property_attributes(0,0,1)}} + +## Sintaxe + +```js +Map[Symbol.toStringTag] +``` + +## Exemplos + +### Usando o toStringTag + +```js +Object.prototype.toString.call(new Map()) // "[object Map]" +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Symbol.toStringTag")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/clear/index.md b/files/pt-br/web/javascript/reference/global_objects/map/clear/index.md new file mode 100644 index 0000000000..273b6a4ce8 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/clear/index.md @@ -0,0 +1,57 @@ +--- +title: Map.prototype.clear() +slug: Web/JavaScript/Reference/Global_Objects/Map/clear +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.clear +--- +{{JSRef}} + +O método **`clear()`** remove todos os elementos de um objeto `Map`. + +{{EmbedInteractiveExample("pages/js/map-prototype-clear.html")}} + +## Sintaxe + +```js +clear() +``` + +### Valor retornado + +{{jsxref("undefined")}}. + +## Exemplos + +### Usando o clear() + +```js +var myMap = new Map(); +myMap.set('bar', 'baz'); +myMap.set(1, 'foo'); + +myMap.size; // 2 +myMap.has('bar'); // true + +myMap.clear(); + +myMap.size; // 0 +myMap.has('bar') // false +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/delete/index.md b/files/pt-br/web/javascript/reference/global_objects/map/delete/index.md new file mode 100644 index 0000000000..355cd1d4dd --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/delete/index.md @@ -0,0 +1,57 @@ +--- +title: Map.prototype.delete() +slug: Web/JavaScript/Reference/Global_Objects/Map/delete +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.delete +--- +{{JSRef}} + +O método **`delete()`** remove o elemento específico do objeto `Map` através de sua chave. + +{{EmbedInteractiveExample("pages/js/map-prototype-delete.html")}} + +## Sintaxe + +```js +delete(key) +``` + +### Parâmetros + +- `key` + - : A chave do elemento que será removido do objeto `Map`. + +### Valor retornado + +`true` se o elemento do `Map` existia e foi removido, ou +`false` se o elemento não existe. + +## Exemplos + +### Usando o delete() + +```js +var myMap = new Map(); +myMap.set('bar', 'foo'); + +myMap.delete('bar'); // Retorna true. Removido com sucesso. +myMap.has('bar'); // Retorna false. O elemento "bar" não está mais presente +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/entries/index.md b/files/pt-br/web/javascript/reference/global_objects/map/entries/index.md new file mode 100644 index 0000000000..f638f1973f --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/entries/index.md @@ -0,0 +1,57 @@ +--- +title: Map.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Map/entries +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype +browser-compat: javascript.builtins.Map.entries +--- +{{JSRef}} + +O método **`entries()`** retorna um novo objeto **[iterador](/en-US/docs/Web/JavaScript/Guide/Iterators_and_Generators)** que contém os pares `[key, value]` de cada elemento no objeto `Map` na ordem em que foram inseridos. Nesse caso em particular, esse objeto iterador também é iterativo. então o loop for-of pode ser usado. Quando o protocolo `[Symbol.iterator]` é usado, ele retorna uma função que, quando invocada, retorna o própio iterador. + +{{EmbedInteractiveExample("pages/js/map-prototype-entries.html")}} + +## Sintaxe + +```js +entries() +``` + +### Valor retornado + +Um novo objeto iterador {{jsxref("Map")}}. + +## Exemplos + +### Usando o entries()] + +```js +let myMap = new Map() +myMap.set('0', 'foo') +myMap.set(1, 'bar') +myMap.set({}, 'baz) + +let mapIter = myMap.entries() + +console.log(mapIter.next().value) // ["0", "foo"] +console.log(mapIter.next().value) // [1, "bar"] +console.log(mapIter.next().value) // [Object, "baz"] +``` + +## Especificação + +{{Specifications}} + +## Compatibilidade com navegadores + +{{compat}} + +## Veja também + +- {{jsxref("Map.prototype.keys()")}} +- {{jsxref("Map.prototype.values()")}}
\ No newline at end of file diff --git a/files/pt-br/web/javascript/reference/global_objects/map/foreach/index.md b/files/pt-br/web/javascript/reference/global_objects/map/foreach/index.md new file mode 100644 index 0000000000..8cc2df5357 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/foreach/index.md @@ -0,0 +1,108 @@ +--- +title: Map.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Map/forEach +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.forEach +--- +{{JSRef}} + +O método **`forEach()`** executa a função que foi provida uma vez para cada par de chave-valor no objeto `Map`, na order em que foram inseridos. + +{{EmbedInteractiveExample("pages/js/map-prototype-foreach.html")}} + +## Sintaxe + +```js +// Arrow function +forEach(() => { ... } ) +forEach((value) => { ... } ) +forEach((value, key) => { ... } ) +forEach((value, key, map) => { ... } ) + +// função de Callback +forEach(callbackFn) +forEach(callbackFn, thisArg) + +// função de callback inline +forEach(function callbackFn() { ... }) +forEach(function callbackFn(value) { ... }) +forEach(function callbackFn(value, key) { ... }) +forEach(function callbackFn(value, key, map) { ... }) +forEach(function callbackFn(value, key, map) { ... }, thisArg) +``` + +### Parâmetros + +- `callbackFn` + - : A função que será executada em cada entrada do map. Ela receberá os seguintes argumentos: + - `value` {{Optional_Inline}} + - : O valor de cada iteração. + - `key` {{Optional_Inline}} + - : A chave de cada iteração. + - `map` {{Optional_Inline}} + - : O map que está sendo iterado. +- `thisArg` {{Optional_Inline}} + - : O valor para usar como `this` quando o callback for executado. + +### Valor retornado + +{{jsxref("undefined")}}. + +## Descrição + +O método `forEach` executa o `callback` fornecido uma vez para cada chave do map +que realmente existe. +Ele não é invocado para chaves que foram deletadas. +Porém, é executado para valores que estão presentes mesmo tendo o valor `undefined`. + +O `callback` é invocado com **três argumentos**: + +- O `value` de entrada +- A `key` de entrada +- o **objeto `Map`** que está sendo percorrido + +Se o parâmetro `thisArg` for fornecido para o `forEach`, ele será passado para o +`callback` quando for invocado, para ser usado como o valor de `this`. De outra forma, +o valor `undefined` será usado como valor de `this`. O valor de `this` será +observado pelo `callback` em última análise e será determinado de acordo com +[as regras usuais para a determinação do `this` visto por uma função](/pt-BR/docs/Web/JavaScript/Reference/Operators/this). + +Cada valor será visitado uma vez, exceto no caso em que foram deletados e adicionados novamente +antes do `forEach` ser finalizado. O `callback` não é invocado para valores que foram removidos antes de +terem sidos visitados. Novos valores adicionados antes do `forEach` terminar serão visitados. + +## Exemplos + +### Exibindo o conteúdo de um objeto Map + +O código a seguir imprime uma linha para cada elemento do objeto `Map`: + +```js +function logMapElements(value, key, map) { + console.log(`map.get('${key}') = ${value}`) +} +new Map([['foo', 3], ['bar', {}], ['baz', undefined]]).forEach(logMapElements) +// logs: +// "map.get('foo') = 3" +// "map.get('bar') = [object Object]" +// "map.get('baz') = undefined" +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Array.prototype.forEach()")}} +- {{jsxref("Set.prototype.forEach()")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/get/index.md b/files/pt-br/web/javascript/reference/global_objects/map/get/index.md new file mode 100644 index 0000000000..caebad9289 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/get/index.md @@ -0,0 +1,61 @@ +--- +title: Map.prototype.get() +slug: Web/JavaScript/Reference/Global_Objects/Map/get +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.get +--- +{{JSRef}} + +O método **`get()`** retorna um elemento específico do objeto `Map`. Se o valor +associado à chave for um objeto, será retornado a referência do objeto e qualquer mudança no mesmo +irá afetar o valor que está dentro do objeto `Map`. + +{{EmbedInteractiveExample("pages/js/map-prototype-get.html")}} + +## Sintaxe + +```js +get(key) +``` + +### Parâmetros + +- `key` + - : A chave do elemento que será retornado do objeto `Map`. + +### Valor retornado + +O elemento associado à chave especificada, ou {{jsxref("undefined")}} se +a chave não puder ser encontrada no objeto `Map`. + +## Exemplos + +### Usando o get() + +```js +let myMap = new Map(); +myMap.set('bar', 'foo'); + +myMap.get('bar'); // Returns "foo" +myMap.get('baz'); // Returns undefined +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} +- {{jsxref("Map.prototype.set()")}} +- {{jsxref("Map.prototype.has()")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/has/index.md b/files/pt-br/web/javascript/reference/global_objects/map/has/index.md new file mode 100644 index 0000000000..f3b072f35e --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/has/index.md @@ -0,0 +1,58 @@ +--- +title: Map.prototype.has() +slug: Web/JavaScript/Reference/Global_Objects/Map/has +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.has +--- +{{JSRef}} + +O método **`has()`** retorna um booleano indicando se o elemento com a chave especificada existe ou não. + +{{EmbedInteractiveExample("pages/js/map-prototype-has.html")}} + +## Sintaxe + +```js +has(key) +``` + +### Parâmetros + +- `key` + - : A chave do elemento que será testado no objeto `Map`. + +### Valor retornado + +`true` se o elemento com a chave especificada existe no objeto `Map`, de outra forma será retornado `false`. + +## Exemplos + +### Usando has() + +```js +let myMap = new Map() +myMap.set('bar', "foo") + +myMap.has('bar') // retorna true +myMap.has('baz') // retorna false +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores. + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} +- {{jsxref("Map.prototype.set()")}} +- {{jsxref("Map.prototype.get()")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/index.md b/files/pt-br/web/javascript/reference/global_objects/map/index.md new file mode 100644 index 0000000000..2564a38409 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/index.md @@ -0,0 +1,451 @@ +--- +title: Map +slug: Web/JavaScript/Reference/Global_Objects/Map +tags: + - Class + - ECMAScript 2015 + - JavaScript + - Map + - Reference + - Polyfill +browser-compat: javascript.builtins.Map +--- +{{JSRef}} + +O objeto **`Map`** contém pares de chave-valor e lembra a ordem original da inserção das chaves. Qualquer valor (objetos e {{glossary("Primitive", "valores primitivos")}}) podem ser usados como chave ou valor. + +{{EmbedInteractiveExample("pages/js/map.html", "taller")}} + +## Descrição + +Um objeto `Map` itera seus elementos na order da inserção - um loop {{jsxref("Statements/for...of", "for...of")}} retorna um array de `[key, value]` para cada iteração + +### Igualdade de chaves + +- A igualdade de chaves é baseada no algoritimo [`sameValueZero`](/pt-BR/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value-zero_equality). + +- O {{jsxref("NaN")}} é considerado o mesmo que o `NaN` (apesar de `NaN !== NaN`) e todos os outros valores são considerados de acordo com a semântica do operador `===`. + +- Na especificação atual do ECMAScript, `-0` e `+0` são considerados iguais, embora não tenha sido nos esboços anteriores. Veja _"Equivalência de valor entre -0 e 0"_ em [Compatibilidade com navegadores](#browser_compatibility) para mais detalhes; + +### Objetos vs. Maps + +Um {{jsxref("Object")}} é similar o `Map` - ambos permitem que valores sejam definidos a chaves, retornar esses valores, remover as chaves, e detectar se algo está armazenado na chave. Por esta razão (e porque não existem outras alternativas construídas), o `Objeto` tem sido usado como `Map` historicamente. + +Porém, existem diferenças importantes que fazem o `Map` ser preferido em alguns casos: + +<table class="standard-table"> + <thead> + <tr> + <th scope="row"></th> + <th scope="col">Map</th> + <th scope="col">Objeto</th> + </tr> + </thead> + <tbody> + <tr> + <th scope="row">Chaves acidentais</th> + <td> + O <code>Map</code> não contém nenhuma chave por padrão. Ele só contém o que é definido explicitamente nele. + </td> + <td> + <p> + Um <code>Objeto</code> tem um prototype, então ele contém por padrão algumas chaves que podem conflitar com suas próprias chaves se você não for cuidadoso. + </p> + <div class="notecard note"> + <p> + <strong>Note:</strong> Apartir do ES5, isso pode ser ignorado com o {{jsxref("Object.create", "Object.create(null)")}}, mas isso raramente é feito. + </p> + </div> + </td> + </tr> + <tr> + <th scope="row">Tipos das chaves</th> + <td> + As chaves do <code>Map</code> podem ser qualquer valor (incluindo funções, objetos, ou qualquer outro tipo primitivo). + </td> + <td> + A chave de um <code>Objeto</code> deve ser uma {{jsxref("String")}} ou um {{jsxref("Symbol")}}. + </td> + </tr> + <tr> + <th scope="row">Ordem das chaves</th> + <td> + <p> + As chaves dentro do <code>Map</code> são ordenadas de forma simples, de maneira direta: O objeto <code>Map</code> itera suas entradas, chaves, e valor na ordem em que foram inseridas. + </p> + </td> + <td> + <p> + Embora as chaves de um <code>Objeto</code> comum hoje sejam ordenadas, nem sempre esse foi o caso, e a ordem é complexa. Como resultado é melhor não confiar na ordem das propriedades. + </p> + <p> + A ordem foi definida primeiramente para suas próprias propriedades apenas no ECMAScript 2015; no ECMAScript 2020 a ordem definida é por propriedades herdadas também. + Veja o + <a href="https://tc39.es/ecma262/#sec-ordinaryownpropertykeys" + >OrdinaryOwnPropertyKeys</a + > + e + <a href="https://tc39.es/ecma262/#sec-enumerate-object-properties"> + numerateObjectProperties + </a> + operações de especificações abstraídas. Mas note que nenhum mecanismo itera <strong>todas</strong> as propriedades do objeto; cada um dos vários mecanismos incluem diferentes subconjuntos de propriedades. + ({{jsxref("Statements/for...in", + "for-in")}} + incluí apenas propriedades enumeráveis com chaves do tipo string + {{jsxref("Object.keys")}} inclui apenas chaves próprias e enumeráveis do tipo string; + {{jsxref("Object.getOwnPropertyNames")}} incluí o próprio, e propriedades com chaves do tipo string, mesmo que não enumeráveis + {{jsxref("Object.getOwnPropertySymbols")}} faz o mesmo só que para + propriedades <code>Símbolos</code> como chave, etc.) + </p> + </td> + </tr> + <tr> + <th scope="row"><p>Tamanho</p></th> + <td> + O número de items dentro de um <code>Map</code> + é facilmente retornado pela propriedade {{jsxref("Map.prototype.size", "size")}} + </td> + <td> + O número de items dentro de um <code>Objeto</code> deve ser determinado manualmente + </td> + </tr> + <tr> + <th scope="row">Iteração</th> + <td> + Um <code>Map</code> é {{jsxref("Iteration_protocols", "iterável")}}, então ele pode ser diretamente iterável + </td> + <td> + <p> + O <code>Objeto</code> não implementa o <a + href="/pt-BR/docs/Web/JavaScript/Reference/Iteration_protocols#the_iterable_protocol" + >protocolo de iteração</a>, e os objetos não podem ser iterados diretamente usando o <a href="/pt-BR/docs/Web/JavaScript/Reference/Statements/for...of" + >for...of</a + > (por padrão). + </> + <div class="notecard note"> + <p><strong>Nota:</strong></p> + <ul> + <li> + Um objeto pode implementar o protocolo de iteração, ou pode ser iterado usando o <a + href="/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Object/keys" + ><code>Object.keys</code></a + >ou<a + href="/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Object/entries" + ><code>Object.entries</code></a + >. + </li> + <li> + A declaração <a href="/pt-BR/docs/Web/JavaScript/Reference/Statements/for...in" + >for...in</a> + permite que você itere pela propriedades enumeráveis de um objeto. + </li> + </ul> + </div> + </td> + </tr> + <tr> + <th scope="row">Performance</th> + <td> + <p> + Perfoma melhor em cenários envolvendo adições e remoções frequentes em pares chave-valor. + </p> + </td> + <td> + <p> + Não é otimizado para adições e remoções frequentes de pares chave-valor. + </p> + </td> + </tr> + <tr> + <th scope="row">Serialização e análise sintática</th> + <td> + <p>Não há suporte nativo para a serialização ou análise sintática.</p> + <p> + (Mas você pode construir sua própria serialização e conversão para o <code>Map</code> usando o + {{jsxref("JSON.stringify()")}} como o argumento <em>replacer</em>, + e usando o {{jsxref("JSON.parse()")}} com o argumento <em>reviver</em>. + Veja a questão no Stack Overflow <a href="https://stackoverflow.com/q/29085197/" + >How do you JSON.stringify an ES6 Map?</a + >). + </p> + </td> + <td> + <p> + Suporte nativo para serialização de {{jsxref("Object", "Objeto")}} para JSON, usando {{jsxref("JSON.stringify()")}}. + </p> + <p> + Suporte nativo para conversão de JSON para {{jsxref("Object", "Objeto")}} usando {{jsxref("JSON.parse()")}}. + </p> + </td> + </tr> + </tbody> +</table> + +### Definindo propriedades no objeto + +Definir propriedades no objeto também funciona em objetos `Map`, e pode causar um confusão considerável. + +Portanto, isso aparenta funcionar de certa forma: + +```js example-bad +const wrongMap = new Map() +wrongMap['bla'] = 'blaa' +wrongMap['bla2'] = 'blaaa2' + +console.log(wrongMap) // Map { bla: 'blaa', bla2: 'blaaa2' } +``` + +Mas esse jeito de definir propriedades não interage com a estrura de dados do `Map`. Dessa forma é usada a implementação genérica do objeto. O valor 'bla' não é armazenado no `Map` para queries. Outras operaçãoes nos dados irão falhar. + +```js example-bad +wrongMap.has('bla') // false +wrongMap.delete('bla') // false +console.log(wrongMap) // Map { bla: 'blaa', bla2: 'blaaa2' } +``` + +A maneira correta para armazenar dados dentro do `Map` é através do `set(key,value)` + +```js example-good +const contacts = new Map() +contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"}) +contacts.has('Jessie') // true +contacts.get('Hilary') // undefined +contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"}) +contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"} +contacts.delete('Raymond') // false +contacts.delete('Jessie') // true +console.log(contacts.size) // 1 +``` + +## Construtor + +- {{jsxref("Map/Map", "Map()")}} + - : Cria um novo objeto `Map`. + +## propriedades estáticas + +- {{jsxref("Map.@@species", "get Map[@@species]")}} + - : A função do construtor que é usada para criar apartir de objetos. + +## propriedades da instância + +- {{jsxref("Map.prototype.size")}} + - : Retorna o número de pares chave/valor no objeto `Map`. + +## Métodos da instância + +- {{jsxref("Map.prototype.clear()")}} + - : Remove todos os pares chave/valor do objeto `Map`. +- {{jsxref("Map.delete", "Map.prototype.delete(<var>key</var>)")}} + - : Retorna `true` se o elemento no objeto `Map` existia e tenha sido removido, ou `false` + se o elemento não existia. `Map.prototype.has(key)` irá retornar `false` após isso. +- {{jsxref("Map.get", "Map.prototype.get(<var>key</var>)")}} + - : Retorna o valor associado à chave, ou `undefined` se não há nada. +- {{jsxref("Map.has", "Map.prototype.has(<var>key</var>)")}} + - : Retorna uma asserção booleana se o valor tenha sido associado à chave no objeto `Map` ou não. +- {{jsxref("Map.set", "Map.prototype.set(<var>key</var>, <var>value</var>)")}} + - : Define o `valor` para a `chave` no objeto `Map`. Retorna o objeto `Map` + +### Métodos iterativos + +- {{jsxref("Map.@@iterator", "Map.prototype[@@iterator]()")}} + - : Retorna um novo objeto iterador que contèm **um array de `[chave, valor]`** para cada elemento do objeto `Map` na ordem em que foram inseridos. +- {{jsxref("Map.prototype.keys()")}} + - : Retorna um novo objeto iterador que contèm as **chaves** de cada elemento do objeto `Map` na ordem em que foram inseridos. +- {{jsxref("Map.prototype.values()")}} + - : Retorna um novo objeto iterador que contém os **valores** para cada elemento do objeto `Map` na ordem em que foram inseridos. +- {{jsxref("Map.prototype.entries()")}} + - : Retorna um novo objeto iterador que contèm **um array de `[chave, valor]`** + para cada elemento no objeto `Map` na ordem em que foram inseridos. +- {{jsxref("Map.forEach", "Map.prototype.forEach(<var>callbackFn</var>[, + <var>thisArg</var>])")}} + - : Invoca o `callbackFn` uma vez para cada par chave-valor presente no objeto `Map`, na ordem em que foram inseridos. Se um parâmetro `thisArg` é provido para o `forEach`, será usado o valor de `this` para cada callback. + +## Exemplos + +### Usando o objeto Map + +```js +const myMap = new Map() + +const keyString = 'a string' +const keyObj = {} +const keyFunc = function() {} + +// setting the values +myMap.set(keyString, "value associated with 'a string'") +myMap.set(keyObj, 'value associated with keyObj') +myMap.set(keyFunc, 'value associated with keyFunc') + +myMap.size // 3 + +// getting the values +myMap.get(keyString) // "valor associado a 'a string'" +myMap.get(keyObj) // "valor associado a keyObj" +myMap.get(keyFunc) // "valor associado a keyFunc" + +myMap.get('a string') // "valor associado a 'a string'" + // porque keyString === 'a string' +myMap.get({}) // undefined, porque keyObj !== {} +myMap.get(function() {}) // undefined, porque keyFunc !== function () {} +``` + +### Usando NaN como chaves de Map + +{{jsxref("NaN")}} também pode ser usado como chave. Apesar de todo o `NaN` não ser igual a ele mesmo (`NaN !== NaN`), o exemplo a seguir funciona porque não é possível distinguir um `NaN` de outros. + +```js +const myMap = new Map() +myMap.set(NaN, 'not a number') + +myMap.get(NaN) +// "not a number" + +const otherNaN = Number('foo') +myMap.get(otherNaN) +// "not a number" +``` + +### Iterando o Map com for..of + +`Maps` podem ser iterados usando um loop `for..of`: + +```js +const myMap = new Map() +myMap.set(0, 'zero') +myMap.set(1, 'one') + +for (const [key, value] of myMap) { + console.log(key + ' = ' + value) +} +// 0 = zero +// 1 = um + +for (const key of myMap.keys()) { + console.log(key) +} +// 0 +// 1 + +for (const value of myMap.values()) { + console.log(value) +} +// zero +// one + +for (const [key, value] of myMap.entries()) { + console.log(key + ' = ' + value) +} +// 0 = zero +// 1 = one +``` + +### Iterando o Map com forEach() + +`Maps` podem ser iterados usando o +método {{jsxref("Map.prototype.forEach", "forEach()")}}: + +```js +myMap.forEach(function(value, key) { + console.log(key + ' = ' + value) +}) +// 0 = zero +// 1 = um +``` +### Relação com Arrays + +```js +const kvArray = [['key1', 'value1'], ['key2', 'value2']] + +// Use o construtor padrão do Map para transformar um array 2D chave-valor em um map +const myMap = new Map(kvArray) + +myMap.get('key1') // retorna "value1" + +// Use o Array.from() para transformar um map em um Array bidimensional de chaves e valores +console.log(Array.from(myMap)) // Irá exibir para você o mesmo Array como um Array chave-valor + +// Uma forma sucinta de fazer o mesmo, utilizando a sintaxe spread +console.log([...myMap]) + +// Ou use os iteradores keys() ou values(), e os converta para um array +console.log(Array.from(myMap.keys())) // ["key1", "key2"] +``` + +### Clonando e mesclando Maps + +Assim como `Arrays`, o map também pode ser clonado: + +```js +const original = new Map([ + [1, 'um'] +]) + +const clone = new Map(original) + +console.log(clone.get(1)) // um +console.log(original === clone) // false (Útil para comparações superficiais) +``` + +> **Nota:** Tenha em mente que _o dado em si_ não é clonado. + +Maps podem ser mesclados, mantendo as chaves únicas: + +```js +const first = new Map([ + [1, 'one'], + [2, 'two'], + [3, 'three'], +]) + +const second = new Map([ + [1, 'uno'], + [2, 'dos'] +]) + +// Mescla dois maps. A última chave a se repetir vence. +// O operador spread essenciamente converte um Map para um Array +const merged = new Map([...first, ...second]) + +console.log(merged.get(1)) // uno +console.log(merged.get(2)) // dos +console.log(merged.get(3)) // three +``` +Maps podem ser mesclados com array também: + +```js +const first = new Map([ + [1, 'one'], + [2, 'two'], + [3, 'three'], +]) + +const second = new Map([ + [1, 'uno'], + [2, 'dos'] +]) + +// Mescla maps com um array. A última chave a se repetir vence. +const merged = new Map([...first, ...second, [1, 'eins']]) + +console.log(merged.get(1)) // eins +console.log(merged.get(2)) // dos +console.log(merged.get(3)) // three +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- Um polyfill do `Map` está disponível em + [`core-js`](https://github.com/zloirock/core-js#map) +- {{jsxref("Set")}} +- {{jsxref("WeakMap")}} +- {{jsxref("WeakSet")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/keys/index.md b/files/pt-br/web/javascript/reference/global_objects/map/keys/index.md new file mode 100644 index 0000000000..b183c6c3c4 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/keys/index.md @@ -0,0 +1,58 @@ +--- +title: Map.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/Map/keys +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype +browser-compat: javascript.builtins.Map.keys +--- +{{JSRef}} + +O método **`keys()`** retorna um novo objeto **[iterador](/pt-BR/docs/Web/JavaScript/Guide/Iterators_and_Generators)** que contém +as chaves de cada elemento dentro do objeto `Map` na ordem em que foram inseridos. + +{{EmbedInteractiveExample("pages/js/map-prototype-keys.html")}} + +## Sintaxe + +```js +keys() +``` + +### Valor retornado + +Um novo objeto {{jsxref("Map")}} iterador. + +## Exemplos + +### Usando keys() + +```js +var myMap = new Map(); +myMap.set('0', 'foo'); +myMap.set(1, 'bar'); +myMap.set({}, 'baz'); + +var mapIter = myMap.keys(); + +console.log(mapIter.next().value); // "0" +console.log(mapIter.next().value); // 1 +console.log(mapIter.next().value); // Object +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map.prototype.entries()")}} +- {{jsxref("Map.prototype.values()")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/map/index.md b/files/pt-br/web/javascript/reference/global_objects/map/map/index.md new file mode 100644 index 0000000000..6ce3193931 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/map/index.md @@ -0,0 +1,57 @@ +--- +title: Map() constructor +slug: Web/JavaScript/Reference/Global_Objects/Map/Map +tags: + - Constructor + - JavaScript + - Map + - Reference + - Polyfill +browser-compat: javascript.builtins.Map.Map +--- +{{JSRef}} + +O **construtor `Map()`** cria objetos {{jsxref("Map")}}. + +## Sintaxe + +```js +new Map() +new Map(iterable) +``` + +### Parâmetros + +- `iterable` {{optional_inline}} + - : Um {{jsxref("Array")}} ou outro + objeto [iterável](/pt-BR/docs/Web/JavaScript/Reference/Iteration_protocols) + dos quais os elementos são pares chave-valor. (Por exemplo, arrays com dois elementos como `[[ 1, 'one' ],[ 2, 'two' ]]`.). + Cada par chave-valor é adicionado ao novo `Map`. + +## Exemplos + +### Criando um novo Map + +```js +let myMap = new Map([ + [1, 'one'], + [2, 'two'], + [3, 'three'], +]) +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- Um polyfill de `Map` esta disponível em + [`core-js`](https://github.com/zloirock/core-js#map) +- {{jsxref("Set")}} +- {{jsxref("WeakMap")}} +- {{jsxref("WeakSet")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/set/index.md b/files/pt-br/web/javascript/reference/global_objects/map/set/index.md new file mode 100644 index 0000000000..b152f42f4d --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/set/index.md @@ -0,0 +1,74 @@ +--- +title: Map.prototype.set() +slug: Web/JavaScript/Reference/Global_Objects/Map/set +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Method + - Prototype + - Reference +browser-compat: javascript.builtins.Map.set +--- +{{JSRef}} + +O método **`set()`** adiciona ou atualiza um elemento com a chave especificada e um valor do objeto `Map`. + +{{EmbedInteractiveExample("pages/js/map-prototype-set.html")}} + +## Sintaxe + +```js +set(key, value) +``` + +### Parâmetros + +- `key` + - : A chave do elemento que será adicionado ao objeto `Map`. +- `value` + - : O valor do elemento que será adicionado ao objeto `Map`. + +### Valor retornado + +O objeto `Map`. + +## Exemplos + +### Usando o set() + +```js +let myMap = new Map() + +// Adiciona um elemento ao map +myMap.set('bar', 'foo') +myMap.set(1, 'foobar') + +// Atualiza um elemento no map +myMap.set('bar', 'baz') +``` + +### Usando o `set` de forma encadeada + +Já que o método `set()` retorna o mesmo objeto `Map`, você pode encadear a chamada do método como abaixo: + +```js +// Adiciona novos elementos ao map de forma encadeada. +myMap.set('bar', 'foo') + .set(1, 'foobar') + .set(2, 'baz'); +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} +- {{jsxref("Map.prototype.get()")}} +- {{jsxref("Map.prototype.has()")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/size/index.md b/files/pt-br/web/javascript/reference/global_objects/map/size/index.md new file mode 100644 index 0000000000..db921570b7 --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/size/index.md @@ -0,0 +1,45 @@ +--- +title: Map.prototype.size +slug: Web/JavaScript/Reference/Global_Objects/Map/size +tags: + - ECMAScript 2015 + - JavaScript + - Map + - Property +browser-compat: javascript.builtins.Map.size +--- +{{JSRef}} + +A propriedade acessora **`size`** retorna o número de elementos que estão dentro do objeto {{jsxref("Map")}} + +{{EmbedInteractiveExample("pages/js/map-prototype-size.html")}} + +## Descrição + +O valor de `size` é um inteiro que representa a quantidade de entradas que o objeto `Map` possui. +A função acessora set para `size` é `undefined`; você não poderá alterar essa propriedade. + +## Exemplos + +### Usando o size + +```js +var myMap = new Map(); +myMap.set('a', 'alpha'); +myMap.set('b', 'beta'); +myMap.set('g', 'gamma'); + +myMap.size // 3 +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com browsers + +{{Compat}} + +## Veja também + +- {{jsxref("Map")}} diff --git a/files/pt-br/web/javascript/reference/global_objects/map/values/index.md b/files/pt-br/web/javascript/reference/global_objects/map/values/index.md new file mode 100644 index 0000000000..3d2e536c3c --- /dev/null +++ b/files/pt-br/web/javascript/reference/global_objects/map/values/index.md @@ -0,0 +1,58 @@ +--- +title: Map.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Map/values +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Map + - Method + - Prototype +browser-compat: javascript.builtins.Map.values +--- +{{JSRef}} + +O método **`values()`** retorna um novo objeto **[iterador](/pt-BR/docs/Web/JavaScript/Guide/Iterators_and_Generators)** que contém o valor +de cada elemento dentro do objeto `Map` na ordem em que foram inseridos. + +{{EmbedInteractiveExample("pages/js/map-prototype-values.html")}} + +## Sintaxe + +```js +values() +``` + +### Valor retornado + +Um novo objeto {{jsxref("Map")}} iterador. + +## Exemplos + +### Usando values() + +```js +var myMap = new Map(); +myMap.set('0', 'foo'); +myMap.set(1, 'bar'); +myMap.set({}, 'baz'); + +var mapIter = myMap.values(); + +console.log(mapIter.next().value); // "foo" +console.log(mapIter.next().value); // "bar" +console.log(mapIter.next().value); // "baz" +``` + +## Especificações + +{{Specifications}} + +## Compatibilidade com navegadores + +{{Compat}} + +## Veja também + +- {{jsxref("Map.prototype.entries()")}} +- {{jsxref("Map.prototype.keys()")}} |