set
定义: Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用，Set对象是值的集合，你可以按照插入的顺序迭代它的元素。Set中的元素只会出现一次，即 Set 中的元素是唯一的
Set本身是一个构造函数，用来生成 Set 数据结构
语法：
let set = new Set([1, 1, 2, 2]) console.log(...set)
属性：size 返回长度
console.log(new Set([1,2,1,2]).size) // 2
操作方法：
add(value): 向集合中添加一个新的项
delete(value): 从集合中删除一个值
has(value): 如果值在集合中存在，返回ture, 否则返回false
clear(): 移除集合中的所有项
let set = new Set() set.add(1) set.add(2) set.add(2) set.add(3) console.log(set) // {1,2,3} set.has(2) // true set.delete(2) set.has(2) // false set.clear()
遍历方法
keys(): 返回键名的遍历器
values(): 返回键值的遍历器
entries(): 返回键值对的遍历器
forEach(): 使用回调函数遍历每个成员
let set = new Set([1,2,3,4]) // 由于set只有键值，没有键名，所以keys() values()行为完全一致 console.log(Array.from(set.keys())) // [1,2,3,4] console.log(Array.from(set.values())) // [1,2,3,4] console.log(Array.from(set.entries())) // [[1,1],[2,2],[3,3],[4,4]] set.forEach((item) => { console.log(item)}) // 1,2,3,4
应用场景
// 数组去重 let arr = [1, 1, 2, 3]; let unique = [... new Set(arr)]; let a = new Set([1, 2, 3]); let b = new Set([4, 3, 2]); // 并集 let union = [...new Set([...a, ...b])]; // [1,2,3,4] // 交集 let intersect = [...new Set([...a].filter(x => b.has(x)))]; [2,3] // 差集 let difference = Array.from(new Set([...a].filter(x => !b.has(x)))); [1]
map
Map 对象保存键值对，并且能够记住键的原始插入顺序。任何值(对象或者原始值) 都可以作为一个键或一个值。一个Map对象在迭代时会根据对象中元素的插入顺序来进行 — 一个 for...of 循环在每次迭代后会返回一个形式为[key，value]的数组
Map的使用场景
Map和Object很类似，但Map有一个比较特殊的应用场景。如果你在开发时不确定键值对里面的键的名称，那么你需要用Map。举例来说，你需要动态地从MongoDB里获取键值并显示给用户，但也许你并不关心这些键值的键名到底是什么，那么在这种情况下，你可以用Map，例如这样：
var myMap = new Map();var keyObj = {}, keyFunc = function () { return 'hey'}, keyString = "a string"; myMap.set(keyString, "value associated with 'a string'"); myMap.set(keyObj, "value associated with keyObj"); myMap.set(keyFunc, "value associated with keyFunc");console.log(myMap.get(keyFunc));
语法
let map = new Map() map.set('name', 'vuejs.cn'); console.log(map.get('name'))
属性 size: 返回 Map 结构的元素总数
let map = new Map() map.set('name', 'vuejs.cn'); console.log(map.size) // 1 console.log(new Map([['name','vue3js.cn'], ['age','18']]).size) // 2
操作方法
set(key, value): 向 Map 中加入或更新键值对
get(key): 读取 key 对用的值，如果没有，返回 undefined
has(key): 某个键是否在 Map 对象中，在返回 true 否则返回 false
delete(key): 删除某个键，返回 true, 如果删除失败返回 false
clear(): 删除所有元素
let map = new Map() map.set('name','vue3js.cn') map.set('age','18') console.log(map) // Map {"name" => "vuejs.cn", "age" => "18"} map.get('name') // vue3js.cn map.has('name') // true map.delete('name') map.has(name) // false map.clear() // Map {}
遍历方法
keys()：返回键名的遍历器
values()：返回键值的遍历器
entries()：返回所有成员的遍历器
forEach()：遍历 Map 的所有成员
let map = new Map() map.set('name','vue3js.cn') map.set('age','18') console.log([...map.keys()]) // ["name", "age"] console.log([...map.values()]) // ["vue3js.cn", "18"] console.log([...map.entries()]) // [['name','vue3js.cn'], ['age','18']] // name vuejs.cn // age 18 map.forEach((value, key) => { console.log(key, value)})
类型的转换
Map 转为 Array
// 解构 const map = new Map([[1, 1], [2, 2], [3, 3]]) console.log([...map]) // [[1, 1], [2, 2], [3, 3]] // Array.from() const map = new Map([[1, 1], [2, 2], [3, 3]]) console.log(Array.from(map)) // [[1, 1], [2, 2], [3, 3]]
Array 转为 Map
const map = new Map([[1, 1], [2, 2], [3, 3]]) console.log(map) // Map {1 => 1, 2 => 2, 3 => 3}
Map 转为 Object
// 非字符串键名会被转换为字符串 function mapToObj(map) { let obj = Object.create(null) for (let [key, value] of map) { obj[key] = value } return obj } const map = new Map().set('name', 'vue3js.cn').set('age', '18') mapToObj(map) // {name: "vue3js.cn", age: "18"}
Object 转为 Map
let obj = {"a":1, "b":2}; let map = new Map(Object.entries(obj))
