JS で this が指すいくつかの関数呼び出しメソッドの紹介

この記事の内容は、JS で指摘されるいくつかの関数呼び出しメソッドの紹介です。必要な方は参考にしていただければ幸いです。

JavaScript の初心者は、this ポインターについて常に混乱します。JavaScript を詳しく学びたい場合は、まずこれに関連するいくつかの概念を明確にする必要があります。 JavaScript では、これは常にオブジェクトを指しますが、これが指す特定のオブジェクトは、関数が宣言されたときの環境ではなく、関数の実行環境に従って実行時に動的にバインドされます。 with や eval という特殊な状況を除けば、実際のアプリケーションでは、このポインタは次の 4 種類に大別できます。

オブジェクトのメソッドとして呼び出される

関数がオブジェクトのメソッドとして呼び出される場合、これはオブジェクトを指します:

var person = {
  name: 'twy',
  getName: function() {
    console.info(this === person);  // 输出true
    console.info(this.name);     // 输出twy
  }
}
person.getName();

通常の関数として呼び出される

When 関数が通常の関数として呼び出される場合、非厳密モードでは、これはグローバル オブジェクトを指します:

function getName(){
  // 非严格模式
  console.info(this === window); // 浏览器环境下输出true
}
getName();

厳密モードでは、これは未定義です:

function getName(){
  // 严格模式
  "use strict"
  console.info(this === window); // 输出false
}
getName();

Theコンストラクターが呼び出されます

When new オブジェクトがオブジェクトの場合、コンストラクター内の this は新しいオブジェクトを指します:

function person(){
  // 构造函数
  this.color = 'white';
}
var boy = new person();
console.info(boy.color);  // 输出white

call または apply

Use Function。 prototype.apply または Function .prototype.call は、受信関数の this ポインターを動的に変更できます:

// 声明一个父亲对象，getName方法返回父亲的名字
var father = {
  name: 'twy',
  getName: function(){
    return this.name;
  }
}
// 生命一个儿子对象，但是没有返回名字的功能
var child = {
  name: 'chy'
}
console.info(father.getName()); // 输出twy

// 使用call或apply将father.getName函数里this指向child
console.info(father.getName.call(child)); // 输出chy
console.info(father.getName.apply(child)); // 输出chy

以上がJS で this が指すいくつかの関数呼び出しメソッドの紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。