領域変数vsグローバル変数(feat.react hook)

卒業作を制作しているうちに、一部迷路に陥った.
ポイントコードを簡単に赤字に変更すれば.

const App()=>{
  
  useEffect(()=>{
    const test_var=10
  },[]);
  return(
    <>
      {test_var}
    </>
  )
}

このコードのエラーは次のとおりです.

returnのtest varは構成部品で宣言されていません.理由は何ですか.

ゾーン変数とグローバル変数

この2つの変数は、メモリに存在する時間とアクセス変数の範囲に差があります.
ゾーン変数(localvariable):ブロックで宣言された変数
領域変数は宣言変数のブロック{}内でのみ有効であり、ブロックが終了するとメモリから消えます.
これらの領域変数はメモリ上のスタック領域に格納され、初期化されていない場合は無意味な値(ゴミ値)に初期化されます.
例として、関数のパラメータも、関数で定義された領域変数と見なされます.
グローバル変数(global variable):関数の外部で宣言される変数
グローバル変数は、プログラムの任意の場所からアクセスできます.プログラムが終了すると、メモリからグローバル変数が消えます.
これらのグローバル変数はメモリ内のデータ(data)領域に格納され、直接初期化することなく自動的に0に初期化されます.
では、すべての変数をグローバル変数として使用できますが、メモリの浪費のため、グローバル変数の使用を減らすことが望ましいです.

ES 6の変数

ECMAScript 6では、変数宣言方法が新たに変更された.
let:可変領域変数の宣言
const:可変(定数)領域変数の宣言
var:完全な範囲を持つ柔軟な変数を宣言する
letやconstとは異なり、varと宣言された変数のアクセス範囲は関数内またはグローバルです.すなわち,ブロックを基準としてスキャンを生成するのではなく,関数単位でスキャンを行う.

解決策は…？

では、varを使って解決できますか?
まずuseEffect hookについて簡単に理解します.
応答HOOKの1つとして,関数素子上のコールバック関数の実行点を決定する.
実行時間を自己登録後に設定したり、変数の値を変更したりすることができます.
上記のコードは、実行ポイント依存(Execute Points Dependencies)を空の配列として指定し、構成部品をレンダーした後に一度だけ実行します.
さらに重要なのは、関数またはuseEffectの内部で変数を宣言した場合、外部で使用できるかどうかです.
最初のhookはもちろん関数です.公式ファイルと形態に示すように、useEffectは関数です.
また,varは関数単位のscopeを持つため,userEffect内部で宣言しても関数以外では使用できない.
では、外部でvarと宣言して、関数で使えばいいのではないでしょうか.

~に従ってこんな間違いが起こる説明するには、userEffectに割り当てられた変数は、各レンダリング後に値を失います.userefを使用して値を保存します.
または、useStateを使用して値の変更を保存できます.