React 란
본문 바로가기

React란

React 는 페이스북에서 만든 프론트엔드 라이브러리입니다

react는 state, props와 함께 dom 객체를 반환하여 virtual dom을 생성합니다.

그리고 실제 dom에 변경사항을 적용하여 실제 뷰를 렌더링 합니다

특징

컴포넌트 기반

컴포넌트는 독립적 단위 모듈을 의미하는데 여러 모듈을 만들어두고 재사용 하여 필요한 컴포넌트들만 조합하여 새로운 view를 만들어 낼 수 있는것이 특징이다.

 

props

props는 javascript 객체로써 렌더링 결과물에 영향을 주는 정보를 가지고 있습니다.

props는 함수의 매개변수처럼 컴포넌트에 전달되어 사용되며 오직 상위 컴포넌트에서 하위컴포넌트로 전달됩니다.

그리고 전달받은 props들은 수정할 수 없습니다.  

 

state

state는 javascript 객체로써 렌더링 결과에 영향을 주지만 함수 내에 선언된 변수처럼 컴포넌트 내부에서 관리되고 사용됩니다

java처럼 상태정보를 저장하고 있다고 볼 수 있습니다.

 

함수형

  • 함수의 특징은 호출시 메모리에 올라가고 호출이 종료되면(return) 메모리에서 사라진다.  그렇기 때문에 state, lifeCycle 관련 기능을 사용할 수 없다
  • 함수는 실행이 끝나면 메모리에서 사라지기 때문에 클래스형 보다 조금더 효율이 좋다
  • 가독성과 유지보수성이 증가한다
    • class형을 사용하다보면  render 해주는 부분과 render하기 전  state와 lifecycle을 포함한 여러 로직을 수행하는 부분과 render부분이 구별되지 않아 가독성이 낮아지는 단점이 있다  
  • 컴포넌트 선언이 class 형보다 간단하고 편하다

클래스형

  • state, lifeCycle 관련 기능사용이 가능하다.
  • 메모리 자원을 함수형 컴포넌트보다 조금 더 사용한다. 인스턴스를 생성하여 state와 lifeCycle을 관리하기 때문이다
  • 임의 메서드를 정의할 수 있다.

lifeCycle 관련 내용은  http://ko.reactjs.org/docs/state-and-lifecycle.html

 

'React' 카테고리의 다른 글

Typescript 시작하기  (0) 2020.09.01

FlaShLab