Class / Functional Component

mangjell·2022년 4월 9일
0

  • 클래스에서는 공통 기능을 extends를 통해 상속해줄 수 있다.

this 바인딩( .bind(this) )

this는 어디서 실행하냐에 따라서 변화하는 이슈가 있다. 즉, 실행하는 주체에 따라서 this가 다르게 나온다.

이렇게 바뀌는 this를 동적 this라고 한다.

따라서 onClickCouter 를 클릭시에 this가 onClickCouter로 바뀌게 된다.

변화하는 this를 class로 고정하기 위해서는 this를 바인딩해주거나 화살표 함수를 써주어야합니다.

이렇게 바인딩 과정을 거쳐서 고정된 this를 렉시컬 this라고 한다.

Life Cycle (생명주기)

  1. 그리기 → render 인풋창 그리기
  2. 그리고 난 뒤 → componentDidMount포커스 깜빡 깜빡 하기
  3. 그리고 난 뒤 변경 → componentDidUpdate
  4. 그리고 난 뒤 사라짐 → componentWillUnmount

functional component

  • 함수형 컴포넌트는 항상 해오던 부분!!
  • 훨씬 더 편리하다!!
profile
프론트엔드 개발자

0개의 댓글