ES6 게터 / 세터 (화살표 기능 포함)
나는 babel6을 사용하고 있고 내 애완 동물 프로젝트를 위해 사용할 수있는 방법에 대해 XMLHttpRequest에 대한 래퍼를 만들고 있습니다.
open = (method, url, something) => {
return this.xhr.open(method, url, something);
}
하지만 속성 화살표 기능이 작동하지 않습니다.
이것은 작동합니다 :
get status() { return this.xhr.status; }
하지만 사용할 수 없습니다
get status = () => this.xhr.status;
의도적입니까?
ES2015 문법에 따르면 객체 리터럴의 속성 은 다음 네 가지 중 하나 일 수 있습니다.
PropertyDefinition :
- IdentifierReference
- PropertyName
:
할당 표현- MethodDefinition
선행을 허용하는 이러한 유형 중 유일한 get
것은 MethodDefinition입니다 .
MethodDefinition :
- PropertyName
(
StrictFormalParameters)
{
FunctionBody}
- GeneratorMethod
get
PropertyName(
)
{
FunctionBody}
set
PropertyName ( PropertySetParameterList)
{
FunctionBody}
보시다시피, get
양식 은 형식이어야하는 매우 제한된 문법을 따릅니다.
get NAME () { BODY }
문법은 형식의 기능을 허용하지 않습니다 get NAME = ...
.
받아 들여지는 대답은 훌륭합니다. 압축 된 "화살표 함수 구문" 대신 일반 함수 구문 을 사용하려는 경우 가장 좋습니다 .
하지만 화살표 기능을 정말 좋아할 수도 있습니다. 일반 함수 구문으로 대체 할 수없는 다른 이유로 화살표 함수를 사용할 수 있습니다 . 다른 솔루션이 필요할 수 있습니다.
예를 들어, OP가를 사용하는 것을 알았습니다 . 어휘 적this
으로 바인딩this
할 수 있습니다 . 일명 "non-binding of this" ), 화살표 함수는 어휘 바인딩에 좋습니다.
이 Object.defineProperty
기술을 통해 getter와 함께 화살표 함수를 계속 사용할 수 있습니다 .
{
...
Object.defineProperty(your_obj, 'status', {
get : () => this.xhr.status
});
...
}
관련 항목의 언급 object initialization
기술 (일명 get NAME() {...}
) 은 VS defineProperty
기술 (일명 get : ()=>{}
) . 최소한 하나의 중요한 차이가 있습니다. 사용 defineProperty
하려면 변수가 이미 있어야합니다.
기존 객체에 게터 정의
즉, (내 예에서는) 존재하고 변수에 저장되어 Object.defineProperty
있는지 확인해야합니다 your_obj
(반면에 object-initialization
객체 초기화에서 객체 리터럴을 반환 할 수 있습니다 :) {..., get(){ }, ... }
. 자세한 Object.defineProperty
내용은 여기
Object.defineProperty(...)
get NAME(){...}
구문 과 비슷한 브라우저 지원이있는 것 같습니다 . 최신 브라우저, IE 9.
_getvalue: () => {
return this.array.length;
}
get value(): number {
return this._getvalue();;
}
클래스의 부모 개체에 대한 액세스
그것은 나를 위해 일했습니다 : P
참고 URL : https://stackoverflow.com/questions/33827519/es6-getter-setter-with-arrow-function
'Nice programing' 카테고리의 다른 글
IE와의 javascript document.getElementsByClassName 호환성 (0) | 2020.10.19 |
---|---|
Elasticsearch의 인증 (0) | 2020.10.19 |
Apache Spark 웹 UI에서 "단계 건너 뜀"은 무엇을 의미합니까? (0) | 2020.10.19 |
MultipleActiveResultSets = 참 또는 다중 연결? (0) | 2020.10.19 |
MongoDB 스키마 설계-작은 문서가 많거나 큰 문서가 적습니까? (0) | 2020.10.19 |