Set
- Set是数据结构中的一种叫集合的数据结构，最大的特点是数据不能重复，无序的，不能通过下标值进行修改
- set的存储的数据类型可以是任意的
- set的引用是强引用
- Set类的实现
//封装集合类
function Set() {
//属性
this.items = {}; //可以是对象，也可以是数组
//方法
// 1- add(value) 添加方法
Set.prototype.add = function (value) {
if (this.has(value)) {
return false;
}
this.items[value] = value;
return true;
};
// 2- remove(value) 删除方法
Set.prototype.remove = function (value) {
if (!this.has(value)) {
return false;
}
delete this.items[value];
return true;
};
// 3- has(value) 判断集合中是否有对应的值,有返回 true
Set.prototype.has = function (value) {
return this.items.hasOwnProperty(value);
};
// 4- clear() 清除集合中所有的元素
Set.prototype.clear = function () {
this.items = {};
};
// 5- size() 返回集合中元素的个数
Set.prototype.size = function () {
return Object.keys(this.items).length;
};
// 6- values() 将集合中元素返回为一个数组
Set.prototype.values = function () {
return Object.keys(this.items);
};
}
weakSet
- 存储的数据只能是对象类型
- 存储的数据不能被遍历出来
- 引用为弱引用
const obj = { name: 'jack' };
const ad = new WeakSet();
ad.add(obj);
for (let item of ad) {
console.log(item); //TypeError: ad is not iterable
}
弱引用和强引用
- 强引用可以理解为在全局有一个变量指向对应的数据,数据在用完之后，由于全局有一个变量指向，数据是不能被销毁的，
- 弱引用就是数据在用完之后，会被垃圾回收器回收，数据会被销毁
- 但是都可以通过 . 来找到相应的数据
var obj = {name:"jack"}
const set = new Set
set.add(obj)
Map
- map也是数据结构中一种叫字典的数据类型，
- 存储的数据类型是key，value，其实和object非常相似
实现的方法和上面的集合实现方法差不多，这里就不贴代码了
const obj1 = { name: 'jack' };
const obj2 = { name: 'mask' };
//字典
const map = new Map();
//可以将对象或者其他任意数据类型作为key值
map.set(obj1, 'aaa');
map.set(obj2, 'ccc');
console.log(map);
console.log(map.values());
for (let item of map) {
console.log(item[0], item[1]);
}
for (let [key, value] of map) {
console.log(key, value);
}
WeakMap
- weakmap也是一种弱引用
- key只能为对象的数据类型
- 不能遍历
vue的响应式原理用的就是weakmap和map的组合
const obj1 = {
name: 'jack',
age: '18',
};
const weakmap = new WeakMap();
const map = new Map();
function obj1namefunction() {
console.log('obj1name被执行');
}
function obj1agefunction() {
console.log('obj1age被执行');
}
//将obj的属性设置触发函数
map.set('name', [obj1namefunction]);
map.set('age', [obj1agefunction]);
//将obj1和触发函数设置为weakmap
weakmap.set(obj1, map);
//改变属性
obj1.name = 'jame';
//拿到改变属性的对象
const targetmap = weakmap.get(obj1);
//在从对象中拿到对应的value值
const fn = targetmap.get('name');
//遍历对应的value值进行调用
fn.forEach((item) => {
item(); //obj1name被执行
});
