Kata Kunci this JavaScript

实例

var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

亲自试一试

Apakah this adalah?

JavaScript this Kata kunci merujuk kepada objek yang dimilikinya.

ia mempunyai nilai yang berbeza, bergantung kepada tempat penggunaannya:

  • Dalam method,this Merujuk kepada objek pemilik.
  • Dalam keadaan sendiri,this Merujuk kepada objek global.
  • Dalam fungsi,this Merujuk kepada objek global.
  • Dalam fungsi, dalam mode keras,this ialah undefined.
  • Dalam peristiwa,this Merujuk kepada elemen yang menerima peristiwa.

Dengan contoh, call() 和 apply() Method seperti ini dapat mengambil alih this ke mana-mana objek.

this dalam method

Dalam method objek,this Merujuk kepada pemilik method ini.

Dalam contoh di paling atas halaman ini,this Merujuk kepada objek person.

Objek person adalah pemilik method fullName.

fullName : function() {
  return this.firstName + " " + this.lastName;
}

亲自试一试

this sendiri

Dalam penggunaan secara sendiri, pemilik adalah objek global, oleh kerana this Merujuk kepada objek global.

Dalam tingkap pelayar, objek global adalah [object Window]:

实例

var x = this;

亲自试一试

Dalam mode keras, jika digunakan secara sendiri, this Merujuk kepada objek global [object Window]:

实例

"use strict";
var x = this;

亲自试一试

this dalam fungsi (baku)

Pengikatan pemilik fungsi secara baku dalam fungsi JavaScript this.

Oleh kerana, dalam fungsi,this Merujuk kepada objek global [object Window].

实例

function myFunction() {
  return this;
}

亲自试一试

this dalam fungsi (mode keras)

Mode keras JavaScript tidak mengizinkan pengikatan baku.

Oleh kerana, dalam penggunaan fungsi dalam mode keras,this ialah belum ditakrifkan (undefined)}

实例

"use strict";
function myFunction() {
  return this;
}

亲自试一试

this dalam penanganan peristiwa

Dalam penanganan peristiwa HTML,this Merujuk kepada elemen HTML yang menerima peristiwa ini:

实例

<button onclick="this.style.display='none'">
  Klik untuk menghapus saya!
</button>

亲自试一试

Pemanggilan Method Objek

Dalam contoh ini,this ialah objek person (objek person adalah pemilik fungsi ini):

实例

var person = {
  firstName  : "Bill",
  lastName   : "Gates",
  id         : 678,
  myFunction : function() {
    return this;
  }
};

亲自试一试

实例

var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

亲自试一试

换句话说，this.firstName 意味着 this（person）对象的 firstName 属性。

显式函数绑定

call() 和 apply() 方法是预定义的 JavaScript 方法。

它们都可以用于将另一个对象作为参数调用对象方法。

您可以在本教程后面阅读有关 call() 和 apply() 的更多内容。

在下面的例子中，当使用 person2 作为参数调用 person1.fullName 时，this 将引用 person2，即使它是 person1 的方法：

实例

var person1 = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}
var person2 = {
  firstName:"Bill",
  lastName: "Gates",
}
person1.fullName.call(person2);  // 会返回 "Bill Gates"

亲自试一试