반응형
05-14 05:47
Today
Total
«   2024/05   »
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
관리 메뉴

개발하는 고라니

[Javascript] Collections 본문

Languages/JS

[Javascript] Collections

조용한고라니 2021. 6. 17. 11:38
반응형

Collection

  • List
  • Map
  • Set

프로그래밍 언어에는 종류에 상관없이 Map, Set, List 컬렉션을 지원한다. 하지만 JS의 경우 ES 6 이전에 List밖에 없었고, 다음 버전인 ES 6에서는 나머지 컬렉션들이 추가가 되었다.

Set

let set = new Set();

set.add(5);
set.add("5");
set.add('ok');
set.add(true);
set.add(5);

console.log(set.size); //4

Set은 흔히 알고있듯, Value가 Key가 되는, 즉 하나의 Value의 중복을 허용하지 않는 컬렉션이다.

 

그래서 배열의 중복제거를 위해 종종 사용되기도 한다.

const arr = [2, 2, 3, 8, 1, 10, 2, 5, 3, 5, 8, 7, 0];
const set_ = new Set(arr);

console.log(`arr's length : ${arr.length}`); //13
console.log(`set's size : ${set_.size}`); //8

 

※ 전체를 나열하는 서비스

  • forEach : ES 5부터 지원되어옴 (for - in ==> 키를 뽑아주는 제어 구조)
  • iterator : ES 6부터 지원하는 새로운 방법 (for - of ==> 값을 뽑아주는 제어 구조)
//forEach
set_.forEach((value, key, itself) => {
    console.log(`${key} : ${value}`);
});

Instance Methods

  • add(value) : 값 추가
  • has(value) : 값 있는지 체크
  • clear() : set 비우기
  • delete(value) : 값 제거

Map

let map = new Map();
map.set('id', 1);
map.set('title', 'map이란?');

//Values 뽑아보기
for(let v of map.values())
    console.log(v);
    
//Keys 뽑아보기
for(let k of map.keys())
    console.log(k);
    
//Key : Value 뽑아보기
for(let [k, v] of map)
    console.log(`${k} : ${v}`);
    
//Key : Value 뽑아보기
for(let [k, v] of map.entries())
    console.log(`${k} : ${v}`);

# List는 생략

반응형

'Languages > JS' 카테고리의 다른 글

[Javascript] Scroll 페이징  (0) 2021.06.19
[Javascript] Function  (0) 2021.06.17
[Javascript] Image 미리보기  (0) 2021.05.27
[Javascript] Ajax 모듈  (0) 2021.05.06
[Javascript] Ajax  (0) 2021.04.29
Comments