【JavaScript】ホイスティングとは何なのか

ホイスティング

よくあるプログラミング言語だと、変数を使う前に変数を宣言しておかなければなりません。
しかし、JavaScriptでは「宣言はスコープの先頭で行われる」というルールがあります。そのため、スコープ内であればどこで宣言しても「is not undefine」というエラーが出ることはありません。
これがホイスティング（宣言の巻き上げ）です。

これはエラーが出る

function func()
{
  console.log(hoge);
}

func();

こっちはエラーが出ない

function func()
{
  console.log(hoge);
  
  var hoge;
}

func();

ただ、こっからがややこしいのですが、ホイスティングで巻き上げられるのは変数の宣言だけで代入や初期化は書いてある順番通りに行われます。

function func()
{
  console.log(hoge);
  
  var hoge = "hello world";
  
  console.log(hoge);
}

func();

この機能何に使えるんですかね？不慮のバグを発生させてしまいそうな気がするんですが。
ちなみにホイスティングで巻き上げられるのは変数の宣言だけでなく、配列やオブジェクトの宣言も巻き上げることができます。

function func()
{
  console.log(hoge);
  console.log(obj);
  
  var hoge = ["hellow", "world"];
  var obj = {
    x: 1,
    y: 11,
  };
  
  console.log(hoge);
  console.log(obj);
}

func();

今のところ使いどころが分かりませんが、こういう挙動もあるんだなということで覚えておこうと思います。
以上。