JavaScriptにおけるthisの使い方及びcallの理解


thisとは何ですか
thisはJavaScriptのキーワードの一つです.それは対象の方法に使われます.thisは常にこの方法を呼び出すオブジェクトを指します.
オブジェクトにthisを適用する方法
var obj = {  
    name : 'object',
    sayName : function () {
        alert(this.name);
    }
};
obj.sayName(); // object
オブジェクトとして  obj 呼び出し  sayName この方法は、this 指しているのは  obj .故に  alert(this.name)結果は  object.すなわち  this 対象の方法に現れた場合、この方法を実行する場合  this この対象自体を指す.
関数でthis
var val='kk';   
function hello(){
   console.log('hello '+this.val);
}
    var a={"val":"a","hello":hello},b={"val":"b","hello":hello};
    hello();//hello kk
    a.hello();//hello a
    b.hello();//hello b
thisは、現在の関数を呼び出すオブジェクトを指しており、ウェブページのグローバルスコープで呼び出した場合、thisオブジェクトはwindowであることが分かります.
thisはコンストラクタにあります.
var name  = "global";  
function Person () {  
    this.name = "someone";
}
var sam = new Person();  
alert(sam.name); // someone  
以上のコードは,構造関数において明確に示されている.  this の指向問題.コンストラクタの例を宣言すると、コンストラクタ内部の  this いずれも新しい実例を指す.ですから、実行しています  var sam = new Person() この文は、  this 方向を指す  samですので、この時は  sam.name = "someone"callとappyは何ですか?call メソッドを適用  Function オブジェクトcall方法は、関数のオブジェクトコンテキストを初期のコンテキストから、thisObjによって指定された新しいオブジェクトに変更することができる.thisObjパラメータが提供されていない場合、GlobalオブジェクトはthisObjとして使用される.applyとcallの両方は役割は同じですが、両者はパラメータに違いがあります.最初のパラメータの意味は同じですが、2番目のパラメータ:applyはパラメータ配列、つまり複数のパラメータを組み合わせて1つの配列にして入ってきます.callはcallのパラメータとして入ってきます.如き  func.call(func1,var1,var2,var3) appyはfunc.apply(func1,[var1,var2,var3])と表記されています.
コールでオブジェクトに入る
var sayName = function () {  
    alert(this.name);
}
var peter = {  
    name: "peter"
}
sayName.call(peter); //peter  
上記の例は直観的に理解できます.  call 仕事の原理.つまり、関数で呼び出すと  call この方法は、関数内部の  this オブジェクトは自動的に指します.  call メソッドの最初のパラメータです.上の例ではつまり  peter この相手です.だから実行しています  sayName.call(peter) を選択します.  this.name 自動的に指します  peter.name .結果は  peter
function Person1 () {  
    this.name = "person1";
    this.sayName = function () {
        alert(this.name);
    }
}
function Person2 () {  
    this.name = "person2";
}
var sam = new Person2();
Person1.call(sam);
sam.sayName(); //person1  
以上の例で、最も重要なのは  Person1.call(sam) このステップ.中で何があったのか見てみましょう.呼び出し時  callこの方法の場合、関数  Person1 内部の  this 方向を指す  sam このオブジェクト.に相当する  sam このオブジェクトはこの2つの文を実行します.
this.name = "person1";  
this.sayName = function () {  
    alert(this.name)
}
ですので、ここで元を書き直しました.  sam オブジェクト内の  name を選択します.また新しい方法が得られた.成功的に呼び出すことができます.  sam.sayName() そして結果は戻ってきます  person1 .
コール中の着信関数
function class1 () {  
    this.message = "yeah";
}
function class2 () {  
    this.sayMessage = function () {
        alert(this.message);
    }
}
class2.call(class1);  
alert(class1.sayMessage);  
class1.sayMessage(); //undefined  
上記の例では、私達は呼び出しました.  class2 関数の  call 方法が入ってきました  class1 この関数.結果  class1 持っています  sayMessage この方法.この方法を直接呼び出して返したところ、  undefined 私たちが望むのではなく  yeah .これはなぜですか?この中の  this 私たちは次のように修正します.
var message = "hi";
function class1 () {  
    this.message = "yeah";
}
function class2 () {  
    this.message = "hello";
    this.sayMessage = function () {
        alert(this.message);
    }
}
class2.call(class1);  
alert(class1.sayMessage);  
class1.sayMessage(); // hello
class1.message = "msg";
class1.sayMessage(); //msg  
最初の呼び出し  sayMessage 方法を返します  hello .もう一度見にきます.  class2.call(class1) この過程.この方法を実行すると、class1 獲得する  class2 の  message 属性と  sayMessage 方法.だから今は  class1.message = "hello" , class1.sayMessage = function () {alert(this.message)}.従って実行  sayMessage を返します  hello.私たちが手動で修正するとき  class1.message を選択すると、この方法を呼び出して、私たちが修正した値を返します.これは私たちの上の推理が正しいことを証明しています.
function class1 () {  
    this.message = "yeah";
}
function class2 () {  
    this.sayMessage = function () {
        alert(this.message);
    }
}
class2.call(class1);  
alert(class1.sayMessage);  
class1.sayMessage(); //undefined  
この例には定義がありません.  class1.message この属性です.だから実行します  sayMessage メソッドの場合、未定義に戻ります.紛らわしいところがあります.  class1で定義されている  this.message わけではない  class1.message .ではなく  class1 の実例はこれを持っています.  message を選択します
似たような例は次のようなものがあります.
function Class1(){  
    this.showTxt = function(){alert(this.name)}
}
function Class2(){  
    this.name = 'class2';
}
var class1 = new Class1();  
class1.showTxt.call(Class2);//undefined  
alert(Class2.showTxt);//undefined