WEB/Java Script
[Java Script] getter함수 , setter함수
자바칩 프라푸치노
2021. 4. 22. 23:50
getter setter
const numbers ={
a:1,
b:2
};
numbers.a = 5;
console.log(numbers);
객체에 값을 대입하면 값이 변한다.
당연히
const numbers ={
a:1,
b:2,
get sum(){
console.log('sum 함수가 실행됩니다!');
// getter에서는 특정 값이 무조건 반환되어야한다.
return this.a + this.b;
}
};
console.log(numbers.sum);
// 조회만 했을 뿐인데 실행이 된다.
numbers.b = 5;
console.log(numbers.sum);
이제는 getter함수를 보자
객체 안에 getter함수를 정의해주었다.
getter에서는 무조건 return이 있어야한다.
const dog = {
_name : '멍멍이',
set name(value){
// 파라미터로 무조건 값을 설정해주어야한다.
console.log('이름이 바뀝니다..' + value);
this._name = value;
}
}
console.log(dog._name);
dog.name = '뭉뭉이';
이제 setter함수를 보자
setter함수는 값을 set하는 것이기 때문에 파라미터로 어떤 값을 넣어야한다.
dog.name 에 뭉뭉이를 넣으니 setter함수가 실행이 되었는 것을 볼 수 있다.
const numbers={
_a:1,
_b:2,
sum: 3,
calculate(){
console.log('calculate');
this.sum = this._a + this._b;
},
get a(){
return this._a;
},
get b(){
return this._b;
},
set a (value){
this._a = value;
this.calculate();
},
set b (value){
this._b = value;
this.calculate();
}
};
console.log(numbers.sum);
// setter함수를 호출했다는 뜻이다.
// getter함수는 어떤 값을 조회, setter는 수정하기에 유용하다
numbers.a = 5;
numbers.b = 9;
console.log(numbers.sum);
이 코드를 보면 getter와 setter함수가 정의되어있다.
값을 새로 대입할때마다 setter함수가 실행된다.
728x90