[JS] 중복없는 자료구조, Set

ES6부터 JS에 새로운 자료구조인 map과 set이 추가되었다.
set은 일반적인 배열구조에서 중복값이 없는 집합구조라는 것이 가장 큰 특징이다.

배열(array)과 집합(set)의 차이

배열

배열은 3의 값을 가지는 인자가 두개 이상 있어도 모두 출력된다.

집합

집합은 3의 값을 가지는 인자가 여러개라면 중복이 제거되어서 1,2,3만 저장된다.

(첫 인자로 보이는 size:3은 크기를 나타냄)

 

Set생성 및 추가 - new, add

방법 1.

아무 인자도 주지 않고 정의된다. 후에 인자를 추가해줘야 함

 

방법 2.

정의하면셔 add를 사용해 인자를 추가하여 생성한 뒤 후에 인자를 추가했다.

또한 콘솔창을 보면 눈치챌 수 있듯이 set은 arr의 length대신 size를 사용해 크기를 표현한다.

 

방법 3.

정의 시에 초기 인자를 모두 주면서 생성한다.

 

Set 삭제 - delete, clear

특정 값의 인자만 삭제

1,2,3의 인자를 가지는 set에서 3을 지워보려 한다.

3의 인자가 삭제되고 set에는 1,2가 남게된다.

집합의 모든 인자 삭제

clear는 모든 인자를 삭제하여 set을 출력하면 size가 0이라고 나온다.

 

집합 출력과 인자에 접근 - spread, forEach, keys, values

spread로 배열 형변환

spread를 통해 집합 set을 출력하면 각 인자가 펼쳐져서 나온다.

또 여기에 배열형태인 [ ]대괄호를 씌워준다면 아래처럼 배열의 형태로 출력이된다.

집합의 인자는 위와같이 인덱스로 접근이 불가능하다. set[0] -> undefined

따라서 spread를 사용해 배열의 형태로 형변환을 한 후 접근하면 가능하다.

forEach로 집합출력

집합은 인덱스로 인자에 접근이 불가하기 때문에 일반 for문으로 출력을 할 시 undefined만이 출력된다.

따라서 반복문으로 집합을 출력할 시 forEach문을 사용한다.

위 아래 둘다 같은 결과를 리턴한다.

for ~ of로 집합출력

집합을 출력할 때는 for~in대신 for~of를 사용하여 출력이 가능하다.

집합의 keys, values 메서드

집합의 인자를 가르키기 위한 또 다른 방법 중 하나는 key-value를 이용하는 것이다.

두 메서드 모두 set의 시작점을 가르키게 되고 next()를 적용할 때마다 다음 주소지를 가르킨다.

 

집합 관련 또다른 메서드 -entries

집합에 entries를 적용하면 각 요소가 키-값의 배열요소로 반환된다.

ex) set의 첫번째 요소 => 'A' 두 문자를 인자로 가지는 배열

위의 keys와 values메서드를 사용할 때도 보았듯이

set의 키-값은 같은 값을 가진 인자들로 이루어져 있는 것이 아닐까 추측할 수 있는 부분이다.