ES6: 세트, WeakSet, 맵 및 WeakMap 검색

This article is an extract from my book: The Complete Guide to Modern JavaScript.

Get my ebook on Amazon and Leanpub

세트란 무엇입니까?

ASet는 모든 유형의 고유한 값을 저장할 수 있는 Object입니다.

// create our set
const family = new Set();

// add values to it
family.add("Dad");
console.log(family);
// Set [ "Dad" ]

family.add("Mom");
console.log(family);
// Set [ "Dad", "Mom" ]

family.add("Son");
console.log(family);
// Set [ "Dad", "Mom", "Son" ]

family.add("Dad");
console.log(family);
// Set [ "Dad", "Mom", "Son" ]

보시다시피 마지막에 "Dad"를 다시 추가하려고 했지만 Set는 고유한 값만 가질 수 있기 때문에 Set는 여전히 동일하게 유지되었습니다.

동일한Set을 계속 사용하고 어떤 방법을 사용할 수 있는지 살펴보겠습니다.

family.size;
// 3
family.keys();
// SetIterator {"Dad", "Mom", "Son"}
family.entries();
// SetIterator {"Dad", "Mom", "Son"}
family.values();
// SetIterator {"Dad", "Mom", "Son"}
family.delete("Dad");
family;
// Set [ "Mom", "Son" ]
family.clear;
family;
// Set []

보시다시피 Set에는 size 속성이 있으며 여기에서 항목을 delete 사용하거나 clear를 사용하여 모든 항목을 삭제할 수 있습니다.

우리는 또한 a Set에 키가 없으므로 .keys()를 호출할 때 .values() 또는 .entries()를 호출하는 것과 동일한 결과를 얻습니다.

집합에 대해 반복

Set를 반복하는 두 가지 방법이 있습니다. .next()를 사용하거나 for of 루프를 사용하는 것입니다.

// using `.next()`
const iterator = family.values();
iterator.next();
// Object { value: "Dad", done: false }
iterator.next();
// Object { value: "Mom", done: false }


// using a `for of` loop
for(const person of family) {
  console.log(person);
}
// Dad
// Mom
// Son

어레이에서 중복 제거

고유한 값만 보유할 수 있다는 것을 알기 때문에 Set를 사용하여 배열에서 중복 항목을 제거할 수 있습니다.

const myArray = ["dad", "mom", "son", "dad", "mom", "daughter"];

const set = new Set(myArray);
console.log(set);
// Set [ "dad", "mom", "son", "daughter" ]
// transform the `Set` into an Array
const uniqueArray = Array.from(set);
console.log(uniqueArray);
// Array [ "dad", "mom", "son", "daughter" ]

// write the same but in a single line
const uniqueArray = Array.from(new Set(myArray));
// Array [ "dad", "mom", "son", "daughter" ]

보시다시피 새 배열에는 원래 배열의 고유한 값만 포함됩니다.

WeakSet이란 무엇입니까?

AWeakSet는 aSet와 유사하지만 객체만 포함할 수 있습니다.

let dad = {name: "Daddy", age: 50};
let mom = {name: "Mummy", age: 45};

const family = new WeakSet([dad,mom]);

for(const person of family){
  console.log(person);
}
// TypeError: family is not iterable

새 WeakSet를 만들었지만 for of 루프를 사용하려고 했을 때 작동하지 않았고 WeakSet를 반복할 수 없습니다.

AWeakSet는 요소를 삭제한 후 자체적으로 정리됩니다.

dad = null;
family;
// WeakSet [ {…}, {…} ]

// wait a few seconds
family;
// WeakSet [ {…} ]

보시다시피 몇 초 후에 아빠가 제거되고 쓰레기가 수거되었습니다. 값을 null 로 설정했을 때 참조가 손실되었기 때문에 발생했습니다.

지도란 무엇입니까?

A Map 는 a Set 와 유사하지만 키와 값 쌍이 있습니다.

const family = new Map();

family.set("Dad", 40);
family.set("Mom", 50);
family.set("Son", 20);

family;
// Map { Dad → 40, Mom → 50, Son → 20 }
family.size;
// 3

family.forEach((key,val) => console.log(val,key));
// Dad 40
// Mom 50
// Son 20

for(const [key,val] of family){
  console.log(key,val);
}
// Dad 40
// Mom 50
// Son 20

Set 루프로만 for of를 반복할 수 있는 반면 Map 및 for of 루프를 모두 사용하여 forEach를 반복할 수 있습니다.

WeakMap이란 무엇입니까?

AWeakMap는 키/값 쌍의 모음이며 aWeakSet와 유사하게 a WeakMap에서도 키가 약하게 참조됩니다. 즉, 참조가 손실되면 값이 WeakMap에서 제거됩니다. ) 및 가비지 수집.

AWeakMap는 열거할 수 없으므로 반복할 수 없습니다.

let dad = { name: "Daddy" };
let mom = { name: "Mommy" };

const myMap = new Map();
const myWeakMap = new WeakMap();

myMap.set(dad);
myWeakMap.set(mom);

dad = null;
mom = null;

myMap;
// Map(1) {{…}}
myWeakMap;
// WeakMap {}

보시다시피 엄마는 값을 null로 설정한 후 아빠가 여전히 Map 안에 남아 있는 동안 가비지 수집되었습니다.


읽어주셔서 대단히 감사합니다. 자세한 내용은 DevTo 또는 내 블로그inspiredwebdev.com에서 나를 팔로우하세요.




Amazon 및 Leanpub에서 내 전자책 받기