js學習筆記（set類型&weakset）

set類型

定義及聲明方式

set類型類似數組，但set內的元素不會有重複

let set = new Set();
set.add(1);
set.add("1");
console.log(set); => [1,'1']

set類型的增刪改查

let set = new Set (['csdn','github']);
console.log(set.values()); => SetIterator{['csdn','github'}
//獲取set類型的元素
console.log(set.size); => 2
//獲取set類型的長度

console.log(set.has("csdn"));
//判斷set類型中元素是否存在

console.log(set.delete('csdn')); => true
//在set類型中查找並刪除某元素,若刪除成功返回true，若元素不存在返回false

set.clear();
//清空set類型

類型之間的轉換

數組轉爲set類型
let set = new Set(arr);

set類型轉爲數組
let arr = [...set];

set類型使用數組的方法過濾

let set = new Set('123456789');
let arr = [...set].filter(item=> item < 5);
set = new Set(arr);
console.log(set); => {1,2,3,4};

arr數組使用set去重

let arr = [1,2,3,3,4,5,3,1];
let arr = [...new Set(arr)];

遍歷set類型

let set = new Set('csdn','github');
set.forEach((value, key.set)=>{
	console.log(value)
})
//value和key一樣

for (let value of set) {
	console.log(value);
}

set類型的應用

let obj = {
	data:new Set(),
	keyword(word){
		this.data.add(word);
	},
	show() {
		let ul = document.querySelector('ul');
		ul.innerHTML = '';
		this.data.forEach(item=>{
			ul.innerHTML += `<li>${ item}</li>`
		});
	}	
}
let input = document.querySeletor('[name = csdn]');
input.addEventListener('blur',function(){
	obj.keyword(this.value);
	obj.show();
})

set類型處理並集交集與差集

let a = new Set([1,2,3,4,5]);
let b = new Set([4,5,3,8]);

console.log(new Set([...a, ...b])); => { 1,2,3,4,5,8 }
//並集

new Set( [...a].filter(item=> b.has(item) ) ); => { 3,4,5 }
//交集

new Set([...a].filter(item)=> !b.has(item)); => { 1,2 }
//差集，存在a中並不存在b中的元素

weakset

定義及聲明

定義：與set類型相似，裏面的值只能存放引用類型數據（存放基本類型數據會報錯）

let set = new WeakSet;
set.add(["NY","NN"]);

可使用weakset類型存儲dom元素

let nodes = new WeakSet();
let divs = document.querySelectorAll('div');
divs.forEach(item=>{
	nodes.add(item);
});
nodes.delete(div[0]);
console.log(nodes.has(div[0])); => false

weakset集合只能存儲對象的弱引用，並且不可以儲存原始值；
集合中的弱引用如果是對象的唯一的引用，則會被回收並釋放相應內存

weakset 集合不可跌迭代，把所以不能被遍歷，也不支持size屬性，這其實是爲了讓它能夠正確地處理內存中的數據。故，如果你只需要跟蹤對象的引用，那麼更應該使用weakset集合。