ES6 학습 의 길 9 - --- Map 데이터 구조

ES6 학습 의 길 9 - --- Map 데이터 구조
맵 데이터 구조 가 무엇 입 니까?
Map 데이터 구 조 는 대상 과 유사 하고 키 값 이 맞 는 집합 이지 만 '키' 의 범 위 는 문자열 에 국한 되 지 않 으 며 각종 유형의 값 (대상 포함) 을 키 로 사용 할 수 있 습 니 다.실례:

//ES5:
var obj = {},arr = {'a':1};
obj[arr] = 'Array';
console.log(obj);//{'[object Object]':'Array'}

//ES6:
let map = new Map(),obj = {'a':1};
map.set(obj,'Array');
console.log(map);//{{…} => "Array"}
map.get(obj);//"Array"
map.has(obj);//true
map.delete(obj);//true
map.has(obj);//false

위의 인 스 턴 스 를 통 해 알 수 있 듯 이 ES5 때 대상 의 키 값 은 모두 문자열 이 고 문자열 이 아니라면 암시 적 으로 문자열 로 변환 되 며 저 장 된 결 과 는 최초의 취지 가 아 닙 니 다.map 데이터 구 조 는 키 값 을 여러 종류의 값 으로 만 드 는 것 입 니 다.
맵 을 만 들 고 구성원 의 형식 을 초기 화 합 니 다.
맵 은 구조 함수 로 서 하나의 배열 을 매개 변수 로 받 아들 일 수 있 습 니 다.이 배열 의 구성원 은 키 값 이 맞다 는 것 을 나타 내 는 배열 이다.
실례:

let map = new Map([
  ['autnor', 'Rattenking'],
  ['age', '26'],
  ['sex','gentleman']
]);

map.size // 3
map.has('autnor'); // true
map.get('autnor'); // "Rattenking"
map.has('age'); // true
map.get('age'); //"26"
map.has('sex'); // true
map.get('sex'); //"gentleman"
console.log(map);//{"autnor" => "Rattenking", "age" => "26", "sex" => "gentleman"}

맵 초기 데이터 의 원 리 를 실현 하 다

let arr = [
  ['autnor', 'Rattenking'],
  ['age', '26'],
  ['sex','gentleman']
]
let map = new Map();
arr.forEach(current => map.set(current[0],current[1]));
console.log(map);//{"autnor" => "Rattenking", "age" => "26", "sex" => "gentleman"}

주의 사항
1. Iterator 인 터 페 이 스 를 가지 고 모든 구성원 이 하나의 이중 요소 인 배열 의 데이터 구 조 는 Map 구조 함수 의 매개 변수 로 할 수 있다.

let set = new Set([['autnor', 'Rattenking'],['age', '26']]);
let map = new Map(set);
console.log(map);//{"autnor" => "Rattenking", "age" => "26"}

2. 같은 키 에 여러 번 값 을 부여 하면 뒤의 값 은 앞의 값 을 덮어 씁 니 다.

let map = new Map();
map.set('autnor','Rattenking');
map.set('autnor','Stone');
map.get('autnor');//"Stone"

알 수 없 는 키 를 읽 으 면 undefined 로 돌아 갑 니 다.

let map = new Map([['a',1]]);
map.get('a');//1
map.get('b');//undefined

4. 같은 대상 에 대한 인용 만 이 맵 구 조 를 같은 키 로 간주한다.

let map = new Map();
map.set(['autnor'],'Rattenking');
map.get(['autnor']);//undefined

5. 같은 이치 로 미 룰 수 있 습 니 다. 같은 값 의 두 인 스 턴 스 는 Map 구조 에서 두 개의 키 로 여 겨 집 니 다.

let map = new Map();
let arr1 = ['autnor', 'Rattenking'];
let arr2 = ['autnor', 'Rattenking'];
map
.set(arr1,'Rattenking')
.set(arr2,'Stone');
console.log(map);//{Array(2) => "Rattenking", Array(2) => "Stone"}
map.get(arr1);//"Rattenking"
map.get(arr2);//"Stone"

