일반 함수는 호출 위치에 따라 this 정의!!
화살표 함수는 자신이 선언된 함수 범위에서 this 정의!
normal이라는 메소드는 function 키워드를 사용해 익명의 일반 함수를 할당하고 ,
arrow라는 메소드는 화살표 함수로 할당하고 있음.
그리고 아래에서 heropy 객체를 가져와서 normal 과 arrow라는 메소드를 실행하고 있다. 즉 메소드를 호출하고 있다.
근데 결과를 보면 normal은 Heropy로 출력이 됐는데, arrow는 undefiened로 출력이 됐음.
일반 함수로 만든 this는 호출 위치에 따라 정의되는데, 즉 normal 부분의 함수는 normal이 호출되는 위치에서 this가 정의됨. 즉 호출 위치에서 점표기법으로 그 메소드가 딸려있는 객체데이터는 heropy이기 때문에 heropy가 곧 this가 됨.
이와 다르게 화살표 함수는 자신이 선언된 함수 범위에서 정의된다. 즉 10번째줄에서 화살표함수가 선언되어있고 그 함수범위가 존재하지만 그 영역에 함수가 존재하지 않음. 그래서 화살표 함수로 this를 사용할 때는 코딩환경에 따라 다양한 부분을 지칭할 수 있음. 결국 현재코드에서는 정확히 무엇인지 알 수 없음.
내부에 로직을 추가한 것.
근데 undefined라는 값이 출력됨. 여기에서의 this가 사용된 부분의 일반 함수는 setTimeout이라는 함수의 내부 로직으로 콜백이 들어가서 setTimeout이라는 함수의 로직 어딘가에서 실행이 된다.
그래서 일반 함수가 아닌 화살표 함수로 고쳐줘야 콘솔창에 결과값이 뜸.
화살표 함수 자신이 만들어진 함수 범위에서 this 가 정의되기 때문에. 그 화살표 함수가 만들어진 부분을 감싸고 있는 timeout이라는 추가적인 함수범위가 있기 때문에, 그 안에서 this가 정의되는 것이고. 그 함수 부분의 this는 곧 일반함수가 정의된 timer라는 객체데이터를 가리키게 됨.
즉 this라는 것이 setTimeout이라는 이미 정의된 함수 어딘가에서 정의되는 것이 아니라 명확하게 우리가 작성한 특정 범위에서 this가 정의될 수 있기 때문에 setTimeout에서는 화살표 함수 쓰는 것이 좋음.
