この記事では、プロトタイプチェーンgetName（）の古典的なインタビューの質問をすべての人に整理します

トピック

質問全体を最初に置く

   function Foo() {
            getName = function() {
                console.log(1);

            }
            return this;
        }
        Foo.getName = function() {
            console.log(2);

        };
        Foo.prototype.getName = function() {
            console.log(3);

        }
        var getName = function() {
            console.log(4);

        }

        function getName() {
            console.log(5);

        }

        Foo.getName();
        getName();
        Foo().getName();
        getName();
        new Foo().getName();
       new Foo().__proto__.getName();
        new Foo.getName();
        new new Foo().getName();

回答

ここで、一部の友人はより良い基盤を持っているので、最初にここに答えを入れてください、そしてあなたは後で分析を見る必要があります。
ここに画像の説明を挿入

分析

まず、トピック全体

GOを作成するには、
最初にvarによって宣言されたgetNameを一番上に上げ、それをunderfinedに割り当てます。次に、関数Foo（）代入関数本体を上げ、関数getName（）{ console.log（5）;}を宣言されたgetNameに上書きします。上から見て、上から見てください次に、getName = function（）{console.log（4）;}割り当てステートメントがあることがわかり、getNameが再割り当てされます。この時点で、質問は次のようになります。

  getName = function() {
            console.log(4);

        }

        function Foo() {
            getName = function() {
                console.log(1);

            }
            return this;
        }
        Foo.getName = function() {
            console.log(2);

        };
        Foo.prototype.getName = function() {
            console.log(3);

        }

最初の質問Foo.getName（）; // 2

これは、FooコンストラクターでgetNameの静的メソッドを呼び出すのと同じなので、ここに2があります。

2番目の質問getName（）; // 4

明らかに、グローバルgetNameメソッドを探しています。上記の分析から、グローバルgetNameが出力4を実行することがわかります。したがって、ここでは4を出力します。

3番目の質問Foo（）。getName（）; // 1

この質問は2つのステップに分かれています

まず、Foo（）を左から右に実行すると、foo内のgetNameはvarによって宣言されておらず、彼を宣言するための仮パラメーターがないため、ここではグローバルgetName = function（）{console.log（1） ;}、そしてこれはウィンドウを指すように戻るので、以下はwindow.getName（）と同等です
前のステップから、グローバルのgetNameが変更され、Fooの実行がグローバルを指していることがわかります。したがって、ここでは、グローバルのgetNameが1を指していることがわかり、出力1になります。

4番目の質問getName（）; // 1

これは3番目の質問に基づいています。3番目の質問はグローバルgetNameを変更したため、ここでは1を出力するため、これ以上は説明しません。

5番目の質問はnewFoo（）。getName（）; //

この質問では、新しいFoo（）が左から右に作成されます。newの場合、これは新しいオブジェクトを指し、Foo（）にはthis.getNameを持つメソッドがないため、プロトタイプチェーンでそれを探します。したがって、Foo.prototype.getName = function（）{console.log（3）;}が見つかるため、ここでの出力は3になります。

。fooが第六）（新新を尋ねるプロト.getName（）; // 3

この質問については、この写真を見ることができます
ここに画像の説明を挿入

上記はFoo.prototype.getName（）;と同等であるため、ここでは3を直接取得します。

7番目の質問newFoo.getName（）; // 2

ここで最初と最後に移動するには、最初に真ん中を見てください。取得したのはFoo.getName = function（）{console.log（2）;};なので、ここで2を出力すると、コンソール
ここに画像の説明を挿入
が通常の出力を表示することがわかります。関数newout and print it結果は元の出力のままなので、ここでは印刷結果は2です。

最後の質問newnew Foo（）。getName（）; // 3

内側から外側に向かって、この質問は5番目の質問と同等のnew Foo（）。getNameと同等であることがわかります。前の質問のメソッドを適用すると、ここでのnewの結果は3のままです。

総括する

プロトタイプチェーンのトピックに取り組むときは、簡単なプロトタイプ図を描くことができます。これに関しては、newがnewからnewオブジェクトを指していることに注意してください。

プロトタイプチェーンの古典的なインタビューの質問getName（）