21년 1월 12일 TIL

오늘 배운 것

 

화살표 함수 (arrow function)

 

함수의 표현식을 축약한 형태로 표시하는 함수인데, 여러모로 유용하게 쓰일 것 같다. 함수 안에 표현식이 두줄 이상일때는 return 값을 생략하는 것 보단 중괄호랑 return을 써주는게 보기 좋다. 보기만 편하게 하는 함수가 아니라 this를 binding하는 과정이 생략된다는 점을 기억하자.

 

this 키워드

 

this는 함수가 호출될 때 결정이 된다. 호출되는 방식에 따라 this도 바뀐다는점이다. 호출되는 방법과 무관하게 하려면 bind로 묶어버리자. 직접 호출하는 코드를 살펴보면 this가 무엇을 가르키는지 파악할 수 있다는 점.( . 온점 옆에 있는 친구를 잘 보자. ex) child.getAge() ) 쉽게 이해하려면 궁예를 떠올리면 될 것 같다. this는 아마 이렇게 말할것같다.

 

this: 누구인가? 누가 나를 불렀는가? 

 

전역인가? 예, global 입니다.

함수인가? 예, 함수입니다.

new인가? 예, new입니다.

 

call, apply 메소드

 

call과 apply는 this를 대체한다. 둘이 유사하지만 call은 보통 함수랑 똑같이 인자를 넣고, apply는 인자를 하나로 묶은 배열로 만들어 넣는다는게 차이점! apply에 a가들어가니까 array의 a랑 같다는걸로 외워버리자.

 

const example = function (a, b, c) {
  return a + b + c;
};
example(1, 2, 3);
example.call(null, 1, 2, 3); // null이 this를 대체
example.apply(null, [1, 2, 3]); // null이 this를 대체

유사 배열을 join이나 concat으로 합치려면 에러가 나겠지만 Array.prototype.join.call(arguments) 처럼 call이나 apply를 쓴다면? 제대로 작동하게된다. 배열 메소드를 이용할때 매우 유용하게 사용될 것 같다.

 

bind 메소드

call이랑 유사하나, 당장 실행하는 것은 아니고 바인딩 된 함수를 리턴하는 함수이다.  함수가 가르키는 this만 바꾸고 호출하지는 않는다는 뜻.

 

오늘 느낀점

이머시브 코스에 올라와 2번째날이 되었는데, 프리코스때처럼 koans를 풀며 새로운 개념에 대해 익히는 시간이였다. this의 개념은 이해는 가나 막상 문제를 보면 헷갈리는데.. koans를 복습하며 개념을 다시 볼 필요가 있을 것 같다.

 

더 공부할 것

• Git 사용법에 대해 더 공부하자 (브랜치 생성, 충돌이 일어났을경우, 브랜치 이동, 머지 개념 익히기)
• koans문제를 복습하면서 오늘 배운 함수와 메소드 익숙해지기
• HA문제 다시 한번 풀어보기.