[初学者]スコープとvarの巻き上げ

#（初学者）javascriptの理解してなかった所
#はじめに
本記事はネット教材でサラッと勉強したけど後に深く理解してなくて、なんだこれ？となって調べたものです。
参考文献 javascript primer

#目次

• javascriptのスコープの性質とはなんですか？
• varの巻き上げってなんですか？
• おわり

#javascriptのスコープの性質とはなんですか？
スコープとは変数や関数の引数をとって来れる範囲です。
そしてもう１つ重要なのが｛　｝で囲っている所をブロックと呼びます。ブロックの外から中は参照出来ません。
＊逆にブロック内のものはブロック外を参照出来ます。
例を下に書くと

const A = 10;　←グローバルスコープで定義されたグローバル変数
{
  const B = 20;
  {
    console.log(A);　 //10　←内から外へ参照を探しに行くスコープチェーン
  }
}
console.log(B);　←ブロック内の変数Bを参照出来なかった
//Uncaught ReferenceError: B is not defined

#varの巻き上げってなんですか？
＊そもそもなんでconstとletが追加されたのか
先ず基礎知識でconstとlet、varの違いについて
const　再宣言、再代入できない。
let　　 再宣言は出来ないが、再代入は出来る。
var 　　どっちも出来る。

再宣言が出来るとはなんなのか、コードで書いてみるとvarは初期20から再宣言により200になってます。
短いコードならまだ良いですが、長いと意図せずに同じ変数を宣言する可能性があるので危険です。varは非推奨

let A = 10;
var B = 20;

let A = 100;
var B = 200;

console.log(A);　//エラー　Uncaught SyntaxError: Identifier 'A' has already been declared
console.log(B);　//200

次にletとvarの他の違いについて、

let C = 30;
console.log(C); //30
console.log(D); //Uncaught ReferenceError: Cannot access 'D' before initialization
let D = 40;

var E = 50;
console.log(E); //50
console.log(F); //undefined
var F = 60;

コードは基本的に上から下へ行くものですが何故がconsole.log(F);にはundefinedが表示されます。
undefinedは未定義の意味なので、何かわからないものがある判定になってます。怖いですね。
引用すると

変数宣言が宣言と代入の2つの部分から構成されていると考えてみましょう。
varによる変数宣言は、
宣言部分が暗黙的にもっとも近い関数またはグローバルスコープの先頭に巻き上げられ、
代入部分はそのままの位置に残るという特殊な動作をします

さっきのコードで改めて書くと

人から見たコード
console.log(F);
var F = 60;

実際の動き
var F
console.log(F);
var F = 60;

この人に見えない特殊な動きを巻き上げと言うそうです。

#おわり
初めて書いて見ましたが3時間ぐらいかかりました。
参照を元にアウトプットしたつもりがだたの自己流の書き直し感があり、すみません。