[생활코딩] React - 이벤트 bind 함수 이해하기 / 이벤트 setState 함수 이해하기

render 함수 안에서 this는 render함수가 속해있는 컴퍼넌트 자체를 가리킨다.

 

그런데 함수안에서의 this는 아무것도 가리키지 않는다.

그래서 bind로 this를 강제로 주입하는거다.

(.bind(this) 라는 함수를 뒤에 붙여 줌으로써 저안에 저 함수가 실행 될때 app클래스 하위에 있다라고 정해줘서

function함수가 실행될때의 this는 app클래스를 가르킬수 있지 않을까 생각해본다.)

 

---

bind라고 하는 함수를 통해서 bindTest함수의 블럭 안에서 this는 obj가 된다.

(이렇게 되는 새로운 함수가 복제돼서 만들어진다.)

 

---

<이벤트 setState 함수 이해하기>

state를 함수의 형태로 바꿔야되는 이유를 배워보자.

App이라는 컴퍼넌트가 생성될 때 가장 먼저 실행되는 constructor 함수에서는 state를 저 안에서 수정하면 된다.

하지만 컴퍼넌트 생성이 끝난 다음에 동적으로 state 값을 바꿀 때는 위처럼 하면 안된다.

(this.state.mode = 'welcome' <- 이런식으로)

 

this.setState 에 변경하고 싶은 값을 객체 형태로 주는걸 통해서 고쳐야 된다.

this.state.mode = 'welcome' <- 이 방식은 리액트 입장에서는 알아채기 힘들어서 랜더링을 할 수가 없다.

 

 

---

 

 

 

 

 

 

 

 

 

 

 

 

※ 본 포스팅은 개인 공부 기록을 목적으로 남긴 글이며 본 사실과 다른 부분이 있다면 과감하게 지적 부탁드립니다.