[TIL] 2022-03-18

minbr0ther·2022년 3월 17일
0

today-I-learned

목록 보기
69/103
post-thumbnail

1. Coding Test

  • 백준 문제풀기 (그리디[18/50] → 탐색[12/50] → 동적프로그래밍[12/50])


2. Live Academy

  • 어려운 부탁을 할 때, 어려운 부탁을 받을 때 [ 대화가이드 #10 ] | 영어회화 🔗복습

  • which 관계 대명사 - Part 1 🔗진도


3. Full-stack

  • React로 NodeBird SNS 만들기 by ZeroCho 🔗

    • useCallback은 특정 함수를 새로 만들지 않고 재사용하고 싶을때 사용한다. 한번 만든 함수를 필요할때만 새로 만들고 재사용하는 것은 중요하다. 주의해야 할 점은, 함수 안에서 사용하는 상태 혹은 props가 있다면 꼭, deps 배열안에 포함시켜야 된다는 것이다. 만약에 deps 배열 안에 함수에서 사용하는 값을 넣지 않게 된다면, 함수 내에서 해당 값들을 참조할때 가장 최신 값을 참조 할 것이라고 보장할 수 없다. 그래서 반드시 props로 받아온 함수가 있다면, 이 또한 deps에 넣어주어야 한다.
  • Redux vs Context API

    • 리덕스 장점: 에러 추적이 쉽다

    • 리덕스 단점: 코드량이 늘어난다

    • 둘의 차이점: 비동기를 처리할 수 있냐 없냐

  • 비동기를 다룰때는 3가지 기억 그리고 항상 실패를 대비해야한다

    • 요청 - 데이터 보내줘 요청

    • 성공 - 데이터를 받는다

    • 실패 - 에러 핸들링

  • 왜 객체를 항상 새로 만들어줄까?

    • 우리가 원하는 것은 데이터를 기록으로 남기는 것이다

    • 같은 참조 안에서 데이터를 변경하면 history가 남지 않게 된다

    • 하지만 새로 객체를 계속 생성하면 계속 history를 쌓을 수 있다

  • 그렇다면 왜 변경되지 않는 부분은 새로 다 작성 안하고 ...(비구조화 할당)를 사용할까?

    • 변경 되지 않아도 될 부분은 ‘참조’로 가져가고 변경되어야 할 부분은 새로 만들어야 메모리 절약이 된다.

4. Resume & Interview

  • [JavaScript] 비동기 처리와 자바스크립트 엔진의 동작 🔗

  • 클래스 컴포넌트와 함수 컴포넌트 🔗

    • 흔히 한국에서는 클래스형, 함수형 컴포넌트라고 말하지만 공식 문서에 따르면 클래스, 함수 컴포넌트가 옳바른 표현이다 👀

    • 클래스 컴포넌트: React Life Cycle과 State를 사용할 수 있다

    • 함수 컴포넌트: 클래스 컴포넌트 보다 메모리를 덜 사용한다.

  • React hooks의 등장

    • 함수 컴포넌트는 클래스 컴포넌트보다 효율이 좋다. 이유는 상태를 사용하지 않고 Life Cycle을 사용할 수 없기 때문이기 때문에 당연한 결과였다.

    • 이러한 함수 컴포넌트의 단점을 해소하기 위해서 19년 초에 React Hooks가 업데이트 되었다.

    • Hooks의 간단한 개념은 함수 컴포넌트에서도 React Life Cycle, State를 사용할 수 있게 한다는 것이다.

  • Hooks를 더 알아보자

    • Hook가 의미하는 것은 ‘재사용’이라고 한다.
    • 동일한 순서로 Hook이 호출 되는 것을 보장하기 위해서 반복문, 조건문 혹은 중첩된 함수 내에서는 Hook을 호출할 수 없다.
  • 클래스형 컴포넌트는 다른 말로 Stateful 컴포넌트, 함수 컴포넌트는 Stateless 컴포넌트라고 하기도 한다. 클래스형 컴포넌트는 로직과 상태를 컴포넌트 내에서 구현하기 때문에 stateful로 불리는 것이며 상대적으로 복잡한 UI 로직을 가지고 있다. 반면 함수형 컴포넌트는 state를 사용하지 않고 단순하게 데이터를 받아서 (props) UI에 뿌려주기 때문에 stateless라고 불리는 것이다.


⏱ Total study time - 5 hours 20 minutes

profile
느리지만 꾸준하게 💪🏻

0개의 댓글