[React] One way data binding, Two way data binding

https://pt.slideshare.net/miladiir/angular-js-42828566/7?smtNoRedir=1

단방향 데이터 바인딩
- 처음 모델이 가진 값을 뷰에 표현하고 나중에 모델이 변경되더라도 업데이트 되지 않음

양방향 데이터 바인딩
- 모델을 뷰에 바인딩함과 동시에 이후 모델이 변경되는 경우를 감지하여 지속적으로 뷰를 업데이트 해줌

* 데이터 바인딩 : 화면에 보이는 데이터와 브라우저 메모리에있는 데이터를 일치시키는 방법

차이 - HTML에서 변경된 내용이 데이터 영향을 미치는가

리액트 - React와 같은 단방향 데이터 바인딩은 Javascript -> HTML로 데이터 바인딩만 가능   
           이벤트를 통해 다시 화면에 뿌려주는 과정이 필요

 

two way data binding 장점

모델, 뷰 동기화 - 데이터 변화를 감지하여 모델과 뷰가 같도록 만들어줌. (단방향은 같게하기위한 추가적인 코드가 필요)
코드량 - 코드의 사용면에서 코드량을 크게 줄여주는 등의 장점

one way data binding 장점

성능 - 자체 실행 코드 내에서 데이터의 변화를 감지하여 DOM 객체 전체를 렌더링 해주거나,
         데이터를 바꿔주는 등의 실행으로 인하여 성능이 감소
디버깅 - 예측 가능성이 높기 때문에 코드 디버깅이 쉬움
안정성 - 예측 가능성이 높기 때문에 코드가 안정적