JavaScript에서 해당하는 해시맵

해시 테이블이라고도 하는 해시맵은 요소가 키-값 쌍의 형태로 저장되는 요소 모음입니다. 당시에는 JavaScript 프로그래밍 언어로 구현된 해시맵에 사용할 수 있는 사전 정의된 데이터 구조가 없었습니다. 이 데이터 구조가 이미 구현되고 있는 C++ 또는 Java와 같은 다른 프로그래밍 언어와는 다릅니다. 그래서 사람들은 해시맵을 구현하는 다양한 대안을 찾아보았고, 대부분 키-값 구조를 가지고 있기 때문에 객체를 사용했습니다.

JavaScript의 ES6 버전에서 JavaScript 커뮤니티는 키-값 쌍인 Map 객체라는 해시맵을 구현하기 위한 새로운 데이터 구조를 도입했습니다. Map 객체를 사용하여 해시맵을 구현하고 미리 정의된 메서드를 사용하여 삽입, 삭제 및 업데이트와 같은 다양한 작업을 수행하는 방법을 살펴보겠습니다.

JavaScript에서 Map 개체를 사용하여 해시맵 구현

Map 객체는 이미 보았듯이 키-값 쌍입니다. 처음에는 지도가 비어 있습니다. 내부에는 요소가 없습니다. 해시맵의 키는 문자열 또는 기호 유형이 될 것이며 해시맵의 값은 모든 유형이 될 수 있습니다.

Map을 생성하기 위해 객체를 생성하고 변수 안에 저장할 수 있습니다(이 경우 hashmap). 이제 해시맵 내부에 키-값 쌍을 삽입하기 위해 JavaScript는 set()이라는 메서드를 제공합니다. 이 메서드는 두 개의 매개변수를 사용합니다. 첫 번째는 키이고 두 번째는 값입니다. 우리가 만든 hashmap 안에 4개의 요소를 삽입합니다. 각 요소는 정수, 배열, 문자열 및 전체 함수와 같은 다른 유형의 값을 갖습니다. 아래는 동일한 것을 보여주는 코드입니다.

var hashmap = new Map();

hashmap.set('1', 700);
hashmap.set('2', [1, 2, 3]);
hashmap.set('3', 'This is a string');
hashmap.set('4', () => {console.log('Hello World')});

console.log(hashmap);

위의 코드를 실행하면 콘솔에 다음과 같이 표시됩니다.

보시다시피 해시맵의 값으로 전체 함수를 포함하여 다양한 데이터 유형을 삽입했습니다.

해시맵을 만들었습니다. 해시맵 내부에 있는 모든 값을 인쇄해 보겠습니다. forEach 루프를 사용하여 수행할 수 있습니다.

hashmap.forEach(element => {
  document.write('<br>' + element);
});

이것의 출력은 document.write() 메소드를 사용하는 콘솔 내부가 아니라 화면에 직접 표시됩니다.

이제 해시맵 내부에 키 ‘3’이 있는지, has() 메소드를 사용하지 않는지 확인해보자. 키가 해시맵 내부에 있는 경우 set() 메서드를 사용하여 키 ‘3’의 기존 값을 변경하거나 대체합니다.

if (hashmap.has('3')) {
  hashmap.set('3', 'We changed the value...')
}

console.log(hashmap);

출력:

마지막으로 해시맵에서 요소를 삭제하려면 delete() 메서드를 사용하고 삭제하려는 적절한 키를 전달할 수 있습니다. 그리고 해시맵에서 모든 요소를 ​​한 번에 제거하고 비우고 싶다면 다음과 같이 clear() 메서드를 사용할 수 있습니다.

// deletes 4th element
hashmap.delete('4');
console.log(hashmap);

// clears entire hashmap
hashmap.clear();
console.log(hashmap);

아래는 위 코드의 출력입니다.

이것은 JavaScript에서 해시맵을 만드는 것과 동등하고 올바른 방법입니다.