js 에서 getter 와 setter 용법 사례 분석
Vue 계산 속성 을 배 울 때"계산 속성 은 기본적으로 getter 만 있 지만 필요 할 때 setter 를 제공 할 수 있 습 니 다"라 는 말 이 있 습 니 다.
getter 와 setter 는 도대체 무엇 입 니까?그래서 나 는 자 료 를 찾 았 다.
Es5 에 서 는 getter 와 setter 부분 을 사용 하여 기본 동작 을 바 꿀 수 있 지만 하나의 속성 에 만 적용 되 며 전체 대상 에 적용 할 수 없습니다.getter 는 속성 값 을 가 져 올 때 호출 되 는 숨겨 진 함수 입 니 다.setter 도 숨겨 진 속성 입 니 다.속성 값 을 설정 할 때 호출 됩 니 다.
예:
var myObject = {
get a(){
return 2
}
};
Object.defineProperty(
myObject, //
"b", //
{ //
// b getter
get:function(){
return this.a*2
},
// b
enumerable:true
}
);
console.log(myObject.a) //2
console.log(myObject.b) //4
대상 문자 문법
get a( ) { ...... }이 든defineProperty(......)의 명시 적 정의 든 둘 다 대상 에 값 이 포함 되 지 않 는 속성 을 만 듭 니 다.이 속성 에 대한 방문 은 숨겨 진 함 수 를 자동 으로 호출 합 니 다.반환 값 은 속성 방문 의 반환 값 으로 사 용 됩 니 다.(즉myObject.a실행 괄호 를 추가 하지 않 아 도 되 고 vue 에서 계산 속성 은 기본적으로getter있 으 며 호출 계산 속성 은 뒤에'( )'를 추가 하지 않 아 도 된다 는 것 이다.
var obj = {
// a getter
get a(){
return 2;
}
};
obj.a = 3;
console.log(obj.a); //2
a 에 대해 getter 만 정 의 했 기 때문에 a 에 대한 set 작업 은 할당 작업 을 무시 하고 잘못 던 지지 않 습 니 다.그리고 합 법 적 인 setter 가 있 더 라 도 사용자 정의 getter 는 2 만 되 돌아 오기 때문에 set 작업 은 의미 가 없습니다.
자 바스 크 립 트 와 관련 된 내용 에 관심 이 있 는 독자 들 은 본 사이트 의 주 제 를 볼 수 있 습 니 다.,,,javascript 대상 입문 강좌,JavaScript 상용 함수 기법 집합,JavaScript 오류 및 디 버 깅 기술 요약,JavaScript 데이터 구조 와 알고리즘 기술 총화과JavaScript 스 트 리밍 알고리즘 및 기술 총화.
본 고 에서 말 한 것 이 여러분 의 자 바스 크 립 트 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[2022.04.19] 자바스크립트 this - 생성자 함수와 이벤트리스너에서의 this18일에 this에 대해 공부하면서 적었던 일반적인 함수나 객체에서의 this가 아닌 오늘은 이벤트리스너와 생성자 함수 안에서의 this를 살펴보기로 했다. new 키워드를 붙여 함수를 생성자로 사용할 때 this는...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
