THIS PADA JAVASCRIPT

Di dunia pemrograman, ‘this’ seringkali membingungkan, terutama kursus dalam konsep Object Oriented Programming (OOP). ‘This’ pada Javascript memiliki karakteristik yang unik dan juga penting untuk dipahami.

Tentang Kata Kunci ‘this’ di JavaScript

Dalam Javascript, ‘this’ adalah kata kunci khusus yang dapat didefinisikan secara dinamis saat berjalannya eksekusi kode. Kata kunci ‘this’ merujuk pada objek konteks di mana kode saat ini sedang dieksekusi, ini bisa berisi objek global, objek saat ini, atau objek lainnya tergantung pada konteks.

Penggunaan ‘this’ dalam Fungsi Biasa

Jika kamu menggunakan ‘this’ dalam fungsi biasa, nilai ‘this’ akan merujuk pada objek global, yang dalam hal ini adalah objek window (dalam browser).

function test() {
    console.log(this);
}

test();
// output: Window {...}

Penggunaan ‘this’ dalam Metode Objek

Jika ‘this’ digunakan dalam metode objek, maka ‘this’ akan merujuk pada objek tersebut.

let obj = {
    name: 'Budi',
    age: 25,
    hello: function() {
        console.log('Halo, namaku adalah ' + this.name);
    }
}

obj.hello();
// output: 'Halo, namaku adalah Budi'

Penggunaan ‘this’ dalam Konstruktor

Dalam konteks konstruktor, ‘this’ merujuk ke instance baru yang dihasilkan oleh konstruktor.

function User(name, age) {
    this.name = name;
    this.age = age;
}

let user1 = new User('Ali', 20);
console.log(user1.name);
// output: 'Ali'

‘this’ dalam Arrow Functions

Dalam arrow functions, ‘this’ menetap tidak berubah dari lingkup di mana fungsi arrow tersebut dideklarasikan.

let obj = {
    name: 'Budi',
    age: 25,
    hello: () => {
        console.log('Halo, namaku adalah ' + this.name);
    }
}

obj.hello();
// output: 'Halo, namaku adalah undefined'

Pada contoh di atas, ‘this’ tidak merujuk ke objek tapi sebaliknya merujuk ke objek global. Hal ini menunjukkan bahwa perilaku ‘this’ dalam arrow functions berbeda dengan fungsi biasa dan metode objek.

Kesimpulan

Memahami ‘this’ di Javascript memang membingungkan. Namun, dengan memahami dan mengingat konteks di mana ‘this’ digunakan, kamu dapat mengantisipasi perilaku ‘this’ dan menghindari bug yang tidak perlu dalam kode Javascript kamu.