JavaScript - Metode panggilan()

Hai sana, super bintang coding masa depan! Hari ini, kita akan melihat salah satu trik kecil JavaScript yang menyenangkan: metode call(). Jangan khawatir jika Anda baru dalam programming; saya akan memandu Anda melalui perjalanan ini langkah demi langkah, seperti yang saya lakukan untuk ribuan murid selama tahun-tahun mengajar saya. Jadi, ambil secangkir minuman favorit Anda, dan mari kita memulai petualangan yang menarik ini!

Apa itu Metode Function call()?

Sebelum kita melompat ke metode call(), mari kita segarkan ingatan tentang fungsi. Fungsi dalam JavaScript seperti mesin kecil yang melakukan tugas-tugas khusus. Mereka sangat berguna, dan sekali Anda mengenalinya, Anda akan menggunakan mereka secara terus-menerus!

Sekarang, metode call() adalah kekuatan khusus yang dimiliki fungsi. Itu memungkinkan kita untuk memanggil (atau menjalankan) fungsi dan menentukan apa yang this merujuk dalam fungsi itu. Jika itu terdengar sedikit membingungkan, jangan khawatir! Kita akan membongkar hal ini 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 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 tindakan!

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 memanggil fungsi greet, tetapi 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 mengeluarkan:

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, tetapi kita juga mengirimkan argumen ke fungsi. Metode call() memungkinkan kita untuk melakukan kedua hal itu!

Contoh 3: Menyewa Metode

Salah satu hal yang paling menarik tentang call() adalah bahwa itu memungkinkan kita untuk "menyewa" metode dari objek lain. mari 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 menyewa metode multiply

Output:

25
25

Dalam contoh ini, kita menyewa 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? Cek 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 adalah karena Math.max() tidak menggunakan this, dan kita menyebarkan array numbers sebagai argumen individual.

Metode Terkait call()

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

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

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

Kesimpulan

Dan begitulah, murid-murid tercinta! Kita telah mengeksplorasi metode call() dari atas ke bawah. Ingat, call() adalah seperti tongkat sihir yang memungkinkan Anda mengendalikan apa this berarti dalam fungsi dan memungkinkan Anda meminjam metode dari objek lain.

Seperti halnya semua hal dalam programming, latihan membuat sempurna. Jadi jangan takut untuk mencoba call() dalam kode Anda sendiri. Siapa tahu? Anda mungkin akan menemukan bahwa Anda memanggil call() lebih sering daripada yang Anda pikirkan!

Tetap mengoding, tetap belajar, dan ingat: di dunia JavaScript, Anda selalu hanya satu call() jauh untuk membuka kemungkinan baru!

Credits: Image by storyset