분류 javascript

JavaScript에서 Set() 및 Map() 탐색 II

컨텐츠 정보

  • 조회 214 (작성일 )

본문

약점 


WeakSets는 Set 데이터 구조로 작업 할 때 유연성을 제공합니다. 그들은 객체를 받아들이고 반복 할 수 없다는 점에서 일반 세트와 다릅니다. 반복 할 수 없으며 clear() 메소드가 없습니다. 그런데 어떻게 유연성을 제공합니까? 우리는 조금 볼 것입니다.


WeakSet 생성자를 사용하여 WeakSet을 만들 수 있습니다.


let user1 = {name: 'user 1', email: 'user1@example.com'};
let user2 = {name: 'user 2', email: 'user2@example.com'};
let user3 = {name: 'user 3', email: 'user3@example.com'};

const users = new WeakSet([user1, user2, user3]);

위의 코드는 새로운 WeakSet 객체를 만들고 객체가 아닌 항목을 추가하면 TypeError가 반환됩니다.


users.add('user 4');

console.log(users); // TypeError: Invalid value used in weak set

WeakSet에는 clear() 메서드가 없으므로 객체를 null로 설정하여 만 삭제할 수 있습니다. 자바 스크립트 엔진의 가비지 콜렉션 알고리즘은 null 객체에 할당 된 메모리를 자동으로 비우므로 WeakSet에서 삭제합니다.


이는 프로그램이 실행되는 동안 WeakSets 객체가 null로 설정되어 가비지 수집되므로 메모리 소비를 줄이고 특히 비동기 적으로 생성되는 방대한 양의 데이터를 처리 할 때 메모리 누수를 방지하기 때문에 훌륭합니다.


이 기능은 메모리 관리의 세부 사항을 신경 쓸 필요 없이 프로그래밍 문제에 대한 경량 솔루션을 작성할 수 있는 기회를 제공합니다.


Maps 


JavaScript Maps는 각 항목의 고유 키를 기반으로 항목을 효율적으로 저장하고 검색하도록 설계된 객체입니다. Map은 키 - 값 쌍을 저장하며 키와 값은 모두 프리미티브 값 또는 객체이거나 둘 다일 수 있습니다.


MDN 문서는 Map 객체를 다음과 같이 설명합니다.


Map 객체는 키 - 값 쌍을 보유하고 키의 원래 삽입 순서를 기억합니다. 모든 값 (객체와 프리미티브 값 모두)은 키 또는 값으로 사용될 수 있습니다. Map 객체는 요소를 삽입 순서대로 반복합니다. for ... of 루프는 각 반복마다 [key, value]의 배열을 반환합니다. 



Map 만들기 


세트와 마찬가지로 Map는 쉽게 만들 수 있습니다. Map 생성자를 사용하여 Map을 만듭니다.


const users = new Map();

console.log(users); // Map {}

항목 추가 


키 - 값 쌍은 set() 메소드를 사용하여 맵에 추가됩니다. 이 메소드는 두 개의 인수를 취하는데 첫 번째는 키이고 두 번째는 키에 의해 참조되는 값입니다.


users.set('John Doe', {
  email: 'johndoe@example.com',
});

users.set('Jane Doe', {
  email: 'janedoe@example.com',
});

console.log(users);

/__ console.log result 
Map {
  'John Doe' => { email: 'johndoe@example.com'},
  'Jane Doe' => { email: 'janedoe@example.com'} }
__/

중복 키를 삭제하는 Set와 달리 Map는 해당 키에 첨부 된 값을 업데이트합니다.


users.set('John Doe', {
  email: 'johndoe477@example.com',
});

console.log(users);

/__ console.log result 
Map {
  'John Doe' => {email: 'johndoe477@example.com'},
  'Jane Doe' => { email: 'janedoe@example.com'} }
__/

위의 예를 실행하면 John Doe의 이메일이 올바르게 대체됩니다.


항목 삭제하기 


Sets와 마찬가지로, 키 - 값 쌍은 delete() 메소드를 사용하여 삭제할 수 있습니다. 삭제할 키는 다음과 같이 delete() 메서드에 전달됩니다.


users.delete('Jane Doe');

Map에는 clear() 메소드도 있습니다.이 메소드는 Map 객체에서 모든 키 - 값 쌍을 제거합니다.


users.clear();

console.log(users); // Map {}

항목 검색 


Map에는 Map에 키가 있는지 확인하는 has() 메소드도 있습니다. 이 메소드는 키가 Map에 있으면 true를 반환하고 그렇지 않으면 false를 반환합니다.


let users = new Map();

users.set('John Doe', {
  email: 'johndoe@example.com',
});

users.set('Jane Doe', {
  email: 'janedoe@example.com',
});

console.log(users.has('John Doe')); // true

지도 항목의 값 반환 


Map 객체의 키 값은 Map 프로토 타입의 get 메소드를 사용하여 가져올 수 있습니다.


console.log(users.get('Jane Doe'); // { email: 'janedoe@example.com' }

keys() 및 values​​() 메서드를 각각 사용하여 Map 객체의 모든 키와 값을 가져올 수 있습니다. 이러한 메소드는, Map의 아이템을 루프 처리하기 위해서 사용할 수있는 next() 메소드를 가지는 새로운 MapIterator 오브젝트를 돌려줍니다.


let userKeys = users.keys();

console.log(userKeys.next()); // { value: 'John Doe', done: false }

let userValues = users.values();

console.log(userValues.next()); // _{ value: { email: 'johndoe@example.com' }, done: false }_

Sets와 마찬가지로 for ... forforEach()와 같은 루프 구문을 사용하여 지도 항목을 반복 할 수 있습니다.


for (let user of users) {
  console.log('[for...of]: ', user);
}

/_ Log result
  _[_for...of]:  _[_ 'John Doe', { email: 'johndoe@example.com' } ]
  _[_for...of]:  _[___ 'Jane Doe', { email: 'janedoe@example.com' } ]
_/

users.forEach((value, key) => console.log('[__forEach()]:  ', key, value));

/*_ Log result
  [__forEach()]:   John Doe { email: 'johndoe@example.com' }
  _[_forEach()]:   Jane Doe { email: 'janedoe@example.com' }
*_/

WeakMaps 


WeakSet과 마찬가지로 WeakMaps는 일반 Map 객체와 다릅니다. WeakMap은 객체를 키로 받아들이며 반복 가능하지 않으며 clear() 메소드가 없습니다.


WeakMap 생성자는 WeakMap을 생성하는 데 사용됩니다. 


예제를 살펴 보겠습니다.


let users = new WeakMap();

const user1 = {
  name: 'John Doe',
};