일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
- nextjs .env
- react env
- bootstrap
- dart 변수
- git lab
- ngrok설치
- npm styled-reset
- rewrites
- react typescript
- API 토큰
- ngrok실행
- CSS
- Git
- nextjs 설치
- There isn’t anything to compare
- input type=file
- SCSS
- next.js css
- createGlobalStyle
- react
- github io
- typescript react
- getModifierState
- 컨디셔널 렌더링
- nextjs
- github
- icon
- styled components
- API token
- fetch
- Today
- Total
꾸준히 성장하는 개발자
[JS 자료구조] JS 해시테이블 - map 본문
JS에서 key-value로 이루어진 자료구조는 Object가 대표적이었지만,
ES6에서 Map 과 Set이 추가되었다
그래서 JavaScript에서 해시테이블은 대표적으로 Object, Map, Set이 있다.
그 중 Map을 알아보자
Map
Map 객체는 키와 값의 쌍으로 이루어진 컬렉션이다.
Map 객체는 Object와 유사하지만 다음과 같은 차이가 있다.
구분 | Object 객체 | Map 객체 |
키로 사용할수 있는 값 | 문자열 또는 심벌 값 | 객체를 포함한 모든 값 |
이터러블 | x | o |
요소 개수 확인 | Objext.keys(obj).length | map.size |
Map 객체의 생성
: Map 객체는 Map 생성자 함수로 생성한다. Map 생성자 함수에 인수를 전달하지 않으면 빈 Map 객체가 생성된다.
const map = new Map();
console.log(map) // map(0) {}
요소 개수 확인 - Map.prototype.size
const {size} = new Map([['key1', 'value1'], ['key2', 'value2']])
console.log(size); // 2
요소 추가 - Map.prototype.set
: set메서드는 새로운 요소가 추가된 Map 객체를 반환한다. 따라서 set메서드를 호출한 후에 set메서드를 연속적으로 호출할 수 있다.
const map = new Map()
map
.set('key1', 'value1')
.set('key2', 'value2');
console.log(map); // Map(2) {"key1" =>"value1", "key2" =>"value2"}
요소취득 - Map.prototype.get
:Map 객체에서 특정요소를 취득할때 사용한다. get 메서드의 인수로 키를 전달하면 Map 객체에서 인수로 전달한 키를 갖는 값을 반환단다. 인수로 전달한 키를 갖는 요소가 존재하지 않으면 undefined를 반환한다.
const map = new Map();
const lee = { name: 'lee' };
const kim = { name: 'kim' };
map
.set(lee, 'developer')
.set(kim, 'designer');
console.log(map.get(lee)); // developer
console.log(map.get('key')); // undefined
요소 존재 여부 확인 - Map.prototype.has( )
: Map 객체에 특정 요소가 존재하는지 확인한다. has메서드는 특정 요소의 존재 여부를 나타내는 불리언 값을 반환한다.
const lee = { name: 'lee' };
const kim = { name: 'kim' };
const map = new Map([[lee, 'developer'], [kim, 'designer']])
console.log(map.has(lee)); // true
console.log(map.has('key')); // false
요소 삭제 - Map.prototype.delete
: Map 객체의 요소를 삭제할때 사용한다. delete 메서드는 삭제 성공여부를 나타내는 불리언 값을 반환한다.
const lee = { name: 'lee' };
const kim = { name: 'kim' };
const map = new Map([[lee, 'developer'], [kim, 'designer']])
map.delete(kim);
console.log(map); // Map(1) {{name: "lee"} => "developer"}
요소 일괄 삭제 - Map.prototype.clear
: Map 객체의 요소를 일괄 삭제할때 사용한다. clear메서드는 언제나 undefined를 반환한다.
const lee = { name: 'lee' };
const kim = { name: 'kim' };
const map = new Map([[lee, 'developer'], [kim, 'designer']])
map.clear();
console.log(map); // Map(0){}
요소 순회 - Map.prototype.forEach
: Map.prototype.forEach메서드는 Array의 forEach메서드와 유사하게 콜백함수와 forEach메서드의 콜백함수 내부에서
this로 사용될 객체를 인수로 전달한다.
'자료구조 & 알고리즘' 카테고리의 다른 글
[JS 자료구조] JS - Set (0) | 2022.05.06 |
---|---|
[JavaScript] 스택(stack) / 큐(que) (0) | 2022.03.31 |