ES6 Map数据类型创建、迭代、与 Array Object 转换、使用场景与优势等

1.Map的创建

let map= new Map()
map.set(0, 'a')
map.set(1, 'b')
// 获得：Map(2) {0 => "a", 1 => "b"} 的数据结构

2.Map的迭代

// 继续上面已经创建的Map结构
// 写法一
for (let [key, value] of map) {
  console.log(key + " = " + value)
}

// 写法二
for (let [key, value] of map.entries()) {
  console.log(key + " = " + value)
}

// 写法三
for (let item of map.entries()) {
  console.log(item[0], item[1]);
}

// 写法四
map.forEach((value, key) => {
  console.log(key + " = " + value)
}, map)
// forEach的第二个参数：可选。传递给函数的值一般用 "this" 值。如果这个参数为空， "undefined" 会传递给 "this" 值
map[Symbol.iterator] === map.entries // true	

// 获取键
for (let key of map.keys()) {
  console.log(key) // 0 1
}

// 获取值
for (let value of map.values()) {
  console.log(value) // 'a' 'b'
}

上面将获得相同结果：

0 = 'a'
1 = 'b'
即：Map 结构的默认遍历器接口（Symbol.iterator属性），就是entries方法。

3.Map的操作/转换

3.1.Map对象与Array数组互转

let arr = [["0", "a"], ["1", "b"]]
// Array 转 Map
let map = new Map(arr)
// Map 转 Array (二维数组)
let arr1 = [...map.entries()]
// 或
let arr2 = [...map]
// 或
// from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。
// 因此 Object对象不能直接用Array.from()转换
let tdArr = Array.from(map)
// Map 转 Array (键数组)
let keyArr = [...map.keys()]
// 结果：["0", "1"]
// Map 转 Array (值数组)
let valArr = [...map.values()]
// 结果：["a", "b"]

3.2.Map对象与Object对象互转

// Object 转 Map
let obj = { a: '1', b: '2' }
let map = new Map(Object.entries(obj))
// 结果：Map(2) {"a" => "1", "b" => "2"}

// Map 转 Object
let map = new Map()
map.set('️a', '1')
map.set('b', '2')
let obj = [...map.entries()].reduce((obj, [key, value]) => (obj[key] = value, obj), {})
// 相当于
// let obj = [...map.entries()].reduce((obj, [key, value]) => {
//     obj[key] = value
//     return obj
// }, {})
// Array.reduce()的第二个参数：可选。传递给函数的初始值
console.log('obj', obj)
// {️a: "1", b: "2"}	

3.3.Map对象的克隆

let map1 = new Map([["0", "a"], ["1", "b"]]);
// 克隆
let map2 = new Map(map1);
// 但是
console.log(map1 === map2); // false

3.4.Map对象的合并

let map1 = new Map([[1, 'a'], [2, 'b'], [3, 'c'],])
let map2 = new Map([[1, 'd'], [2, 'e']])
// 合并两个 Map 对象时，如果有重复的键值，则后面的会覆盖前面的
let mapCombine = new Map([...map1, ...map2])
// 因此结果：Map(3) {1 => "d", 2 => "e", 3 => "c"}

4.Map的自带属性与函数

1.长度：map.size
2.设置键值：map.set("1", "a")
可以缀接：let map = new Map().set(1, 'a').set(2, 'b').set(3, 'c')
3.通过键获取值：Map.prototype.get(key)
没有值返回时：undefined
4.通过键判断是否含有该属性：Map.prototype.has(key)
返回 true 或 false
5.通过键删除该属性：Map.prototype.delete(key)
成功与否返回 true 或 false，当Map对象中没有该属性时返回false，并改变原Map结构
6.清空：Map.prototype.clear()

5.Map的使用场景与优势

5.1.使用场景：给接口返回数据的时候去掉某些多余的属性。

/**
 * @description: 去掉某对象的指定属性公共函数
 * @param {Array} arr 包含需要去掉的属性的数组
 * @param {Object} obj 需要去掉属性的对象
 * @return {Object} 去掉指定属性后的对象
**/
deleteObjProp(arr, obj) {
    let map = new Map(Object.entries(obj))
    arr.forEach(item => { map.delete(item) })
    return [...map.entries()].reduce((obj, [key, value]) => (obj[key] = value, obj), {})
}
this.deleteObjProp(['a', 'b'], {'a': 1, 'b': 2, 'c': 3, 'd': 4})
// 返回值：{'c': 3, 'd': 4}

// 或者反之，只保留传进来的 arr 内包含的键所对应的键值对
deleteObjProp (arr, obj) {
    let map = new Map(Object.entries(obj))
    // 取到差集
    let longArr = new Set([...map.keys()])
    let shortArr = new Set(arr)
    let diffrArr = new Set([...longArr].filter(x => !shortArr.has(x)))
    diffrArr.forEach(item => { map.delete(item) })
    return [...map.entries()].reduce((obj, [key, value]) => (obj[key] = value, obj), {})
}
this.deleteObjProp(['a', 'b'], {'a': 1, 'b': 2, 'c': 3, 'd': 4})
// 返回值：{'a': 1, 'b': 2}

5.2.优势：
1.键值可以为任意值
2.有极快的查询，删除等操作速度
……