WEB/JavsScript

[JavaScript] Set & Map Object

Raymond 2022. 5. 11. 18:03

Set 객체


셋(Set)은 중복을 허용하지 않는 값을 모아놓은 특별한 컬렉션입니다. 셋에 키가 없는 값이 저장됩니다.

주요 메서드는 다음과 같습니다.

new Set(iterable) – 셋을 만듭니다. 이터러블 객체를 전달받으면(대개 배열을 전달받음) 그 안의 값을 복사해 셋에 넣어줍니다.


set.add(value) – 값을 추가하고 셋 자신을 반환합니다.


set.delete(value) – 값을 제거합니다. 호출 시점에 셋 내에 값이 있어서 제거에 성공하면 true, 아니면 false를 반환합니다.


set.has(value) – 셋 내에 값이 존재하면 true, 아니면 false를 반환합니다.


set.clear() – 셋을 비웁니다.


set.size – 셋에 몇 개의 값이 있는지 세줍니다.

<script>
  // Set 객체
  let nameSet = new Set();
  nameSet.add("김하늘");
  nameSet.add("정준하");
  nameSet.add("유재석");
  nameSet.add("박명수");
  nameSet.add("유재석"); // 저장되지않아요.
  nameSet.add("김하늘"); // 저장되지않아요.

  nameSet.forEach(function (name) {
    console.log(name);
  });

  // 찾기
  console.log(nameSet.has("유재석"));

  // 특정 요소(데이터)를 삭제하고 싶을때
  nameSet.delete("유재석"); // 김치찌개 삭제

  //   nameSet.clear(); // 모두 삭제
</script>

 

Map 객체


맵(Map)은 키가 있는 데이터를 저장한다는 점에서 객체와 유사합니다. 다만, 맵은 키에 다양한 자료형을 허용한다는 점에서 차이가 있습니다.

Object와 Map의 차이
Object는 키값으로 문자열만 가질 수 있지만, Map은 키로 모든 데이터 타입을 가질 수 있다.
Map객체는 몇개의 키로 데이터가 저장되어 있는지 계산할필요가 없다. size 프로퍼티로 바로 알 수 있다.
Map 순서의 보장.


맵에는 다음과 같은 주요 메서드와 프로퍼티가 있습니다.

new Map() – 맵을 만듭니다.


map.set(key, value) – key를 이용해 value를 저장합니다.


map.get(key) – key에 해당하는 값을 반환합니다. key가 존재하지 않으면 undefined를 반환합니다.


map.has(key) – key가 존재하면 true, 존재하지 않으면 false를 반환합니다.


map.delete(key) – key에 해당하는 값을 삭제합니다.


map.clear() – 맵 안의 모든 요소를 제거합니다.


map.size – 요소의 개수를 반환합니다.

<script>
  // Map 객체
  let personMap = new Map();
  personMap.set("name", "홍길동");
  personMap.set("email", "hong@gmail.com");
  personMap.set("phone", "010-0000-0000");

  console.log(personMap.get("name")); // get함수 key 파라미터
  console.log(personMap.has("email")); // key가 있는지 체크

  // Map의 순회
  personMap.forEach(function (person) {
    console.log(person);
  });

  console.log(personMap.size);
  personMap.delete("email");

  personMap.forEach(function (person) {
    console.log(person);
  });

  personMap.clear();
</script>

 

참고자료

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Set

https://ko.javascript.info/map-set