[F-Lab 모각코 챌린지 - 15일차(1)] - 명령형 프로그래밍 vs 선언형 프로그래밍

Big One·2023년 5월 25일
0

F-Lab

목록 보기
47/69

선언형 프로그래밍이란?

무엇을 할까? 위주의 설계 방식이다.

어떻게 되는지에 대해서는 생각하지않고, 내가 무엇을 할지에 대해서만 생각하면 된다.

많은 사람들이 선언형과 명령형 구분의 예시를 for 문과 map을 드는데 이유는 다음과 같다.

for(let i = 0; ;) → for문은 시작부터 조건에따라 반복하기 때문에 어떻게(how) 반복할건지부터 생각해야한다. 반면에, map((i) ⇒ ) →  map 은 무조건적으로 순회하는데 여기서 무엇을(what) 할지에 대해만 생각하면 된다.

장점

  • 유지보수가 쉽다.
    • 예) map 함수를 사용하였을 경우 뭔가 추가하고싶을때 map 돌리는 객체에 data만추가해주면 된다. for문은 for문 밖에 추가로 코드를 적어주어야한다.
  • 가독성이 좋다.

명령형 프로그래밍이란?

어떻게 할까? 위주의 설계 방식이다.

어떻게 무엇을 해야할까 생각해야한다.

리액트는 왜 선언적일까?

리액트는 직접 UI를 조작하지않고 상태관리를 통해 UI의 변경이 일어나기 때문이다.

예)  status가 success 이면, <h1>SUCCESS!!</h1>를 출력하고, fail이면, <h1>FAIL!!</h1>이 출력 된다 할 때 const [status, setStatus] = useState(’success’); 이라하면  status 에 따라 UI가 변경 된다.

이게 아닌가? 그러면 ..  const success = <h1>SUCCESS!!</h1>; const fail = <h1>FAIL!!</h1>;   선언하고  status에 따라  return ( {success} ); 하면 되니까  상태에 따라 UI가 변경 되고 UI 에 직접 개입하진 않는다.

직접 개입은 특정 태그 id || class  로 태그를 지정하하고 innerHTML,  textContext로 값을 주입한다.

이러한 이유로 리액트는 선언적이라 하는 것 같다.

그리고 const success = <h1>SUCCESS!!</h1>;  코드 같은 경우는  JSX라고 한다.

JSX 란?

javascript 에 xml을 추가한 확장 문법이다.

profile
이번생은 개발자

0개의 댓글