개발자의 공부방/Frontend

javascript] getter setter

  • -
728x90
반응형

 

Getter와 Setter에 대해서 알아보자.
const numbers = { a: 1, b: 2, get sum() { console.log('sum 함수 실행!') return this.a + this.b; } }; console.log(numbers.a) numbers.b = 5; console.log(numbers.sum)

get 함수는 특정 함수를 조회하려고 할 때 특정 코드를 실행시키고 연산된 값을 받아서 사용할 수 있다.

 

numbers() 이런 식으로 사용하지 않아도 된다.

 

const dog = { _name: '멍멍이', set name(value) { //params를 무조건 설정해야한다. console.log('이름이 바뀐다' + value) this._name = value; } }; console.log(dog._name); dog.name = '뭉뭉쓰' console.log(dog._name);

set 함수는 어떤 값을 설정할 때 마다 사용한다.

 

const numbers = { _a: 1, _b: 2, sum: 3, calculate() { console.log('계산기') 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); numbers.a = 5; console.log(numbers.sum)

이 간단한 로직은 get set을 활용한 것인데

 

calculate를 조회하면서 numbers a나 b에 값을 대입하고 덧셈을 해서 sum 이라는 변수에 값을 업데이트하게 되는 로직이다.

 

마지막 numbers.a 를 조회하면 알겠지만 값이 변해야지만 계산이 되는 것을 알 수 있다.

반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.