[TIL]2022.05.07

진경·2022년 5월 7일
1

TIL

목록 보기
5/29

var대신 let,const

var는 요즘은 사용하지 않는다. let과 const만 쓰자!
+++
왜 그럴까는 안써서 수정해봤다.
var 은 변수에 값을 재할당 하여도 에러가 발생하지 않는반면 let 과 const는 개발자가 변수의 immutable 여부를 지정할 수 있다는 차이점이 있다. let은 변수의 재할당이 가능하고 const는 불가능하다.
저 재할당이 문제라서 var은 사용하지 않는다.

(var로 변수를 생성하면 윈도우 객체에 프로퍼티로 저장한다. 윈도우 객체는 최상위 객체로 어디서든 접근이 가능하다.-전역객체- 어디서든 접근 가능)

리액트 ref

ref가 무엇일까?:reference의 약자로 참조라는 뜻이다.

  • Ref의 바람직한 사용 사례
  1. 포커스, 텍스트 선택영역, 혹은 미디어의 재생을 관리할 때.
  2. 애니메이션을 직접적으로 실행시킬 때.
  3. 서드 파티 DOM 라이브러리를 React와 같이 사용할 때.

(DOM을 선택해 직접 접근하기 위해 ref를 사용)

선언적으로 해결될 수 있는 문제에서는 ref 사용을 지양해야한다.
예를 들어, Dialog 컴포넌트에서 open()과 close() 메서드를 두는 대신, isOpen이라는 prop을 넘겨준다.

useRef라는 hook을 사용하여 ref를 활용한다.

useRef

useRef는 리렌더링 하지 않는다. 컴포넌트의 속성만 조회,수정한다.
이 말은 컴포넌트가 계속 리렌더링 되어도 값이 유지된다는 의미이다.
state 대신 ref를 이용한다면 불필요한 렌더링을 막을 수 있다.
(리렌더링을 하지 않기 때문에 화면에 바로 숫자가 표기되지 않는다.)

또한 DOM요소에 접근이 가능하다.

즉 변화는 감지하지만 변화가 렌더링을 발생시키지는 않도록 하는 hook이다.

profile
프론트엔드 취준생입니다

0개의 댓글