-
GettersStudy/JavaScript 2020. 5. 6. 18:19
Getters
Getters are methods that get and return the internal properties of an object. But they can do more than just retrieve the value of a property! Let’s take a look at a getter method:
게터(getter)는 객체의 내부 특성을 가져오고 반환하는 방법이다.
하지만 그들은 단지 property의 value를 되찾는 것 이상의 것을 할 수 있답니다! Getter 방법을 살펴봅시다:
const person = { _firstName: 'John', _lastName: 'Doe', get fullName() { if (this._firstName && this._lastName){ return `${this._firstName} ${this._lastName}`; } else { return 'Missing a first name or a last name.'; } } } // To call the getter method: person.fullName; // 'John Doe'
Notice that in the getter method above:
- We use the get keyword followed by a function.
- We use an if...else conditional to check if both _firstName and _lastName exist (by making sure they both return truthy values) and then return a different value depending on the result.
- We can access the calling object’s internal properties using this. In fullName, we’re accessing both this._firstName and this._lastName.
- In the last line we call fullName on person. In general, getter methods do not need to be called with a set of parentheses. Syntactically, it looks like we’re accessing a property.
Notice that in the getter method above:
- 우리는 함수에의해 따라온 get 키워드를 사용한다.
- 우리는 _firstName 과 _lastName 둘다 존재하는지 확인하기 위해 if..else 조건식을 사용하고 그리고 결과에 따라 다른 값을 리턴한다.
- 우리는 this를 사용하여 호출하는 개체의 내부 속성에 접근할 수 있다. fullName에서, 우리는 this._firstName과 this._lastName둘다 접근한다.
- 변수 person에서 우리는 마지막 줄에서 fullName을 호출할 수 있다. 일반적으로 getter메서드는 괄호와 호출될 필요가 없다.
Now that we’ve gone over syntax, let’s discuss some notable advantages of using getter methods:
- Getters can perform an action on the data when getting a property.
- Getters can return different values using conditionals.
- In a getter, we can access the properties of the calling object using this.
- The functionality of our code is easier for other developers to understand.
이제 구문을 살펴보았으니 게터 방법을 사용할 때의 몇 가지 주목할 만한 이점에 대해 이야기해 봅시다.
- Getters는 속성을 얻을 때 데이터에 대한 액션을 수행할 수 있다.
- Getters는 조건문을 사용하여 다른 value들을 리턴할 수 있다.
- getter에서 우리는 this를 사용하는 객체 호출의 property에 접근할 수 있다.
- 우리 코드의 기능은 다른 개발자들이 이해하기 더 쉽다.
Another thing to keep in mind when using getter (and setter) methods is that properties cannot share the same name as the getter/setter function. If we do so, then calling the method will result in an infinite call stack error. One workaround is to add an underscore before the property name like we did in the example above.
Great, let’s go getter!
게터(및 세터) 방법을 사용할 때 유의해야 할 또 다른 사항은 속성이 게터/세터 기능과 동일한 이름을 공유할 수 없다는 점이다.
만약 그렇게 한다면, 메소드를 호출하면, 무한 통화 스택 오류가 발생할 것이다. 한 가지 해결 방법은 위의 예에서처럼 속성 이름 앞에 밑줄을 추가하는 것이다.
const robot = { _model: '1E78V2', _energyLevel: 100, get energyLevel(){ if(typeof this._energyLevel === 'number') { return 'My current energy level is ' + this._energyLevel } else { return "System malfunction: cannot retrieve energy level" } } }; console.log(robot.energyLevel);
'Study > JavaScript' 카테고리의 다른 글
Setters (0) 2020.05.07 getter와 setter 차이점 (0) 2020.05.07 Array.prototype.every() (0) 2020.05.06 arrow function ex. (0) 2020.05.02 Higher order function (0) 2020.05.02