ES6 의 맵 과 set 집합 을 자세히 설명 합 니 다.

집합의 개념 과 수조 의 차이
사실 배열 도 집합 입 니 다.배열 의 색인 은 수치 형식 일 뿐 입 니 다.비 수치 형식 을 색인 으로 하려 면 배열 이 수 요 를 만족 시 킬 수 없습니다.
맵 집합 은 여러 키-값 쌍(key-value)을 저장 할 수 있 습 니 다.  Set 집합 은 여러 요 소 를 저장 할 수 있 습 니 다.
Map 과 Set 에 대해 서 는 일반적으로 그 중의 요 소 를 하나하나 옮 겨 다 니 지 않 습 니 다.Map 은 자주 사용 해 야 할 데 이 터 를 저장 하 는 데 사 용 됩 니 다.  set 는 일반적으로 어떤 값 이 존재 하 는 지 판단 하 는 데 사 용 됩 니 다.
ES 5 에서 맵 과 Set 에 대한 시 뮬 레이 션 방법
ES 5 에 서 는 set 와 Map 집합 이 없 으 며,일반적으로 대상 을 사용 하여 이 두 가지 집합 을 모 의 합 니 다.대상 의 속성 은 키(key)로 합 니 다.  속성 값 을 값 으로(value),  즉,property:property-value 로 key-value 를 모 의 하 는 형식 입 니 다.구체 적 으로 다음 과 같 습 니 다.
아 날로 그 맵 의 키 집합:

//      Map   
var map = Object.create(null);

//         ,      key   value
map.key1 = 'value 1';
map.key2 = {};

//    key     value 
console.log(map.key1); // "value 1"
console.log(map.key2); // "Object {}"

아 날로 그 세트:

//      Set   
var set = Object.create(null);

//         ,      key       true,      key      
set.key = true;

//    key     ,           
if(set.key) { ... }
대상 으로 이 두 가지 집합의 결함 을 시 뮬 레이 션 하 다
대상 의 속성 명 은 문자열 이 어야 하기 때문에 문자열 이 아 닌 경우 해당 문자열 형식 으로 강제로 변환 합 니 다.
일반적으로 if 문 구 를 사용 하여 하나의 key 가 집합 에 존재 하 는 지 여 부 를 판단 합 니 다.  이 키 에 대응 하 는 value 가 false 이거 나 false 로 강제로 변환 할 수 있 을 때,  if 문 구 는 이 key 가 존재 하지 않 는 다 고 생각 합 니 다.그러나 사실은 존재 합 니 다.value=false 에 불과 합 니 다.
ES6 의 맵 과 Set 집합
다음은 이 두 가지 집합의 특징 을 정식으로 토론 한다
Map
Map 에 저 장 된 키-value 형식의 키 쌍,  그 중의 key 와 value 는 모든 종류의 것 일 수 있 습 니 다.  대상 도 key 로 할 수 있다.이것 은 대상 으로 모 의 하 는 방식 보다 훨씬 유연 하 다.
맵 생 성 및 초기 화
new Map()구조 함수 로 빈 맵 을 만 들 수 있 습 니 다.

//        Map 
let map = new Map();
맵()구조 함수 에 하나의 배열 을 입력 하여 맵 을 만 들 고 초기 화 할 수도 있 습 니 다.들 어 오 는 배열 은 2 차원 배열 입 니 다.그 중의 모든 배열 은 두 개의 요소 가 있 습 니 다.  전 자 는 키 로,  후 자 는 value 로,  이렇게 해서 키-value 키 값 쌍 이 형성 되 었 습 니 다.예 를 들 어:

//              Map 

let array = [ //         ,             
  ['key1' , 'value 1'],  // key       "key1", value      "value 1"
  [{} , 10086] ,     // key     , value     10086
  [ 5, {} ]       // key       , value    
];

let map = new Map(array); //       Map      

