TIL 0302

컴포넌트와 메소드

컴포넌트 내부에 작성된 함수는 기본적으로 해당 컴포넌트(this)의 메소드가 아니며, 그 함수의 this는 undefined 이다. 그러므로 함수를 해당 컴포넌트에 바인딩해야 메소드로 사용할 수 있다.

바인딩 방법 4가지

1. ES6 Arrow function 방식으로 자동 바인딩하기

(화살표 함수는 자기 블록 스코프의 바깥(상위) 스코프의 this를 자동으로 바인딩한다.)

2. ES6 function contraction 방식으로 함수 작성시

• 생성자(constructor) 블록 안에서 바인딩하기
• render 메소드 블록 안에서 바인딩하기
• render 메소드 블록 안에서 함수 호출을 반환하는 익명 화살표 함수 선언식으로 대신 바인딩하기

예시 참고 (아래 링크)

컴포넌트 인스턴스로 함수를 어떻게 바인딩 할까요? | React