クロージャーにおけるスコープの共有が理解できない

Question

###用語集
解説サイトA＝　https://logmi.jp/tech/articles/322067
画像A＝　https://img.logmi.jp/article_images/CnNjsbCDuXcau2y612zVvW.jpg

抱えている問題・実現したいこと

html・css・javascriptでゲームを作っているが、
「このwebページは多くのメモリを使用しています」と警告が出る。
無視していると強制的にブラウザがページを再読み込みさせてしまうらしい。
ゲームプレイ途中にページが再読み込みされて処理がリセットされては困るので
メモリリークについて理解し、対策を取りたい。

前提

いろいろ解説サイトを読んだが、中でもゲームについて言及している解説サイトAをメインで読んでいます。

課題：スコープの共有が理解できない

解説サイトAによるとクロージャーがメモリに関係ありそうなので、理解をして、自分のゲームでクロージャーを使ってないか判断したいが、スコープの共有が理解できないです。
画像Aに対して、「something関数とクロージャであるNOT_USE_CLOSURE関数にはスコープの繋がりができます」と解説サイトAに記載されています。それを検証するために下記のソースを実行しました。
something関数はinner_func2に、NOT_USE_CLOSURE関数はinner_func1に置き換えました。

var outer_func = function () {
    var outer_obj = "THIS IS outer_obj";
    var inner_func = function () {
        var local_obj = outer_obj;
        var inner_func1 = function () {
            console.log(local_obj);
            var hoge = "hogeeeee";
        }
        var inner_func2 = function () {
            console.log(hoge);
        }
        inner_func2();
    }
    inner_func();
}
outer_func();

すると「inner_func1」と「inner_func2」はスコープが共有されるはずなのに下記エラーが出ます。

test.html:22 Uncaught ReferenceError: hoge is not defined

変数「hoge」が関数「inner_func2」内で有効にならなかった理由がわかりません。「inner_func1」を実行していないから変数「hoge」が宣言されなかったとみて、「inner_func2」実行する前の行で「inner_func1();」としてみましたが結果は変わりませんでした。
###試したこと

スコープについても認識を誤っていないか、調べてみる。結果、スコープは「変数の有効範囲」であると再認識した。

備考

以前
https://teratail.com/questions/280194
に質問しましたが、1つの実現したいこと・抱えている問題に対して課題が複数あったので、課題ごとに分けて質問する為、その理由を添えて削除依頼しました。削除依頼は運営にも受理され、現在は削除されています。運営に受理されたということで複数に分けて質問させていただきます。

Answer 1

「inner_func1」と「inner_func2」はスコープが共有されるはずなのに

されません。

JavaScriptの場合、複数のスコープが重なったときに、内側のコードから外側のスコープは見えますが、逆は見えません。hogeはinner_func1の中で宣言されている以上、その外側からアクセスすることはできません。

Comments

[maisumakun]

inner_func1やinner_func2からouter_objやlocal_objは、外側のスコープにあるものなので見えます。

[gvaslkjlie]

わかりやすいご回答ありがとうございます。解説サイトAで「something関数とクロージャであるNOT_USE_CLOSURE関数にはスコープの繋がりができます」とありますが、これは誤りということなのでしょうか？「NOT_USE_CLOSURE関数スコープとfunc関数スコープはメモリ的なつながりができています」とも記載されているので、「スコープの繋がりではなく、メモリ的な繋がりができる」が正しい解釈なのでしょうか？

[maisumakun]

> 「something関数とクロージャであるNOT_USE_CLOSURE関数にはスコープの繋がりができます」とありますが、これは誤りということなのでしょうか？

両方が同じlocalClosureの見えるスコープ内にある、という意味です。それぞれの関数のローカルスコープがつながる、ということではありません。

[gvaslkjlie]

ご回答ありがとうございます。「localClosureの見えるスコープ」というのは「localClosureを参照できるスコープ」ということでしょうか？

[maisumakun]

そうです。

[gvaslkjlie]

ご回答ありがとうございます。やっと理解できました。感謝いたします。

Answer 2

別スコープなので、共有されません。

そもそも、画像と構文の構造がまるで違います。
画像はあくまで、外側で宣言された変数を参照しており、
しかも、関数内では、その外側で宣言された変数に対して、代入を行っているので、同スコープとなり、
使うことができます。

対して、質問者さんの構文だと、代入がfunctionキーワードな上、完全にローカルスコープなため、それでは、外側からは参照できないのです。

下記は間違いだったので上記を持って回答とします。

inner_func1を実行していないからです。
実行しないと、
hogeが宣言されないような構文だからです。

Comments

[gvaslkjlie]

ご回答ありがとうございます。見出し「課題：スコープの共有が理解できない」の最下部に記載したのですが、inner_func1を実行した場合でもテストをしております。

[miyabi_pudding]

回答訂正しました。

[gvaslkjlie]

ご回答ありがとうございます。

[gvaslkjlie]

ご回答ありがとうございます。「共有ができています」とのことですが、画像Aの「something関数とNOT_USE_CLOSURE関数の各ローカルスコープがつながる」ということですか？でも「共有されません。」ともご回答いただいており、共有できたのかできてないのかが分からない状態です。読解能力がなく申し訳ありません。

[miyabi_pudding]

語弊がある書き方、失礼しました。
修正しました。

とかく、ブロックの外側での変数宣言であれば、その中か、同ラインであれば、スコープに入ります。