【js】javascriptにおけるthisの役割領域の詳細

もっと読む
 
Javascriptの中でthisの方向はずっと私の長い問題を困らせています.使用中に間違えた確率もとても大きいです.対象言語の中では、現在の対象の一つの引用を表していますが、jsの中では常に混乱しています.固定的なものではなく、その実行環境の変化に従って変化しています.Javascriptでは、thisは常にその方法を呼び出す対象を指す.thisは関数が動作する時に自動的に生成される内部オブジェクトですので、関数の内部でのみ使用できます.
いくつかのケースに分けて、thisの使い方を深く分析します.

    function globalTest() {
        this.name = "global this";
        console.log(this.name);
    }
    globalTest(); //global this

以上のコードの中で、global Test()は全体的な方法であり、グローバルコールに属しているので、thisはグローバルオブジェクトwindowを表します.thisがwindowであることを十分に証明するために、コードを以下のように変更します.

    var name = "global this";

    function globalTest() {
        console.log(this.name);
    }
    globalTest(); //global this

nameはグローバル変数として、実行結果は相変わらず「global this」です.方法体では大域nameを変更して、再度メソッドを呼び出して出力する「rename global this」を試み、大域のnameがメソッド内で変更されることを説明します.コードは以下の通りです

    var name = "global this";

    function globalTest() {
        this.name = "rename global this"
        console.log(this.name);
    }
    globalTest(); //rename global this

以上の3つのコードから結論を出しました.全体的な方法に対して、thisは全体のオブジェクトwindow、すなわち呼び出し方法の対象を指しています.
2.オブジェクトメソッドの呼び出し関数をオブジェクトとする方法で呼び出すと、thisはこの上位オブジェクト、すなわち呼び出し方法のオブジェクトを指します. 以下のコードでは、thisは、objオブジェクトを指します.

    function showName() {
        console.log(this.name);
    }
    var obj = {};
    obj.name = "ooo";
    obj.show = showName;
    obj.show(); //ooo

3.コンストラクタの呼び出しコンストラクタのthisは、新しく作成されたオブジェクト自体を指します.

    function showName() {
        this.name = "showName function";
    }
    var obj = new showName();
    console.log(obj.name); //showName function

上記のコードでは、newキーワードを通じてオブジェクトの一例を作成し、newキーワードはthisの指向を変更し、このthisをオブジェクトobjに向けることができる.私たちはもう一つのグローバルなnameを追加して、thisが指すのはglobalではないことを証明します.

    var name = "global name";

    function showName() {
        this.name = "showName function";
    }
    var obj = new showName();

    console.log(obj.name); //showName function
    console.log(name); //global name

コンストラクタの内部では、this.nameに対して値を割り当てますが、大域変数nameは変わりません.
4.apply/call呼び出し時のthisアプリとcallは、関数体内部のthis指向を変えるためです. その具体的な定義は以下の通りである.コール方法:シンタックス:call定義:オブジェクトを呼び出す方法は、現在のオブジェクトを別のオブジェクトに置き換えるためのものである.説明:コール方法は、他のオブジェクトの代わりに一つの方法を呼び出すために使用されてもよい.call方法は、関数のオブジェクトコンテキストを初期のコンテキストから、thisObjによって指定された新しいオブジェクトに変更することができる.thisObjパラメータが提供されていない場合、GlobalオブジェクトはthisObjとして使用される.
applyメソッド:構文:apply定義:あるオブジェクトを適用する方法で、現在のオブジェクトを別のオブジェクトに置き換えます.説明:もしargArayが有効な配列ではないか、またはargmentsオブジェクトではないなら、TypeErrorを引き起こすことになります.argArayおよびthisObjのいずれかのパラメータが提供されていない場合、GlobalオブジェクトはthisObjとして使用され、任意のパラメータを伝達することができない.

    var value = "Global value";

    function FunA() {
        this.value = "AAA";
    }

    function FunB() {
        console.log(this.value);
    }
    FunB(); //Global value           FunB(),this.value     value
    FunB.call(window); //Global value,this  window  ，  this.value     value
    FunB.call(new FunA()); //AAA, this    new FunA()， FunA  

    FunB.apply(window); //Global value
    FunB.apply(new FunA()); //AAA

上記のコードでは、thisの指向はcallとapplyで一致していますが、呼び出しパラメータの形式が違っています.コールはパラメータを呼び出しますが、appyは配列を呼び出します.具体的には今後のブログで単独で述べる.