this 이해가 안돼요

[조의진]

 

 

리액트 파트1 마지막 강의 코드에서 화살표 함수 대신 일반 함수를 쓰면 this가 달라서  bind를 해야 한다니 그럼 changeName(){}의 this에서는 뭐가 나오지? 궁금했습니다.

화살표 함수를 일반 함수로 고친 뒤 출력해봤더니

 

같은 this 아닌가요..? 근데 bind를 쓰지 않으면 왜 에러가 나는지 이해가 되질 않습니다ㅠㅠ

써주신 설명이랑 es6강의도 봤는데 말씀하신 바깥에 있던 this의 값을 그대로 끌고 온다는 말이 이해가 가질 않습니다..어떤 this를 들고 온단 말씀이신가요? function(){}을 쓴다면 값이 새롭게 변한다고 했는데, 그럼 저 위에 출력된 chageName의 this는 다른 this인건지...같아보이는데 잘 모르겠습니다...

 

별개로 전역 스코프에서 this를 출력해봤는데 undefined라고 뜨더라구요..잘못 알고 있나 싶어서 바닐라 js에서 사용해보니 window가 잘 출력되던데 왜 리액트에선 window대신 undefined가 뜨나요?

 

[codingapple]

changeName(){} 이걸로 바꿨을 때 그 안에서 this 출력하면 undefined 나올걸요 

리액트는 'use strict'가 켜져있어서 맨날 this 대충쓰면 undefined가 나옵니다

 

<button onClick={ this.changeName } 이거가 실행될 때

실은 class 안에 있던 changeName() 함수를 부른다기보다는

어디 대충 적어놓은 changeName 함수 복사본이 불러진다고 생각하면 됩니다

그리고 아무데나 대충적은 함수 안에서 this 출력하면 undefined가 나옵니다

 

[글쓴이]

글