인프런 커뮤니티 질문&답변

김예란님의 프로필 이미지

작성한 질문수

Vue.js 완벽 가이드 - 실습과 리팩토링으로 배우는 실전 개념

자바스크립트 this 4가지와 화살표 함수의 this

궁금증이 풀렸네요. 감사합니다.

작성

·

195

4

처음 vue를 접했을 때, 왜 화살표 함수를 쓰는건지 이해하지 못하고 사용하고 있었는데.. 선생님 덕분에 궁금증이 풀렸습니다.

뷰 인스턴스의 this를 따로 바인딩 하지 않아도, 화살표 함수를 쓰면 함수를 정의하는 시점에 this를 그대로 매칭해서 쓸 수 있기 때문에 화살표 함수를 자주 쓰는 것이었군요.

콜백함수에서 this가 풀려버린다는 것도 이제 알았습니다.

덕분에 수수께끼같이 콜백에서 (예로 들어 addEventListener) this가 풀려서, es5로 개발할 때 bind()함수로 this를 구현해준다던지, 강의에서처럼 var vm=this;로 매핑해서 사용해줬었는데요.

콜백에서 this를 잃어버리는 것이 자바스크립트가 가진 원래의 생김새라는걸 알았네요. ES6에서 화살표 함수가 등장하게 된 이유도 비로소 이해가 되었구요.

좋은 강의 감사합니다 선생님:-)
덕분에 내내 궁금해만 하고 있던게 풀렸습니다.

선생님 블로그 글을 먼저 접해서 비동기, 콜백, 프로미스, 어싱크 관련 글들을 먼저 읽었었는데, 확실히 강의로 들으니 와닿는게 또 다르네요.

답변 2

0

bind()함수로 this를 안쓰고 화살표 함수를 쓰면 props를 하위 컴포넌트로 보낼때 문제 되는건 없나요?

0

안녕하세요 예란님, 제가 답변이 조금 늦었네요. 좋은 후기 들려주셔서 감사합니다 :) 제 블로그랑 강의 모두 칭찬해주셔서 정말 뿌듯하네요. 앞으로도 예란님 학습하시는데 제 컨텐츠가 도움 많이 되었으면 좋겠습니다. 남은 강의도 즐겁게 들으세요 :)