React Hook useState가 const를 사용하고,

React Hook useState가 const를 사용하고,

React useState Hook을 사용하는 표준 방법은 다음과 같습니다.

const [count, setCount] = useState(0);

단, 이것은const count변수는 분명히 다른 원시 값으로 재할당됩니다.

그러면 변수가 다음과 같이 정의되지 않는 이유는 무엇입니까?let count?

분명히 다른 원시적 가치로 재할당될 것이다

사실 그렇지 않아요.컴포넌트가 재렌더되면 함수가 다시 실행되어 새 스코프가 생성되고 새 스코프가 생성됩니다.countvariable. 이전 변수와는 무관합니다.

예:

let _state;
let _initialized = false;
function useState(initialValue) {
  if (!_initialized) {
    _state = initialValue;
    _initialized = true;
  }
  return [_state, v => _state = v];
}

function Component() {
  const [count, setCount] = useState(0);

  console.log(count);
  setCount(count + 1);
}

Component();
Component(); // in reality `setCount` somehow triggers a rerender, calling Component again
Component(); // another rerender

주의: 후크는 훨씬 더 정교하며 실제로 이와 같이 구현되지 않습니다.이것은 단지 유사한 행동을 보여주기 위한 것입니다.

const는, 같은 범위내에서 참조의 값을 재할당하지 않게 하기 위한 가드입니다.

MDN에서

변수 식별자를 재할당할 수 없는 값일 뿐, 보유하는 값이 불변수 식별자를 재할당할 수 없습니다.

또한.

상수는 동일한 범위의 함수 또는 변수와 이름을 공유할 수 없습니다.

정확히 새로운 값을 할당하는 것은 아닙니다.useState는 단순히 상태 갱신 함수입니다.값 변경은 React에 의해 다른 곳에서 관리되기 때문에 여기서 Const가 사용됩니다.즉, React에게 useState에 문의하여 가치를 관리하도록 지시하는 것입니다.

setCount를 호출한 후 컴포넌트가 재렌더되고 useState의 새 호출이 새 값을 반환합니다.요점은 카운트는 불변이라는 것이다.여기 오타가 없어요.

엄밀히 말하면 모든 렌더링에서 새로운 변수입니다.

출처: React Github 문제: Docs - Hooks: 계속 오타입니까?

카운트가 바뀌어야 하기 때문에 여기서 나는 경찰이 답답하다는 것을 알았다.

  let [count, setCount] = useState(0)
  // simply can't use ++ on either side of count increment given we declare as const [count, setCount] 
  // instead declaration of var or let [count, setCount] allows simpler code
  const increment = () => {
    setCount(count++); //const cannot do this only let or var
  };

언급URL : https://stackoverflow.com/questions/58860021/why-react-hook-usestate-uses-const-and-not-let