Kata Kunci this Pemrograman JavaScript

Contoh

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

Coba Sendiri

Apa yang artinya this?

JavaScript this Kata kunci merujuk kepada objek tempatnya.

Memiliki nilai yang berbeda, tergantung dari lokasinya penggunaannya:

  • Dalam method,this Merujuk kepada objek pemilik.
  • Dalam situasi terpisah,this Merujuk kepada objek global.
  • Dalam fungsi,this Merujuk kepada objek global.
  • Dalam fungsi, di mode ketat,this Adalah undefined.
  • Dalam peristiwa,this Merujuk kepada elemen yang menerima peristiwa.

Dengan cara yang sama call() dan apply() Method seperti ini dapat mengacu ke objek apapun dengan this.

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;
}

Coba Sendiri

this terpisah

Dalam penggunaan terpisah, pemiliknya adalah objek global, jadi this Merujuk kepada objek global.

Dalam jendela browser, objek global adalah [object Window]:

Contoh

var x = this;

Coba Sendiri

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

Contoh

"use strict";
var x = this;

Coba Sendiri

this dalam fungsi (default)

Pemilik fungsi dalam fungsi JavaScript secara default diikat this.

Jadi, di dalam fungsi,this Merujuk kepada objek global [object Window].

Contoh

function myFunction() {
  return this;
}

Coba Sendiri

this dalam fungsi (mode ketat)

Mode ketat JavaScript tidak mengijinkan pengikatan default.

Jadi, saat digunakan dalam fungsi, di mode ketat,this Adalah yang belum ditentukan (undefined)}

Contoh

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

Coba Sendiri

this dalam pemrosesan peristiwa

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

Contoh

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

Coba Sendiri

Pemanggilan method objek

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

Contoh

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

Coba Sendiri

Contoh

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

Coba Sendiri

atau kata lainthis.firstName berarti thisdari objek firstName Atribut.

Pembatasan Fungsi Terbuka

call() dan apply() Metode adalah metode JavaScript yang diumumkan.

Mereka keduanya dapat digunakan untuk memanggil metode objek lain dengan parameter objek lain.

Anda dapat membaca tentang contoh lainnya di belakang panduan ini. call() dan apply() lebih banyak konten.

dalam contoh di bawah ini, saat menggunakan person2 sebagai parameter memanggil person1.fullName,this akan mengacu ke person2, bahkan jika itu adalah metode person1:

Contoh

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

Coba Sendiri