2020/09/01 TIL

새로운 마음으로 2020년 새해를 맞이하던 날이 엊그제 같은데 벌써 올해가 절반도 남지 않았다.

이머시브 2일차. 오늘도 나자신에게 물어보고 넘어가자.
'나는 어제보다 얼마나 성장했는가?'
나는 할 수 있다는 마음가짐. 남들과 비교하지 않고 어제의 나자신과 비교하는 습관을 들이려고 노력중이다.

당장 이해가 안되는 문제에 당황하지 말고 당연히 그럴 수 있고 익숙해지면 별거아니라는 마음가짐으로 TIL을 작성해보려고 한다. 어제 몰랐던 것들을 오늘은 알게 되었고, 앞으로도 오늘과 마찬가지로 여러가지의 퍼즐이 하나가 되는 일들을 경험하게 될 것이다.

짧게나마 오늘 학습한 것들을 정리해보고 자보려고 한다.
오늘은 화살표 함수, this키워드, 함수호출 메소드에 대해서 학습을 했다. this가 존재하는 것은 알았지만 대체 그게 뭔지 궁금했다. Modern Javascript Koans 과제를 진행하면서도 어렴풋이만 이해하고 정확히 뭔지 나만의 언어로 설명할 수가 없었다. 그래서 다른 사람들의 블로그를 참고하면서 가장 이해하기 쉬운 블로그 글을 찾았다.

this 란?

this는 함수 실행시 호출 방법에 의해 결정되는 특별한 객체입니다.
console창에 this를 쳐보면 Window{...}가 나오는 것을 확인할 수 있다. 여기서 this가 특별한 이유는 함수의 호출 방법에 따라 this의 값은 변할수 있다는 것이다.

let hello = function(){
 console.log(this) //Window{...}
};

this가 Window객체가 아닌 다른 객체로 바꿔주는 함수 호출 메소드에는 call, apply, bind가 있다.

Function.prototype.call()

func.call(thisArg[, arg1[, arg2[, ...]]])

Function.prototype.apply()

fun.apply(thisArg, [argsArray])

let obj = {name: 'Jihee'};
let hello = function(city){
	console.log(`Hello, I'm ${this.name} and I live in ${city}`)
}
hello("Seoul");//Hello, I'm  and I live in Seoul
hello.call(obj, "Seoul");//Hello, I'm Jihee and I live in Seoul
hello.apply(obj, ["Seoul])//Hello, I'm Jihee and I live in Seoul 

call 과 apply 를 사용하면 this의 값은 obj로 바뀐것을 알 수 있다.

Function.prototype.bind()

func.bind(thisArg[, arg1[, arg2[, ...]]])

참고
https://wooooooak.github.io/javascript/2018/12/08/call,apply,bind/