JavaScript(Map/Set)

Map

Map자료형은 매핑(mapping: 하나의 값을 다른 값으로 대응시키는 것)이 가능한 자료형으로, Object자료형과 똑같이 key, value 형태로 자료를 저장할 수 있는 자료형이다.

new를 통해 전역객체에 존재하는 Map()함수를 사용하고, .set을 이용하여 다음과 같이 코드를 작성.

var person = new Map();
person.set('name', 'Kim');
person.set('age', 20);

Map - 연관성을 위한 사용

이때, Map()의 출력결과는 {}안에 출력되고, => 로 나타난다.
Map 자료형은 자료의 연관성을 표현하기 위해 사용되기 때문이다.
따라서, key, value 형식으로 저장하려면 Object를, 두 값의 연관성을 나타내고 싶으면 Map을 사용하면 된다.

Map - 모든 자료를 삽입 가능

Map의 경우 문자형만 삽입 가능한 Object에 반하여, key,value값에 모든 자료형을 삽입할 수 있다. 앞서 말했듯이 Map은 단순히 자료의 이름을 삽입하는 것이 아닌, 값과 값의 연관성을 표현하기 위해서 사용되기 때문이다.

Map을 다루는 법

var person = new Map();
person.set('age', 20);
person.get('age'); //자료 꺼내는 법
person.delete('age'); //자료 삭제하는 법
person.size; //자료 몇갠지 알려주는 법
for (var key of person.keys() ){//Map자료 반복문 돌리기
  console.log(key) // age
}
var person = new Map([//자료를 직접 집어넣고 싶으면
  ['age', 20],
  ['name', 'Kim']
]); 

Map의 사용

알고리즘 공부를 하게 된다면 Map 자료형을 볼 수 있다.

만약 array에 자료를 저장할 때 자료가 천만개 1억개 이상으로 많으면 Hash Map, Hash Table 이라는걸 사용하게 된다.
원하는 값을 찾아서 출력하고 싶을시, 일반적인 방법은 반복문을 돌려 하나하나 찾아야 한다.
하지만, Hash Table는 자료를 미리 abc 순으로 정돈이 가능하여, 자료를 찾기가 빠르다.

Hash Table은 자료에 key값을 부여해놓고 정렬하여 사용이 가능하다. (object 자료형이 Hash Table이랑 비슷)

하지만, Hash Table을 만들기 위해선 쌩 자바스크립트 object 자료 쓰면 되긴 하는데
object 자료형은 hasOwnProperty, toString 이런 키들도 집어넣을 수 있어서 너무 유연하고, key값으로 들어올 수 있는게 문자형태로 제한되어있어서 Map 자료형을 사용한다.

ex) 주어진 array의 값들을 map을 사용해 제곱을 하는 방법

for문

const numbers = [1, 2, 3, 4, 5]; 
const result = []; 
for (i = 0; i < numbers.length; i++) { 
result.push(numbers[i] * numbers[i]); 
} 
console.log(result); // [1, 4, 9, 16, 25]

map

const numbers = [1, 2, 3, 4, 5]; 
const result = numbers.map(number => number * number); 
console.log(numbers); // [1, 2, 3, 4, 5]; 
console.log(result); // [1, 4, 9, 16, 25]

Map 자료형은 주로 주어진 배열의 값을 재정의 할 때 사용하는 방법.
ECMA에는 "주어진 배열의 값들을 오름차순으로 접근해 callbackfn을 통해 새로운 값을 정의하고 신규 배열을 만들어 반환한다"라고 정의되어있다.

출처: https://7942yongdae.tistory.com/48 [프로그래머 YD]

Set

Set 객체는 자료형에 관계 없이 원시 값과 객체 참조 모두 유일한 값을 저장

• 간단한 Array 자료형과 비슷한 형태를 가지고 있다.
• 중복자료형을 허용하지 않는다.

var 출석부 = new Set([ 'john' , 'tom', 'andy', 'tom' ]);
console.log(출석부); // {'john' , 'tom', 'andy'}

Set 자료형 다루기

var 출석부 = new Set([ 'john' , 'tom', 'andy', 'tom' ]);
출석부.add('sally'); //자료더하기 
출석부.has('tom'); //자료있는지 확인
출석부.size;  //자료 몇갠지 세기
 for(var key of 출석부){ //내부값 차례로 출력
      console.log(key);
   }

Set 배열화시키기

var 출석부 = [ 'john' , 'tom', 'andy', 'tom' ]; //일반 배열
var 출석부2 = new Set(출석부); //배열를 Set으로 바꾸기
출석부 = [...출석부2]  //spread 사용 -> Set을 배열로 바꾸기