[TIL] 0407

yoon Y·2022년 4월 8일
0

2022 - TIL

목록 보기
68/109

React Hook VS Container Component

React Hook과 Presentational/Container컴포넌트 패턴은 대체 관계가 아니다
목적에 맞게 사용해야하고 병행할 수 있다.

React Hook은 상태 로직 재사용이 목적
Presentational/Container 컴포넌트 재사용이 목적

참고자료


버블 정렬 알고리즘과 sort함수

버블 정렬

  • 이웃하는 두 값을 비교해 순서를 바꾸는 것.
  • 마지막 값부터 정렬되어 쌓인다.
  • 마지막 인덱스를 제외하고 arr.length-1번 순회해야 정렬이 완료된다.

js의 sort함수
아스키 코드가 기준이 아닌 숫자를 정렬하기 위해선 비교 콜백함수를 넣어서 사용해야한다.

오름차순 - sort((a,b) => a-b)
내림차순 - sort((a,b) => b-a)

주의!! a가 next, b가 prev이다
오름차순 - sort((next,prev) => next-prev)
내림차순 - sort((next,prev) => prev-next)

a, b값을 이용해 순서를 바뀌어야할 때에 -1값이 나오도록 수식을 작성해주면 된다.

비교함수 로직이 정확히 버블 정렬은 아니지만 사용할 때 버블 정렬의 원리로 생각하면 될 것 같다는 생각이 들었다. 이웃하는 두 수를 비교하는 거니까..


코어자바스크립트 학습

  • 데이터 타입의 종류 - 원시, 참조
  • 변수 선언과 데이터 할당
  • 기본형 데이터와 참조형 데이터의 차이
  • 불변 객체를 만드는 법
  • undefined와 null



Presentational/Container컴포넌트 패턴이 hook으로 대체되어 구식이 되었다하는데
모르겠지만 납득이 되지 않았었다.
hook이나 전역 상태로 상태로직이나 외부영향 로직을 분리하더라도 컴포넌트 내에서 쓰이면 컴포넌트 재사용이 안될텐데 말이다.
서치 중에 좋은 글을 발견해서 궁금증을 완전히 해소했다!!

아무리 인터넷에 많은 자료들이 있다고해도 역시 책이 정확했다.
많은 자료들을 봐도 이해가지 않던 메모리 할당부분이 책에 정확하고 자세하게 나와있어서 많은 의문점들이 해소되었다!!
하지만 자세히 나와있는 만큼 내용이 어려워서 완벽히 숙지될 때까지 여러번 읽어보려고 한다.

profile
#프론트엔드

0개의 댓글