Arrow Funciton은 코드량 줄여주는 고마운녀석.
일부 함수패턴에서 코드를 비교적 깔끔하게 정리해준다.
화살표함수는 자신의 this가 없다.
대신, 화살표 함수를 둘러싸는 lexical scope의 this가 사용됨.
때문에 현재 범위에서 존재하지 않는 this를 찾을 때 화살표함수는 바로 바깥 범위에서 this를 찾는것으로 검색을 끝냄.
아래 예시코드를 보며 이해해보자.
function Person() {
this.age = 0;
setInterval(() => {
this.age++; // 여기서 this는 Person 객체를 참조함.
}, 1000);
}
var P = new Person();
엄격모드(strict mode)와의 관계도 약간 복잡한데
당장에 이해하기엔 나으 능력 부조크...🤣
차근차근 이해하자.
저번편에서도 기록했듯이
JS에서 this는 함수호출방식에따라 this에 바인딩할 어떤 객체가 동적으로 결정된다.
함수의 상위 스코프를 결정하는 렉시컬스코프(Lexical Scope)는 함수를 선언할 때 결정된다.
this바인딩과 혼동하지 않도록 주의해야한다.
'자바스크립트🔥' 카테고리의 다른 글
ES6 / 헷갈리는 그 이름 this 2편 / 메서드호출 (0) | 2021.05.10 |
---|---|
ES6 / 헷갈리는 그 이름 this 1편 / 함수호출 (0) | 2021.05.09 |
ES6 / 클래스 / 3편 / 프로토타입 및 정적 메소드를 사용한 this 바인딩 (0) | 2021.05.07 |
ES6 / 클래스 / 2편 / 클래스 body와 Static(정적) method (0) | 2021.05.07 |
ES6 / 클래스 / 1편 / 클래스 선언과 표현식 (0) | 2021.05.06 |