티스토리 뷰

FrontEnd/JavaScript

[JavaScript] Collection-Set

JINSUKUKU 2021. 10. 17. 19:02

📌  Collection

- Collection : 구조 또는 비구조화 형태로 프로그래밍 언어가 제공하는 값을 담을 수 있는 공간을 의미한다

- Collection은 내부적으로 Iterator를 가지고 있다 

- 자바 스크립트에서 제공하는 Collection의 종류에는 Indexed Collection와 keyed Collection이 있다

     1. Indexed Collection : index를 통해 가 element에 접근할 수 있다 (예) Array, Typed Array

     2. keyed Collection : 특정 문자열, 자료형을 통해 접근할 수 있다 (예) Object, Map, Weak Map, Set, Weak Set

 

* Iterator : 객체 지향적 프로그래밍에서 배열이나 그와 유사한 자료 구조의 내부의 요소를 순회하는 객체

 

📌  Set

- Set : value 만을 저장하며 중복을 허용하지 않는 Collection

 

 

💛  Set : 생성자

// 생성자
let set = new Set();
let num = new Set([ 1, 1, 2, 3, 4, 5]);
let str = new Set("Hello!");

console.log(set);   // Set(0) {}
console.log(num);   // Set(5) { 1, 2, 3, 4, 5 }
console.log(str);   // Set(5) { 'H', 'e', 'l', 'o', '!' }

 

- 생성자 : new Set();

- 다양한 자료형을 value로 가지며, 중복되는 value는 허용하지 않는다 

 

 

💛  Set : 요소 추가, 삭제, 전체 삭제

let set = new Set();

// 요소 추가
set.add(1);
set.add(2).add(3);
set.add(4).add(5).add(6);
console.log(set);   // Set(6) { 1, 2, 3, 4, 5, 6 }

// 요소 삭제
set.delete();
console.log(set);   // Set(6) { 1, 2, 3, 4, 5, 6 }

set.delete(9999);
console.log(set);   // Set(6) { 1, 2, 3, 4, 5, 6 }

set.delete(2);
console.log(set);   // Set(5) { 1, 3, 4, 5, 6 }

set.delete(6);
console.log(set);   // Set(4) { 1, 3, 4, 5 }

// 요소 전체 삭제
set.clear();
console.log(set);   // Set(0) {}

 

- 요소 추가 : set.add(value)

- 요소 삭제 : set.delete(value)

- 전체 삭제 : set.clear()

- set이 가지고 있는 요소가 아닌 경우, 아무것도 삭제하지 않는다

 

 

💛  Set : 요소 포함 여부 확인, 크기 확인

let set = new Set([ 1, 1, 2, 3, 4, 5]);

// 요소 포함 여부 확인
console.log(set);		// Set(5) { 1, 2, 3, 4, 5 }
console.log(set.has(10));   	// false
console.log(set.has(3));    	// true

// 크기 확인 
console.log(set.size);      	// 5

 

- 요소 포함 여부 확인 : set.has(value)

- 크기 확인 : set.size

 

 

💛  Set :  Iterator 속성

let str = new Set("Hello!");

console.log(str);                       // Set(5) { 'H', 'e', 'l', 'o', '!' }
console.log(str.keys());                // [Set Iterator] { 'H', 'e', 'l', 'o', '!' }
console.log(str.values());              // [Set Iterator] { 'H', 'e', 'l', 'o', '!' }
console.log(str.entries());
// [ 'H', 'H' ] [ 'e', 'e' ] [ 'l', 'l' ] [ 'o', 'o' ] [ '!', '!' ]

for (let item of str) console.log(item);                // H e l o !
for (let item of str.keys()) console.log(item);         // H e l o !
for (let item of str.values()) console.log(item);       // H e l o !
for (let item of str.entries()) console.log(item);      
// [ 'H', 'H' ] [ 'e', 'e' ] [ 'l', 'l' ] [ 'o', 'o' ] [ '!', '!' ]

 

- Collection 객체인 Set은 Iterator 속성을 가지고 있으므로, for-of문을 통한 반복문 수행이 가능하다

- Collection 에는 value만 존재하고 key가 없기 때문에, set.values()와 set.keys()의 결괏값이 동일하다

- Set은 value만 가지지만 set.entries()은 key-value의 형태로 반환되는데, 이는 Map과의 호환성을 위함이다

- 결국은 set.keys()와 set.value()가 값은 결과를 호출한다

 

 

 

 

 

'FrontEnd > JavaScript' 카테고리의 다른 글

[JavaScript] Date  (0) 2021.10.24
[JavaScript] Math  (0) 2021.10.19
[JavaScript] Collection-Map  (0) 2021.10.17
[JavaScript] 생성자  (0) 2021.10.15
[JavaScript] 배열(Array)  (0) 2021.10.10
댓글
«   2024/12   »
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
최근에 올라온 글
글 보관함
Total
Today
Yesterday