결론: 맵 의 키 는 실제 메모리 주소 와 연결 되 어 있 으 며 메모리 주소 가 다 르 면 두 개의 키 로 간주 합 니 다.이것 은 동명 속성 충돌 (clash) 문 제 를 해결 합 니 다. 우리 가 다른 사람의 라 이브 러 리 를 확장 할 때 대상 을 키 이름 으로 사용 하면 자신의 속성 과 원작 자의 속성 동명 이인 을 걱정 하지 않 아 도 됩 니 다.
6. NaN 은 엄격 하지 않 지만 맵 에 서 는 같은 키 값 으로 여 겨 집 니 다.다른 키 값 은 엄격 한 동일 (= = =) 에 따라 같은 키 값 인지 아 닌 지 를 판단 합 니 다.

let map = new Map();

NaN === NaN//false
map.set(NaN,1);
map.get(NaN);//1

-0 === 0 && 0 === +0 && -0 === +0//true
map.set(-0,'num');
map.get(+0);//'num'

undefined === null//false
map.set(undefined, undefined);
map.set(null, null);
map.get(undefined);//undefined
map.get(null);//null

true === 'true'//false
map.set(true,'bool');
map.get('true');//undefined

Map 실례 의 조작 속성 과 방법

size 속성 은 맵 구조의 구성원 총 수 를 되 돌려 줍 니 다.

set 방법 은 키 이름 key 에 대응 하 는 키 값 을 value 로 설정 하고 전체 맵 구 조 를 되 돌려 줍 니 다.

get 방법 은 key 에 대응 하 는 키 값 을 읽 고 key 를 찾 지 못 하면 undefined 로 돌아 갑 니 다.

has 방법 은 현재 맵 대상 에 있 는 키 를 찾 아 불 값 을 되 돌려 줍 니 다.

delete 방법 은 키 를 삭제 하고 불 값 을 되 돌려 줍 니 다.

clear 방법 은 모든 구성원 을 제거 하고 반환 값 이 없습니다.

Map 실례 를 옮 겨 다 니 는 방법

keys (): 키 이름 을 되 돌려 주 는 달력 입 니 다.

values (): 키 값 을 되 돌려 주 는 달력 입 니 다.

entries (): 모든 멤버 의 달력 을 되 돌려 줍 니 다.

foreach (): 맵 을 옮 겨 다 니 는 모든 멤버.

요약:

Iterator 인 터 페 이 스 를 가지 고 있 으 며 모든 구성원 이 하나의 이중 요소 인 배열 의 데이터 구 조 는 Map 구조 함수 의 매개 변수 로 사용 할 수 있 습 니 다. -Map 구조 함수 의 매개 변수

같은 키 에 여러 번 값 을 부여 하면 뒤의 값 은 앞의 값 을 덮어 씁 니 다. -같은 이름 키 의 할당 값 은 앞의 값 을 덮어 씁 니 다

알 수 없 는 키 를 읽 으 면 undefined 로 돌아 갑 니 다. -맵 에 존재 하지 않 는 키 값 을 가 져 와 undefined

로 되 돌려 줍 니 다.

같은 대상 에 대한 인용 만 이 맵 구 조 를 같은 키 로 간주한다. -메모리 주소 가 같은 인용 만 Map 구 조 를 같은 키 로 볼 수 있 습 니 다

Map 구 조 는 NaN 이 같은 키 값 인 것 을 제외 하고 다른 값 의 키 값 은 모두 엄격하게 같은 연산 자 (= =) 를 따른다.

기타
나의 블 로그, 교 류 를 환영 합 니 다!
나의 CSDN 블 로그, 교 류 를 환영 합 니 다!
위 챗 애플 릿 칼럼
전단 필기 란
위 챗 애플 릿 일부 고 덕 지도 기능 구현 데모 다운로드
위 챗 애플 릿 이 MUI 의 일부 효 과 를 구현 하 는 데모 다운로드
위 챗 애플 릿 MUI 구현 GIT 프로젝트 주소
위 챗 애플 릿 인 스 턴 스 목록
전단 노트 목록
게임 목록
posted @
2017 - 12 - 14 13: 29 뉴 먼 리 읽 기
...) 댓 글 (
...) 모음 집 편집