JavaScript - Metode call()

Hai sana, superstar pemrograman masa depan! Hari ini, kita akan mendalami salah satu trik kecil yang menarik di JavaScript: metode call(). Jangan khawatir jika Anda baru saja memulai pemrograman; saya akan memandu Anda dalam perjalanan ini langkah demi langkah, seperti yang telah saya lakukan bagi ribuan murid selama tahun-tahun mengajar saya. Jadi, ambil secangkir minuman favorit Anda, dan mari kita memulai petualangan yang menarik ini!

JavaScript - Function call()

Apa Itu Metode Function call()?

Sebelum kita masuk ke metode call(), mari kita segarkan ingatan tentang fungsi. Fungsi di JavaScript seperti mesin kecil yang melakukan tugas-tugas tertentu. Mereka sangat berguna, dan sekali Anda mengenal mereka, Anda akan selalu menggunakan mereka!

Sekarang, metode call() adalah kekuatan khusus yang dimiliki fungsi. Itu memungkinkan kita untuk memanggil (atau menjalankan) fungsi dan menentukan apa yang this merujuk kepada dalam fungsi itu. Jika itu terdengar sedikit membingungkan, jangan khawatir! Kita akan membongkar itu dengan beberapa contoh.

Sintaks

Ini adalah penampilan metode call():

functionName.call(thisArg, arg1, arg2, ...)
  • functionName adalah fungsi yang kita ingin panggil.
  • thisArg adalah apa yang kita ingin this merujuk kepada dalam fungsi.
  • arg1, arg2, ... adalah argumen yang kita ingin kirim ke fungsi.

Contoh Metode Function call()

Ayo masuk ke beberapa contoh untuk melihat bagaimana call() bekerja dalam praktek!

Contoh 1: Penggunaan Dasar

function greet() {
console.log(`Hello, my name is ${this.name}!`);
}

const person = { name: 'Alice' };

greet.call(person);

Jika Anda menjalankan kode ini, Anda akan melihat:

Hello, my name is Alice!

Apa yang terjadi disini? Kita menggunakan call() untuk menjalankan fungsi greet, tapi kita mengatakan kepadanya untuk menggunakan person sebagai this. Jadi ketika fungsi mencoba mengakses this.name, sebenarnya itu mengakses person.name.

Contoh 2: Mengirimkan Argumen

function introduce(hobby, food) {
console.log(`Hi, I'm ${this.name}. I love ${hobby} and my favorite food is ${food}.`);
}

const person1 = { name: 'Bob' };
const person2 = { name: 'Carol' };

introduce.call(person1, 'coding', 'pizza');
introduce.call(person2, 'painting', 'sushi');

Ini akan mencetak:

Hi, I'm Bob. I love coding and my favorite food is pizza.
Hi, I'm Carol. I love painting and my favorite food is sushi.

Dalam contoh ini, kita tidak hanya menentukan apa this harus merujuk kepadanya, tapi kita juga mengirimkan argumen ke fungsi. Metode call() memungkinkan kita melakukan kedua hal itu!

Contoh 3: Meminjam Metode

Salah satu hal yang paling menarik tentang call() adalah bahwa itu memungkinkan kita untuk "meminjam" metode dari objek lain. Biarkan saya menunjukkan apa yang saya maksud:

const calculator = {
multiply: function(a, b) {
return a * b;
}
};

const scientific = {
square: function() {
return this.multiply(this.number, this.number);
},
number: 5
};

console.log(scientific.square.call(scientific));  // Ini bekerja seperti yang diharapkan
console.log(calculator.multiply.call(scientific, scientific.number, scientific.number));  // Ini meminjam metode multiply

Output:

25
25

Dalam contoh ini, kita meminjam metode multiply dari objek calculator dan menggunakannya dalam konteks objek scientific. Sangat menarik, kan?

Contoh 4: Menggunakan call() dengan Metode Bawaan

Apakah Anda tahu bahwa kita bahkan dapat menggunakan call() dengan metode bawaan JavaScript? Periksalah ini:

const numbers = [1, 2, 3, 4, 5];
const max = Math.max.call(null, ...numbers);
console.log(max);  // Output: 5

Di sini, kita menggunakan call() dengan Math.max(). Argumen null karena Math.max() tidak menggunakan this, dan kita menyebar array numbers sebagai argumen individual.

Metode Terkait call()

Untuk memberikan Anda gambaran utuh, mari kita lihat beberapa metode yang terkait dengan call():

Metode Deskripsi Sintaks
call() Memanggil fungsi dengan this value tertentu dan argumen yang diberikan secara individual func.call(thisArg, arg1, arg2, ...)
apply() Mirip dengan call(), tapi argumen diberikan dalam bentuk array func.apply(thisArg, [argsArray])
bind() Membuat fungsi baru dengan this value yang tetap func.bind(thisArg, arg1, arg2, ...)

Setiap metode ini memiliki kasus penggunaannya, tetapi call() seringkali yang paling mudah saat Anda tahu tepat apa argumen yang Anda kirim.

Kesimpulan

Dan begitu juga, murid-murid tercinta! Kita telah mengeksplorasi metode call() dari atas ke bawah. Ingat, call() seperti tongkat sihir yang memungkinkan Anda mengontrol apa yang this merujuk kepada dalam fungsi dan memungkinkan Anda meminjam metode dari objek lain.

Seperti halnya semua hal di pemrograman, latihan membuat sempurna. Jadi jangan takut untuk mencoba call() dalam kode Anda sendiri. Siapa tahu? Anda mungkin akan menemukan bahwa Anda seringkali memerlukan call() lebih dari yang Anda pikirkan!

Terus coding, terus belajar, dan ingat: di dunia JavaScript, Anda selalu hanya satu call() jauh untuk membuka kemungkinan baru!

Credits: Image by storyset