前言:有些细节性的东西,或者说以后会被扩展并使用很多的东西,有必要掌握下来。

首先简单说明一下Map结构吧!

Set是针对数组的优化,同样的,Map是针对对象的优化。JavaScript中的对象(Object),本质是健值对的集合,但是有一个局限性在于它的键必须是字符串。Map是ES6提供的一种数据结构,它类似于对象,不同的是它的键不限于字符串,各种类型的值(包括对象)都可以当做键。

Map是一个构造函数,参数是一个数组,并且数组的成员是一个个表示键值对的数组。

Map的实例有以下属性和操作方法:

  1. size属性
  2. set(key,value)
  3. get(key)
  4. has(key)
  5. delete(key)
  6. clear()

Map的遍历(也是针对实例的方法):

  1. keys()
  2. values()
  3. entries()(也是Map的默认遍历器接口:map[Symbol.iterator]===map.entries)
  4. forEach()

接下来,回到正题,很多时候我们用的更多的其实是非Map结构的数据,但是Map的优势也是很明显的,这里介绍以下Map与Array,Object,JSON之间的相互转换。

(1)Map转换为数组(最方便的方法当然是使用扩展运算符(...)了)

//Map转换为数组
function mapToArr(map){
	return [...map];
}

(2)数组转换为Map(直接将数组放到Map的构造函数中作为参数)

//数组转换为Map
function arrToMap(arr){
	return new Map(arr);
}

(3)Map转换为对象(可以进行转换的条件是,Map的键都是字符串,否则无法转换)

//Map转换为对象
function mapToObj(map){
	let obj=Object.create(null);
	for(let [key,value] of map){
		if(typeof key==="string"){
			obj[key]=value;
		}
	}
	return obj;
}

(4)对象转换为Map(首先用for...of遍历对象的键,然后使用Map实例的set方法依次添加)

//对象转换为Map
function objToMap(obj){
	let map=new Map();
	for(let key of Object.keys(obj)){
		map.set(key,obj[key]);
	}
	return map;
}

(5)Map转换为JSON(第一种情况:Map的键名都是字符串,那么就可以直接用JSON.stringify对转换为对象的Map进行转换为对象JSON)

//Map转换为JSON
function mapToJSON_str(map){
	return JSON.stringify(mapToObj(map));
}

(6)Map转换为JSON(第二种情况:Map的键名存在非字符串,就需要将其转换为数组JSON)

//Map转换为JSON
function mapToJSON_nonStr(map){
	return JSON.stringify([...map]);
	//等同
	//return JSON.stringify(mapToArr(map));
}

(7)JSON转换为Map(第一种情况,对象JSON(即键名都是字符串)转换为Map)

//JSON转换为Map
function JSONToMap_str(json){
	return objToMap(JSON.parse(json));
}

(8)JSON转换为Map(第二种情况,数组JSON,限制的是每个数组成员本身是一个有两个成员的数组)

//JSON转换为Map
function JSONToMap_nonStr(json){
	return new Map(JSON.parse(json));
}

最后,补充一些测试用例吧:

es6中map返回新数组 es6 map转数组_数组

es6中map返回新数组 es6 map转数组_Map_02

es6中map返回新数组 es6 map转数组_ES6_03

es6中map返回新数组 es6 map转数组_数组_04

es6中map返回新数组 es6 map转数组_数组_05

es6中map返回新数组 es6 map转数组_ES6_06

es6中map返回新数组 es6 map转数组_JSON_07

es6中map返回新数组 es6 map转数组_Map_08