← JavaScript55 / 69

this yang hilang di callback

Ini bug klasik: method yang dipakai sebagai callback kehilangan `this`, karena nilai this ditentukan oleh *cara pemanggilan*, bukan tempat penulisan. Solusi modern: pakai arrow function, yang mengambil this dari tempat ia didefinisikan. Alternatif lama yang masih sering kamu temui di codebase adalah fn.bind(this), jadi kenali bentuknya walaupun kamu sendiri memilih arrow function.

👀 Contoh dulu

class Timer {
  constructor() { this.label = 'TIMER'; }

  jalan() {
    // ❌ function biasa: this berubah, jadi undefined
    setTimeout(function () {
      console.log('A:', this?.label);
    }, 50);

    // ✅ arrow: this tetap milik instance
    setTimeout(() => {
      console.log('B:', this.label);
    }, 100);
  }
}

new Timer().jalan();

Hasilnya: A: undefined B: TIMER

💡 Arrow function tidak punya this sendiri — ia meminjam this dari tempat ia DITULIS, bukan dari cara ia dipanggil.

📝 Sekarang giliranmu

Perbaiki kode agar this.nama terbaca di dalam setTimeout: ubah callback function biasa menjadi arrow function.

Preview
← SebelumnyaBerikutnya →