说明:

Map结构提供了“值—值”的对应,是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构,Map比Object更合适。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。

map 的定义

1
2
1、let map = new Map();
2、let map = new Map([[key,value],[key,value]]); //默认带初始化参数的定义

  如果Map的键是一个简单类型的值(数字、字符串、布尔值),则只要两个值严格相等,Map将其视为一个键,包括0和-0。另外,虽然NaN不严格相等于自身,但Map将其视为同一个键。

new Map()详细介绍与对比-LMLPHP
    let map = new Map();
let obj = {name:1};
map.set(true,'111');
map.set(obj,'111');
map.set(1,1);
map.set(1,1);
map.set(undefined,undefined);
map.set(null,null);
map.set(NaN,NaN);
map.set([1,2,3],1);
console.log(map);
// map{[[Entries]]:[
{true => "111"},
{Object => "111"},
{1 => 1},
{undefined => undefined},
{null => null},
{NaN => NaN},
{Array(3) => 1}
]}
new Map()详细介绍与对比-LMLPHP

注意:只有对同一个对象的引用,Map结构才将其视为同一个键。

    var map = new Map();
map.set(['a'], 555);
map.get(['a']) // undefined

上面代码的set和get方法,表面是针对同一个键,但实际上这是两个值,内存地址是不一样的,因此get方法无法读取该键,返回undefined。

实例属性和方法:

size、set、get、has、delete、clear

遍历方法:

keys()、values()、entries()、forEach()

Map 和 Array的对比 优势与劣势

new Map()详细介绍与对比-LMLPHP
    let map = new Map();
let arr = new Array();
//增:
map.set('a',1);
arr.push({'a': 1});
//查:
map.has('a');
arr.find(item=>item.a);
//改:
map.set('a',2);
arr.forEach(item=>item.a?item.a=2:'');
//删:
map.delete('a');
arr.splice(arr.findIndex(item=>item.a),1); console.log(map);
console.log(arr);
new Map()详细介绍与对比-LMLPHP

set map object 对比 优势与劣势

new Map()详细介绍与对比-LMLPHP
    let item = {a: 1};
let set = new Set();
let map = new Map();
let obj = new Object();
//增
set.add(item);
map.set('a', 1);
obj['a'] = 1;
//查
set.has(item);// true
map.has('a');// true
'a' in obj;// true
//改
item.a = 2;
map.set('a', 2);
obj['a'] = 2;
//删
set.delete(item);
map.delete('a');
delete obj['a'];
console.log(set);
console.log(map);
console.log(obj);
new Map()详细介绍与对比-LMLPHP

总结:在开发过程中,涉及到数据结构,能使用Map 不使用Array 尤其是复杂的数据结构 ,如果对于数组的存储考虑唯一性 使用Set ,优先使用map 如果要求数据储存的唯一性使用Set 放弃使用Array。

05-21 10:46