地图是用来保存键和值对的对象。键和值可以是原始类型和自定义数据类型的容器。将数据存储在map中的原因是key可以是任何类型。
对象声明语法
地图对象可以使用空构造函数或参数化构造函数来创建。
new Map(parameters)
new Map()using Map() constructor, we can create an empty map.
构造函数中的参数是可选的，它持有对象的数组或可迭代对象，其格式应该是键和值对。
对象声明示例
Map可以在键和值中存储所有的原始类型，包括NaN和未定义。
`
Empty Map Constructor
var mapVariable = new Map();
mapVariable.set('key1', 'value1')
mapVariable.set('key2','value2')
console.log(mapVariable.size) // outputs 2
console.log(mapVariable.get('key1')); // returns value1 of key1
var x = new Map([['1', 'Emp1'], ['2', 'Emp2']);
console.log(x.size);
x.set('3', 'Emp3');
console.log(x.size);
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
console.log(mapArray.size); // returns 2
mapArray.set('3', 'Emp3');
console.log(mapArray.size); // returns 3
console.log(mapArray.get('1')); // returns Emp1
console.log(mapArray.set('1', 'kiran')); //setting Employee object
console.log(mapArray.get('1')); // returns Emp1
console.log(mapArray.size); // returns 3
`
Map对象扩展自Map.Prototype全局对象。因此Map.prototype中的所有方法在Map对象中都可用。
对象属性
Map.size返回地图对象的大小，即数据的数量（key+value）
经常使用的方法
我们将看到基本方法的例子和解释。
clear()方法
这个方法从一个地图中删除key和value 语法和例子。
语法是clear()。
var clearMethodTest = new Map();
clearMethodTest.set(1,'test')
console.log(clearMethodTest.size); // returns 1
clearMethodTest.clear();
console.log(clearMethodTest.size); // returns 0
delete()方法
这个方法输出
true - 如果键存在，从地图中删除键和相应的值 false - 如果键不存在。
语法和例子
delete(key:object): Boolean
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
console.log(mapArray.size); // returns 2
mapArray.set('3', 'Emp3');
console.log( mapArray.size); // returns 3 with initial size
console.log(mapArray.delete('1'));// returns true as key 1 exist and deleted
console.log(mapArray.size); // return 2 after deleted key
console.log(mapArray.get('1')); // returns undefined as there is no key exist
Entries()方法
Entries方法返回一个新的迭代器对象，其中包含键和值对，以及按插入顺序检索的地图条目。
语法和例子
返回含有键和值的数组的迭代器
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
console.log(mapArray.size); // returns 2
mapArray.set('3', 'Emp3');
var iterator1 = mapArray.entries();
console.log(iterator1.next().value); // output: ["1", "Emp1"]
console.log(iterator1.next().value); // output: ["2", "Emp2"]
console.log(iterator1.next().value); // output: ["3", "Emp3"]
console.log(iterator1.next().value); // output: undefined
forEach方法
它是用来迭代地图的对象的。
语法和考试
myMap.forEach(callbackFunction{, optional arguments})
回调函数将在每个迭代的参数的键和值上调用 参数是可选的
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
console.log(mapArray.size); // returns 2
mapArray.set('3', 'Emp3');
mapArray.forEach(function (value, key) {
console.log(key+':'+value);
}
output is
1:Emp1
2:Emp2
3:Emp3
get/set/has方法
get(key)方法返回地图中给定键的值，如果键不存在则返回未定义的值。
set(key,value) - 保存给定键的值，如果键不存在则创建一个新的键和值。
has(key)- 如果键存在于地图中则返回true，如果键不存在于地图中则返回false。
例子
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
console.log(mapArray.size); // returns 2
mapArray.set('3', 'Emp3');
console.log(mapArray.get('1')); // returns Emp1
console.log(mapArray.set('1','New Emp')); // saves new value for key 1 and return new Map
console.log(mapArray.get('1')); // returns Emp1
console.log(mapArray.has('1')); // returns true
console.log(mapArray.has('15')); // returns false
keys() values() 方法
keys() 返回带有key的迭代器对象 values() 返回带有value的迭代器对象
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
var mapArray = new Map([['1', 'Emp1'], ['2', 'Emp2']]);
console.log(mapArray.size); // returns 2
mapArray.set('3', 'Emp3');
var keys = mapArray.keys();
console.dir(keys.next()); // returns { value: '1', done: false }
console.dir(keys.next()); // returns { value: '2', done: false }
console.dir(keys.next()); // returns { value: '3', done: false }
console.dir(keys.next()); // returns { value: 'undefined', done: true }
var keys = mapArray.values();
console.dir(keys.next()); // returns { value: 'Emp1', done: false }
console.dir(keys.next()); // returns { value: 'Emp2', done: false }
console.dir(keys.next()); // returns { value: 'Emp3', done: false }
console.dir(keys.next()); // returns { value: 'undefined', done: true }
接下来，我们将看到一些Map对象的使用实例
如何在javascript中把Map转换为Object？
有很多方法可以转换为对象，最简单的方法是使用Map的forEach迭代。
const sourceMap = new Map();
sourceMap.set("booleanKey", true);
sourceMap.set("arrayKey", [{a:1}, {b:2}, {c:3}]);
sourceMap.set("stringKey", '129');
const plainObject = {};
sourceMap.forEach(function (value, key) {
plainObject[key] = sourceMap.get(key);
});
console.log(plainObject);
在javascript中克隆地图对象
复制地图可以通过创建一个带有参数的新地图对象来完成。像下面这样创建一个地图对象
var newMap1 = new Map(originalMap)
动态添加数据到地图
数据将通过调用带有数组/可迭代对象的地图构造函数添加到地图中。你可以通过使用对象的设置方法动态添加。
var dynamicMap=new Map();
dynamicMap.set('newkey', 'newvalues');
将地图对象转换为JSON对象。
在应用程序开发过程中会出现地图对象到JSON或JSON到地图对象这样的用例。使用JSON.stringfy()将转换为JSON对象。
mapArray.forEach(function(val,key){
var tempObj={};
tempObj[key]=val;
jsonObj.push(tempObj)
})
console.log(jsonObj)
console.log(JSON.stringify(jsonObj));
这就是我对javascript地图对象的全部理解。我将在以后的文章中记录高级地图的例子