맵 사용 가능 한 방법
  • set(key,value):키 쌍 을 추가 합 니 다
  • get(key):key 가 존재 하지 않 으 면 undefined
  • 로 돌아 갑 니 다.
  • has(key):불 값 되 돌려 주기
  • delete(key):삭제 에 성공 하면 true 로 돌아 갑 니 다.  키 가 존재 하지 않 거나 삭제 에 실패 하면 false 로 돌아 갑 니 다
  • clear():모든 요 소 를 제거 합 니 다
  • size 속성,속성 값 은 map 에서 키 값 이 맞 는 개수 입 니 다.
    옮 겨 다 니 는 방법 forEach()
    배열 의 foreach 방법 과 유사 합 니 다.리 셋 함수 에는 3 개의 매개 변수 값,키,이 방법 을 호출 하 는 Map 집합 자체 가 포함 되 어 있 습 니 다.
    
    map.forEach(function(value, key, ownerMap){
      console.log(key, value); //      
      console.log(ownerMap === map); // true
    });
    
    집합 설정
    set 와 Map 의 가장 큰 차 이 는 키 키 만 있 고 value 가 없다 는 것 이다.  그래서 보통 어떤 요소(key)가 존재 하 는 지 판단 하 는 데 사 용 됩 니 다.
    맵 을 만 들 고 초기 화 하 는 방법 은 맵 과 대동소이 합 니 다.
    빈 set 를 만 들 수도 있 고 빈 set 를 배열 로 초기 화 할 수도 있 습 니 다.Map 과 달리 배열 은 1 차원 배열 이 고 모든 요 소 는 set 의 키 가 됩 니 다.예 를 들 어:
    
    //       
    let array = [1, 'str'];   //     
    
    //         set
    let set = new Set(array);
    
    
    set 방법
    1.add(key):set 에 요 소 를 추가 합 니 다.  여러 개의 인자 가 들 어 오 면 첫 번 째 만 들 어 갑 니 다.
    
    let set = new Set();
    set.add(1, 2, 3);
    console.log(set.has(1), set.has(2), set.has(3)); // true false false                  set
    2、has(key)
    3、delete(key)
    4、clear()
    옮 겨 다 니 는 방법 forEach
    맵 의 foreach 방법 과 비슷 합 니 다.  리 셋 함수 의 인자 도 3 개(value,  key,  owner Set).이치 상 set 에는 key 만 있 고 value 가 없 기 때문에  그러면 함수 에 value 라 는 인자 가 존재 하지 말 아야 합 니 다.그런데 왜 이 value 인 자 는 여전히 존재 합 니까?배열 과 Map 의 foreach 방법의 리 셋 함수 의 매개 변 수 는 모두 이 세 개 이기 때 문 일 수 있 습 니 다.  Set 에 대해 인 자 를 바 꾸 면 일치 성 을 잃 게 됩 니 다.이 유 는...
    그럼 value 가 없 으 면 이 value 의 값 은 무엇 입 니까?정 답 은 key 와 같 습 니 다.우 리 는 value 와 key 를 등호 로 그 을 수 있 습 니 다.아래 코드 는 이 견 해 를 검증 할 수 있 습 니 다.
    
    set.forEach(function(value, key, ownerSet){
      console.log(value === key, set === ownerSet);  // true true
    });
    
    Weak Set 과 Weak Map.
    이 두 집합 은 이전의 두 집합 보다 이름 앞 에 Weak 를 붙 였 다.  이 Weak 는 약 으로 직역 할 수 있 습 니 다.  이 약 은 약 한 인용 을 가리킨다.  그러면 앞 에 Weak 이 없 는 Set 과 Map 이 약 하지 않 고 강 합 니 다.  이 강 은 강 한 인용 을 가리킨다.
    Set 와 Map 의 차이
    표층 의 차 이 를 먼저 말 하 다.
  • 약 버 전 집합 키 는 대상 일 수 밖 에 없습니다.  value 의 유형 에 제한 이 없습니다.
  • 약 버 전 집합 은 forEach 방법 도 없고 for in 방법 도 없습니다.  배열 로 초기 화 할 수도 없습니다.
  • 약 한 버 전 은 사용 할 수 있 는 방법 이 적 습 니 다.WeakSet 은 add,has,delete 방법 만 사용 할 수 있 습 니 다.WeakMap 은 set,has,get,delete 방법 만 사용 할 수 있 습 니 다.
  • 근본 적 인 구별
    약 한 버 전의 집합 과 그들 에 대응 하 는 강 한 버 전의 근본 적 인 차 이 는 대상 에 대한 인용 강약 에 있다.  대상 은 키 위치의 대상,즉 대상 을 키 로 하 는 상황 을 가리킨다.
    강약 버 전 은 키 가 대상 일 때의 인용 메커니즘 에 대해 다음 과 같다.
    대상 을 key 로 설정 할 때 집합 에 이 대상 의 인용 을 저장 합 니 다.이 대상 이 다른 인용 이 없 을 때,즉 집합 만 이 대상 을 인용 하고 있 을 때 약 한 유형의 집합 은 이 대상 에 대한 인용 을 포기 하고 이 대상 을 집합 에서 제거 하여 집합 에 계속 존재 하지 못 하 게 합 니 다.어떤'모조리 죽여 라'는 뜻 도 있 습 니 다.그러나 강 한 유형의 집합 은 이 대상 에 대한 인용 을 계속 저장 하고 집합 에 두 기도 한다.이것 이 바로[Weak Set 과 Weak Map]과[Set 과 Map]의 근본 적 인 차이 이다.
    주의해 야 할 것 은 이 메커니즘 이 key 에 만 작용 하고 value 위치 에 연 결 된 대상 은 다른 인용 이 있 든 없 든 WeakMap 은 이 대상 을 포기 하지 않 습 니 다.이 위치의 key 바 인 딩 대상 이 다른 인용 이 없 을 때 만 key 와 value 를 포기 합 니 다.결정 권 은 key 위치 에 있 습 니 다.
    약 버 전 집합의 주요 용도
    버 전 집합 은 수명 주기 관리 가 필요 한 곳 에 사용 할 수 있다.예 를 들 어 하나의 DOM 대상 에 대한 인용 을 저장 할 수 있다.만약 에 하나의 DOM 대상 이 사용 되 고 다른 인용 이 없다 면 메모리 가 새 지 않도록 쓰레기 로 회수 해 야 한다.그러면 약 한 버 전의 집합 은 이러한 대상 을 저장 하 는 데 가장 적합 하 다.
    주의:네 가지 집합 은 모두 질서 가 있 습 니 다.즉,요소 가 추 가 된 순 서 는 내부 에 저 장 된 순서 입 니 다.배열 로 초기 화 된 집합 도 마찬가지 로 배열 의 위치 에 따라 순서대로 집합 에 추 가 됩 니 다.
    이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

    좋은 웹페이지 즐겨찾기