📜  ES6地图

📅  最后修改于: 2021-01-01 04:01:42             🧑  作者: Mango

ES6地图

ES6是JavaScript中添加的一系列新功能。在ES6之前,当我们需要键和值的映射时,我们经常使用一个对象。这是因为对象允许我们将键映射到任何类型的值。

ES6为我们提供了一个新的集合类型,称为Map ,其中包含键-值对,其中任何类型的值都可以用作键或值。 Map对象始终记住键的实际插入顺序。 Map对象中的键和值可以是原语或对象。它返回新的或空的Map。

地图是有序的,因此它们按其插入顺序遍历元素。

句法

为了创建新的地图,我们可以使用以下语法:

var map = new Map([iterable]);

Map()接受一个可选的可迭代对象,该对象的元素在键值对中。

地图属性

S.no. Properties Description
1. Map.prototype.size This property returns the number of key-value pairs in the Map object.

让我们简单地了解一下Map对象的上述属性。

Map.prototype.size

它返回Map对象中的元素数。

句法

Map.size

var map = new Map();
    map.set('John', 'author');
    map.set('arry', 'publisher');
    map.set('Mary', 'subscriber');
    map.set('James', 'Distributor');
  
console.log(map.size);

输出量

4

地图方法

Map对象包括几种方法,其列表如下:

S.no. Methods Description
1. Map.prototype.clear() It removes all the keys and values pairs from the Map object.
2. Map.prototype.delete(key) It is used to delete an entry.
3. Map.prototype.has(value) It checks whether or not the corresponding key is in the Map object.
4. Map.prototype.entries() It is used to return a new iterator object that has an array of key-value pairs for every element in the Map object in insertion order.
5. Map.prototype.forEach(callbackFn[, thisArg]) It executes the callback function once, which is executed for each element in the Map.
6. Map.prototype.keys() It returns an iterator for all keys in the Map.
7. Map.prototype.values() It returns an iterator for every value in the Map.

弱地图

弱映射几乎与普通映射相似,只是弱映射中的键必须是对象。它将每个元素存储为键-值对,其中键被弱引用。这里,键是对象,值是任意值。弱映射对象仅允许使用对象类型的键。如果没有对关键对象的引用,则它们将针对垃圾回收。在弱Map中,键不可枚举。因此,没有方法来获取键列表。

弱映射对象按插入顺序迭代其元素。它仅包括delete(key),get(key),has(key)set(key,value)方法。

让我们尝试了解弱地图的图示。

'use strict' 
let wp = new WeakMap(); 
let obj = {}; 
console.log(wp.set(obj,"Welcome to javaTpoint"));  
console.log(wp.has(obj));

输出量

WeakMap {  }
true

for … of循环和弱映射

for … of循环用于对键(即Map对象的值)执行迭代。下面的示例将通过使用for … of循环来说明Map对象的遍历。

'use strict' 
var colors = new Map([ 
   ['1', 'Red'], 
   ['2', 'Green'], 
   ['3', 'Yellow'],
   ['4', 'Violet'] 
]);

for (let col of colors.values()) {
    console.log(col);
}

console.log(" ")

for(let col of colors.entries()) 
console.log(`${col[0]}: ${col[1]}`);

输出量

Red
Green
Yellow
Violet

1: Red
2: Green
3: Yellow
4: Violet

迭代器和地图

迭代器是一个对象,它定义序列和终止时的返回值。它允许一次访问一组对象。 Set和Map都包含返回迭代器的方法。

迭代器是具有next()方法的对象。当调用next()方法时,迭代器将返回一个对象以及“值”“完成”属性。

让我们尝试了解一些迭代器以及Map对象的实现。

示例1

'use strict' 
var colors = new Map([ 
   ['1', 'Red'], 
   ['2', 'Green'], 
   ['3', 'Yellow'],
   ['4', 'Violet'] 
]);

var itr = colors.values();
console.log(itr.next());
console.log(itr.next());
console.log(itr.next());

输出量

{ value: 'Red', done: false }
{ value: 'Green', done: false }
{ value: 'Yellow', done: false }

示例2

'use strict' 
var colors = new Map([ 
   ['1', 'Red'], 
   ['2', 'Green'], 
   ['3', 'Yellow'],
   ['4', 'Violet'] 
]);
var itr = colors.entries();
console.log(itr.next());
console.log(itr.next());
console.log(itr.next());

输出量

{ value: [ '1', 'Red' ], done: false }
{ value: [ '2', 'Green' ], done: false }
{ value: [ '3', 'Yellow' ], done: false }

示例3

'use strict' 
var colors = new Map([ 
   ['1', 'Red'], 
   ['2', 'Green'], 
   ['3', 'Yellow'],
   ['4', 'Violet'] 
]);

var itr = colors.keys();
console.log(itr.next());
console.log(itr.next());
console.log(itr.next());

输出量

{ value: '1', done: false }
{ value: '2', done: false }
{ value: '3', done: false }