자바스크립트 Proxy

HyosikPark·2020년 10월 24일
0

Javascript

목록 보기
17/26
post-custom-banner

Proxy

특정 객체를 감싸서 객체에 행해지는 작업을 중간에 가로채어 제약을 걸 수 있다.

get handler

객체에 없는 프로퍼티를 가져오더라도 undefined가 아닌 다른 값을 반환하게 
하는 등의 기능을 추가할 수 있다.

let obj = {name: 'gs', age: 24 }
obj = new Proxy(obj, {
  get(target, prop, receiver) {
   if(prop in target) // 프로퍼티를 불러오려고 할 때  {
	return target[prop] 
} else {
  	return prop // 값이 없어도 프로퍼티키를 반환 // obj.coo = 'coo'	
}}})

set handler set(target, prop, value, receiver)

반환 값은 true false로 이루어져야하며 성공적이게 할 경우 true 아닐경우 false를 리턴하면 된다.

ex) 배열에 숫자만 넣을 수 있도록 제약을 걸고 싶을 경우
let arr = [];
arr = new Proxy(arr, {
  set(target,prop,value) {
    if(typeof value === 'number') {
	target[prop] = value;
	return true;
} else return false
}})

ownKeys handler로 반복문 제어하기
객체에 _로 시작하는 프로퍼티는 반복문에 포함 안시키는 방법
let obj = new Proxy(obj, {
  ownKeys(target) {
    return Object.keys(target).filter(key => !key.startsWith('_'));
}
})

참고

https://ko.javascript.info/

post-custom-banner

0개의 댓글