JavaScript Function bind()

Pemutusan Fungsi (Function Borrowing)

dengan menggunakan method bind(), objek dapat meminjam method dari objek lain.

contoh di bawah ini menciptakan 2 objek (person dan member).

objek member mengambil method fullname objek person:

实例

const person = {
  firstName: "Bill",
  lastName: "Gates",
  fullName: function () {
    return this.firstName + " " + this.lastName;
  }
}
const member = {
  firstName: "Hege",
  lastName: "Nilsen",
}
let fullName = person.fullName.bind(member);

Coba Sendiri

menjaga this

terkadang perlu menggunakan method bind() untuk mencegah hilangnya this.

dalam contoh di bawah ini, objek person memiliki method display. Dalam method display,this berarti objek person:

实例

const person = {
  firstName: "Bill",
  lastName: "Gates",
  display: function () {
    let x = document.getElementById("demo");
    x.innerHTML = this.firstName + " " + this.lastName;
  }
}
person.display();

Coba Sendiri

ketika fungsi digunakan sebagai kembalian (callback),this akan hilang.

contoh ini akan mencoba untuk menampilkan nama dalam 3 detik, tetapi akan menampilkan undefined:

实例

const person = {
  firstName: "Bill",
  lastName: "Gates",
  display: function () {
    let x = document.getElementById("demo");
    x.innerHTML = this.firstName + " " + this.lastName;
  }
}
setTimeout(person.display, 3000);

Coba Sendiri

method bind() menyelesaikan masalah ini.

dalam contoh di bawah ini, method bind() digunakan untuk mengikat person.display ke person.

ini contoh akan menampilkan nama orang dalam 3 detik:

实例

const person = {
  firstName: "Bill",
  lastName: "Gates",
  display: function () {
    let x = document.getElementById("demo");
    x.innerHTML = this.firstName + " " + this.lastName;
  }
}
let display = person.display.bind(person);
setTimeout(display, 3000);

Coba Sendiri

Apa itu this?

dalam JavaScript,this kata kunci merujukobjek.

merujukyangobjek tergantung pada cara pemanggilan (penggunaan atau pemanggilan).

berdasarkan cara penggunaannya, kata kunci this merujuk ke objek yang berbeda:

  • dalam metode objek,this merujuk keobjek.
  • digunakan sendiri,this merujukobjek global.
  • dalam fungsi,this merujukobjek global.
  • dalam fungsi, di mode ketat,this adalah undefined.
  • dalam acara,this merujuk ke elemen yang menerima acaraelemen.
  • metode seperti call(), apply(), dan bind() dapat meng this merujuk keobjek apapun.

Perhatian:this tidak adalah variabel. Ini adalah kata kunci. Anda tidak dapat mengubahnya this nilai.

Lihat Juga:

Panduan:this JavaScript