javascriptにおけるthisの4つの使い方

2296 ワード

this
関数が実行されるとき、thisは常に関数を呼び出すオブジェクトを指します.thisの方向を判断するには、thisの位置を判断する関数は誰ですか?
「javaScript言語の精粋」という本の中で、thisが現れる場面を四つの種類に分けています.簡単に言えば、
オブジェクトがあると、呼び出しオブジェクトが起動されていないとグローバルオブジェクトを指すnew構造は、新しいオブジェクトをappyまたはcallまたはbindでthisを変更することを指します.
1)関数がオブジェクトに属する場合:所属するオブジェクトを指します.
関数がオブジェクトに属する場合は、通常、表式で呼び出されます.この場合、thisは自然にオブジェクトを指します.例えば、次の例:

var myObject = {value: 100};
myObject.getValue = function () {
 console.log(this.value); //    100

 //    { value: 100, getValue: [Function] },
 //      myObject     
 console.log(this);

 return this.value;
};

console.log(myObject.getValue()); // => 100

getValueは対象myObjectに属し、myOjbectによって呼び出されるので、対象myObjectを指す.
2)関数にはオブジェクトがありません.グローバルオブジェクトを指します.

var myObject = {value: 100};
myObject.getValue = function () {
 var foo = function () {
  console.log(this.value) // => undefined
  console.log(this);//        global
 };

 foo();

 return this.value;
};

console.log(myObject.getValue()); // => 100

上記のコードブロックでは、foo関数はgetValueの関数として定義されていますが、実際にはgetValueでもmyObjectでもありません.fooはどのオブジェクトにも結合されていませんので、呼び出し時には、そのthisポインタはグローバルオブジェクトglobalを指します.
これは設計ミスだそうです.
3)コンストラクタの中のthis:新しいオブジェクトを指します.
jsでは、newキーワードを通じて構造関数を呼び出します.この時、thisは新しいオブジェクトに結び付けられます.

var SomeClass = function(){
 this.value = 100;
}

var myCreate = new SomeClass();

console.log(myCreate.value); //   100

ちなみに、jsでは、コンストラクション、一般関数、オブジェクト方法、クローズドの4つの境界線が明確にされていません.境界線は人の心の中にある.
4)appyとcall呼び出し及びbindバインディング:バインディングの対象を指す.
2つのパラメータをapply()で受け入れる方法は、最初に関数動作のスコープであり、もう一つはパラメータ配列である.
call()メソッドの最初のパラメータの意味はappy()メソッドと同じですが、他のパラメータは一つ一つ列挙する必要があります.
簡単に言えば、callの方式は私達が普段関数を呼び出すのに近いですが、appyは私達がAray形式の配列を伝えてあげます.それらはお互いに変換できます.

var myObject = {value: 100};

var foo = function(){
 console.log(this);
};

foo(); //      global
foo.apply(myObject); // { value: 100 }
foo.call(myObject); // { value: 100 }

var newFoo = foo.bind(myObject);
newFoo(); // { value: 100 }
以上が本文の全部です.お好きになってください.