Map
创建
const m = new Map();
初始化实例
// 使用嵌套数组初始化映射
const m1 = new Map([
["key1", "val1"],
["key2", "val2"],
["key3", "val3"]
]);
alert(m1.size); // 3
set()方法添加键/值
m.set("firstName", "Matt")
.set("lastName", "Frisbie");
get()方法,获取某个键的值
console.log(m1.get("111"))
has()方法,判断某个键是否存在于map中
console.log(m1.has("111"))
顺序与迭代
entries()方法
const m = new Map([
["key1", "val1"],
["key2", "val2"],
["key3", "val3"]
]);
alert(m.entries === m[Symbol.iterator]); // true
for (let pair of m.entries()) {
alert(pair);
}
// [key1,val1]
// [key2,val2]
// [key3,val3]
可以直接对映射实例使用扩展操作,把映射转换为数组
const m = new Map([
["key1", "val1"],
["key2", "val2"],
["key3", "val3"]
]);
console.log([...m]); // [[key1,val1],[key2,val2],[key3,val3]]
回调方式
映射的 forEach(callback, opt_thisArg)方法并传入回调,依次迭代每个键/值对
const m = new Map([
["key1", "val1"],
["key2", "val2"],
["key3", "val3"]
]);
m.forEach((val, key) => alert(`${key} -> ${val}`));
// key1 -> val1
// key2 -> val2
// key3 -> val3
WeakMap
WeakMap 中的“weak”(弱),描述的是 JavaScript 垃圾回收程序对待“弱映射”中键的方式
特点是不会生成指向某个对象的引用
初始化
弱映射中的键只能是 Object 或者继承自 Object 的类型
const wm = new WeakMap();
原始值可以先包装成对象再用作键
const stringKey = new String("key1");
const wm3 = new WeakMap([
stringKey, "val1"
]);
alert(wm3.get(stringKey)); // "val1"
初始化之后可以使用 set()再添加键/值对,可以使用 get()和 has()查询,还可以使用 delete()删除
弱键
const wm = new WeakMap();
const container = {
key: {}
};
wm.set(container.key, "val");
function removeReference() {
container.key = null;
}
上面代码并没生成指向key的引用,所以当removeReference()执行时,就会摧毁最后一个引用,垃圾回收程序就把这个键/值对清理掉了。
使用若映射
const m = new Map();
const loginButton = document.querySelector('#login');
// 给这个节点关联一些元数据
m.set(loginButton, {disabled: true});
上面代码使用常规的map,执行后,登录的按钮会从DOM树删除了,但由于映射中还保存着按钮的引用,内存中并未删除这个DOM节点
const wm = new WeakMap();
const loginButton = document.querySelector('#login');
// 给这个节点关联一些元数据
wm.set(loginButton, {disabled: true});
使用weakmap则会立即释放内存
Set
Set 在很多方面都像是加强的 Map
基本API
const m = new Set();
// 使用数组初始化集合
const s1 = new Set(["val1", "val2", "val3"]);
alert(s1.size); // 3
// 使用自定义迭代器初始化集合
const s2 = new Set({
[Symbol.iterator]: function*() {
yield "val1";
yield "val2";
yield "val3";
}
});
alert(s2.size); // 3
- add()增添值
- has()查询
- 通过 size 取得元素数量
- 使用 delete()和 clear()删除元素
- add()返回集合的实例,所以可以将多个添加操作连缀起来,包括初始化
顺序与迭代
集合实例可以提供一个迭代器(Iterator),能以插入顺序生成集合内容。
const s = new Set(["val1", "val2", "val3"]);
alert(s.values === s[Symbol.iterator]); // true
alert(s.keys === s[Symbol.iterator]); // true
for (let value of s.values()) {
alert(value);
}
// val1
// val2
// val3
for (let value of s[Symbol.iterator]()) {
alert(value);
}
// val1
// val2
// val3
values()是默认迭代器
const s = new Set(["val1", "val2", "val3"]);
console.log([...s]); // ["val1", "val2", "val3"]
Weakset
与Map和Weakmap的区别几乎一样,不再赘述
迭代与扩展操作
4 种原生集合类型定义了默认迭代器
这意味着上述所有类型都支持顺序迭代,都可以传入 for-of 循环:
let iterableThings = [
Array.of(1, 2),
typedArr = Int16Array.of(3, 4),
new Map([[5, 6], [7, 8]]),
new Set([9, 10])
];
for (const iterableThing of iterableThings) {
for (const x of iterableThing) {
console.log(x);
}
}
// 1
// 2
// 3
// 4
// [5, 6]
// [7, 8]
// 9
// 10
这些类型都兼容扩展操作符,执行浅复制
let arr1 = [1, 2, 3];
let arr2 = [...arr1];
console.log(arr1); // [1, 2, 3]
console.log(arr2); // [1, 2, 3]
console.log(arr1 === arr2); // false
对于期待可迭代对象的构造函数
let map1 = new Map([[1, 2], [3, 4]]);
let map2 = new Map(map1);
console.log(map1); // Map {1 => 2, 3 => 4}
console.log(map2); // Map {1 => 2, 3 => 4}
构建数组的部分元素
let arr1 = [1, 2, 3];
let arr2 = [0, ...arr1, 4, 5];
console.log(arr2); // [0, 1, 2, 3, 4, 5]
浅复制意味着只会复制对象引用:
let arr1 = [{}];
let arr2 = [...arr1];
arr1[0].foo = 'bar';
console.log(arr2[0]); // { foo: 'bar' }