jsオブジェクトのプロパティがこれを使用して別のプロパティを呼び出せないのはなぜですか?

この問題は多くの人が犯しているようですが、私はまだこれについて十分に知りません

この問題を記録してみましょう。

   obj = {
        a: 123,
        b: this.a,
        c: function () {
            return this.a;
        }
    };
   console.log(obj.b); // undefined
   console.log(obj.c()); // 123

簡単に言うと、これはスコープの問題ですb。属性のthisは実際には親スコープを指します。ここではウィンドウであり、ウィンドウで変数aを定義していません。c属性のthisはobjを指します。オブジェクト自体はスコープを作成できませんが、関数(メソッド)はローカルスコープを作成できるためです。

1.次に、最初にaをウィンドウに追加すると、結果は次のようになります。

  var a = 5
    obj = {
        a: 123,
        b: this.a,
        c: function () {
            return this.a;
        }
    };
   console.log(obj.b); // 5
   console.log(obj.c()); // 123

2.本当にbでaを取得したい場合は、cと同じ記述を使用します。


   obj = {
        a: 123,
        b: function () {
            return this.a;
        },
        c: function () {
            return this.a;
        }
    };
   console.log(obj.b()); // 123
   console.log(obj.c()); // 123

3.次に、bのthisをobjに変更します


    obj = {
        a: 123,
        b: obj.a,
    };
   console.log(obj.b);

案の定、エラーが報告されました。

4. 次に、this of cをobjに変更します 


   obj = {
        a: 123,
        c: function () {
            return obj.a;
        }
    };
   console.log(obj.c()); // 123

さすがに正常に出力できます。 

5.最後に、arrow関数を使用してメソッドを記述します。独自のthisがないarrow関数は、親スコープであるwindowを継承します。

   obj = {
        a: 123,
        c: ()=>{
            return this.a
        }
    };
    console.log(obj.c()); // undefined

概要:

1.グローバル環境のオブジェクトはグローバル環境の関数と同じで、これはウィンドウを指します

2.オブジェクトメソッドとして呼び出された場合、これはメソッドを呼び出したオブジェクトを指します

3.アロー関数は独自のthisを持たず、グローバルオブジェクトと同等であり、ウィンドウを指します。

おすすめ

転載: blog.csdn.net/a1059526327/article/details/108358928