JavaScriptにおけるこの点の問題とこの点を変更する方法

1.さまざまな状況でのこのポイント

これは、通常の関数呼び出し時のウィンドウを指します

function fn() {
       console.log(this);
}
fn();  //window

コンストラクターが呼び出されると、これはインスタンス化されたオブジェクトを指し、プロトタイプオブジェクトのこれもインスタンス化されたオブジェクトを指します

        function Star(name, age) {
            this.name = name;
            this.age = age;
            console.log(this);
        }
        var star = new Star('jisoo', 25);  //Star {name: "jisoo", age: 25}

オブジェクトメソッドが呼び出されると、これはメソッドが属するオブジェクトを指します

        var obj = {
            name: 'jisoo',
            age: 25,
            fn: function() {
                console.log(this);
            }
        }
        obj.fn();  //Star {name: "jisoo", age: 25}

イベントバインディングメソッドのthisは、バインディングイベントオブジェクトを指します

        var btn = document.querySelector('button');
        btn.addEventListener('click', function() {
            console.log(this);
        })  //<button>点击<button>

タイマー機能のこれはウィンドウを指しています
即時実行機能のこのポイントはウィンドウを指します

2.これの方向を変える

apply（）メソッドの関数
apply（）：別のオブジェクトのメソッドを乗っ取って、別のオブジェクトのプロパティを継承
できます。function.apply（obj、args）メソッドは2つのパラメーターを受け取ります
。obj：このオブジェクトはこのオブジェクトを置き換えます。関数
args：arrayでは、パラメーターとして関数に渡されます（args–> arguments）

//首先定义一个Star对象
        function Star(name, age) {
            this.name = name;
            this.age = age;
        }
//在定义一个歌手对象
        function Singer(name, age, song) {
            Star.apply(this, arguments);
            this.song = song;
        }
        var singer = new Singer('张韶涵', 39, '隐形的翅膀');
        console.log(singer.name);//'张韶涵'
        console.log(singer.age);//39
        console.log(singer.song);//‘隐形的翅膀’

singerオブジェクトに書き込まれていなかったが、最後に出力されthis.name=name;this.age=ageたことsinger.name，singer.ageがわかります。これはapply（）の関数です。次のコード行を
分析します。this ：オブジェクトを作成するとき、Singer引数を表します。 array、つまり、['Zhang Shaohan'、39、 'Invisible Wings'];素人の言葉で言えば：Singerを使用してStarクラスのコンテンツを実行し、Starクラスにthis.nameなどのステートメントがあるため、プロパティはSingerオブジェクト2で作成されます。call（）メソッドcall（）の役割：別のオブジェクトのメソッドを乗っ取り、別のオブジェクトのプロパティを継承できます。function.call（obj、[param1 [、param2 [、 …[、paramN]]]]）メソッドは2つのパラメータを受け取ります：obj：このオブジェクトは関数クラスのthisオブジェクトを置き換えますparams：これはパラメータリストですStar.apply(this, arguments)

        function Star(name, age) {
            this.name = name;
            this.age = age;
        }
        function Singer(name, age, song) {
            Star.call(this, name, age);
            this.song = song;
        }
        var singer = new Singer('张韶涵', 39, '隐形的翅膀');
        console.log(singer.name);
        console.log(singer.age);
        console.log(singer.song);

にStar.apply(this, arguments);置き換えられますStar.call(this, name, age);

JavaScriptにおけるこの点の問題とこの点を変更する方法

JavaScriptにおけるこの点の問題とこの点を変更する方法

おすすめ