5. [Proxy Trap 1~4챕터] 자바스크립트 완전 끝내기: ES6+ 심화

1. set() 트랩-1: set(), set() 트랩 호출, set() 트랩 준수사항

세트(Set)는 자바스크립트에서 고유한 값들의 집합을 다루는 자료구조이다. 이를 활용하면 데이터 중복을 제거하고 유일한 값들을 효과적으로 관리할 수 있다.

세트(set)는 한마디로 순서가 없는 중복되지 않은 데이터의 집합이다. 배열(array)과 차이점을 이해하는 것이 무엇보다 중요하다.

배열은 데이터를 순서 있게 저장한다. 그래서 인덱스(index)를 통해서 특정 위치에 저장되어 있는 데이터에 접근이 가능하다. 그리고 배열에는 동일한 값을 여러 번 저장할 수 있다. 값이 동일하더라도 인덱스가 틀리기 때문에 데이터의 중복이 문제 되지 않는다.

반면에 세트는 얼핏 보기에는 배열과 비슷해보일 수 있지만 사실 결이 아주 다른 자료구조이다. 우선 세트는 데이터를 순서 없이 저장한다. 따라서 배열처럼 인덱스를 통해서 접근할 수가 없다.

그리고 세트는 중복된 데이터를 허용하지 않는다.

즉, 기존에 세트에 있는 값을 또 추가하면 아무 효력이 발생하지 않는 것.

---

const set = new Set(); // Set(0) {size: 0}

set을 호출하는 간단한 코드는 위와 같다. new 연산자를 사용해주면 된다.

호출

set은 인스터스를 이용해서 프로퍼티를 설정할 수 있고, 또한 target을 이용해서 값도 설정할 수 있다.

또한, set 함수는 사용할 때 여러 준수 사항들이 존재한다. 

프로퍼티 값을 설정하고 싶어도 기존의 target의 writable 값이 false면 설정이 안 된다.

---

2. set() 트랩-2: set()의 4번째 파라미터, set()과 this

set 함수의 4번째 파라미터에는 proxy 인스턴스가 설정된다.

(proxy는 중간 역할을 해주는 친구라고 기억하면 된다!)

또한, set에서 this는 핸들러를 참조한다. 핸들러에서 book은 책이 된다.

---

3. get() 트랩: get(), get() 트랩 호출, get() 트랩 준수사항

get()

getter(획득자)라고도 불린다.

property를 읽으려고 할 때 함수를 호출(실행)하여 값을 리턴한다.

즉 함수에서 리턴하는 값이 property 값이 된다.

위는 get을 호출하는 형태이다.

let myFriend ={
  get name(){
    return 'Jin Woo';
  }
}

console.log(myFriend.name); // Jin Woo

간단하게 코드를 위와 같이 작성도 가능하다. 결국 get은 "가져오는" 함수인 것이다.

준수사항은 위의 set과 정말 유사하다. (거의 똑같다고 말할 수 있다.)

---

4. has() 트랩, deleteProperty() 트랩

Set 인스턴스의 has() 메서드는 지정된 값을 가진 요소가 이 집합에 존재하는지 여부를 나타내는 boolean를 반환하는 함수이다.

즉 true/false을 판단한다.

has 함수의 준수사항은 위와 같다. 

---

프로퍼티를 삭제해 주는 deleteProperty 함수이다.

프로퍼티가 없어도 true을 반환해 주는 특성을 가지고 있다.

deleteProperty 함수의 준수사항이다. 함수의 프로퍼티 값이 false이면 에러가 발생된다.

결론

(복습) 핸들러에는 get과 set 함수가 있다.