ID (Indonesia) Translation

JavaScript - Currying: Panduan untuk Pemula

Halo teman-teman yang sedang belajar pemrograman! Hari ini, kita akan mengemban perjalanan yang menarik ke dunia JavaScript dan mengenal konsep yang disebut "currying." Jangan khawatir jika Anda belum pernah mendengar tentang ini sebelumnya — kita akan mulai dari dasar dan perlahan-lahan maju. Pada akhir panduan ini, Anda akan dapat membuat fungsi currying seperti seorang ahli!

Apa Itu Currying?

Sebelum kita masuk ke bagian bagaimana melakukan itu, mari kita memahami apa sebenarnya currying. Currying adalah teknik dalam pemrograman fungsional dimana kita mengubah fungsi yang menerima beberapa argumen menjadi urutan fungsi, masing-masing menerima satu argumen saja.

Bayangkan Anda membuat sandwich. Daripada memasukkan semua bahan sekali, currying adalah seperti menambahkan satu bahan saja pada saat yang sama, langkah demi langkah. Hal ini memberikan Anda lebih banyak kontrol dan fleksibilitas dalam membuat "sandwich fungsi" Anda.

Bagaimana Menerapkan Currying di JavaScript

Sekarang, mari kita lihat bagaimana kita dapat mengimplementasikan currying di JavaScript. Kita akan mengenal dua metode utama: menggunakan closure dan menggunakan metode bind().

Currying Menggunakan Closures

Closures adalah seperti kotak ajaib di JavaScript yang mengingat lingkungan tempat mereka diciptakan. Kita dapat menggunakan kekuatan ini untuk membuat fungsi currying. Mari kita mulai dengan contoh sederhana:

function curry(f) {
return function(a) {
return function(b) {
return f(a, b);
};
};
}

function sum(a, b) {
return a + b;
}

let curriedSum = curry(sum);

console.log(curriedSum(2)(3)); // Output: 5

Dalam contoh ini, curry adalah fungsi tingkat tinggi yang menerima fungsi lain f sebagai argumen. Itu mengembalikan fungsi baru yang menerima argumen pertama a, yang kemudian mengembalikan fungsi lain yang menerima argumen kedua b. Akhirnya, itu memanggil fungsi asli f dengan kedua argumen.

Mari kitaura langkah demi langkah:

1. Kita mendefinisikan fungsi curry yang akan mentransformasi fungsi biasa kita menjadi fungsi currying.
2. Kita memiliki fungsi sederhana sum yang menambahkan dua angka.
3. Kita membuat curriedSum dengan mempassingkan sum ke fungsi curry.
4. Ketika kita panggil curriedSum(2)(3), sebenarnya itu melakukan hal ini:

• curriedSum(2) mengembalikan fungsi yang mengingat 2 sebagai argumen pertama.
• Kita segera memanggil fungsi ini dengan (3), yang menyelesaikan operasi.

Keren, kan? Seperti kita membangun panggilan fungsi kita secara bertahap!

Currying Menggunakan Metode bind()

JavaScript juga menyediakan metode bawaan yang disebut bind() yang kita dapat gunakan untuk currying. Metode bind() menciptakan fungsi baru yang, ketika dipanggil, memiliki this kata kunci diatur ke nilai yang diberikan, dengan urutan argumen yang diberikan sebelum argumen apa pun yang diberikan saat fungsi baru dipanggil.

Mari kita lihat bagaimana kita dapat menggunakan bind() untuk currying:

function multiply(x, y) {
return x * y;
}

let multiplyByTwo = multiply.bind(this, 2);
console.log(multiplyByTwo(4)); // Output: 8

let multiplyByThree = multiply.bind(this, 3);
console.log(multiplyByThree(4)); // Output: 12

Dalam contoh ini:

1. Kita mulai dengan fungsi sederhana multiply yang menerima dua argumen.
2. Kita menggunakan bind() untuk menciptakan fungsi baru multiplyByTwo. 2 diatur sebagai argumen pertama.
3. Ketika kita panggil multiplyByTwo(4), itu secara esensial memanggil multiply(2, 4).
4. Kita melakukan hal yang sama untuk menciptakan multiplyByThree, mengatur 3 sebagai argumen pertama.

Metode bind() memungkinkan kita untuk "mengunci" argumen tertentu dari suatu fungsi, menciptakan fungsi baru dengan argumen tersebut sudah diatur.

Kasus Penggunaan Currying

Sekarang kita mengerti bagaimana mencurry fungsi, mari kita jelajahi mengapa kita mungkin ingin melakukan ini. Currying memiliki beberapa aplikasi praktis di JavaScript:

1. Komposisi Fungsi: Currying membuatnya mudah untuk mengkomposisi fungsi, di mana output dari satu fungsi menjadi input dari fungsi lain.

2. Aplikasi Terbatas: Kita dapat menciptakan fungsi khusus dari fungsi yang lebih umum, seperti contoh multiplyByTwo kita.

3. Menghindari Repetisi: Ketika Anda menemukan diri Anda memanggil fungsi dengan beberapa argumen yang sama berulang-ulang, currying dapat membantu mengurangi repetisi.

4. Penanganan Event: Dalam pengembangan frontend, currying dapat berguna untuk penanganan event dengan parameter tambahan.

Mari kita lihat contoh nyata penggunaan currying untuk penanganan event:

function handleClick(message, event) {
console.log(message, event.target);
}

let button = document.getElementById('myButton');
button.addEventListener('click', handleClick.bind(null, 'Button clicked:'));

Dalam contoh ini, kita menggunakan currying untuk memberikan parameter tambahan ke penanganan event. Ketika tombol diklik, itu akan mencetak "Button clicked:" diikuti dengan target event.

Metode untuk Currying di JavaScript

Berikut adalah tabel yang menggabungkan metode yang kita diskusikan untuk currying di JavaScript:

Metode	Deskripsi	Contoh
Closures	Menggunakan fungsi bersarang untuk menciptakan fungsi currying	function curry(f) { return function(a) { return function(b) { return f(a, b); }; }; }
bind()	Menggunakan metode bind() untuk mengunci argumen	let multiplyByTwo = multiply.bind(this, 2);

Kesimpulan

Selamat! Anda baru saja mengambil langkah pertama ke dunia currying di JavaScript. Ingat, seperti belajar konsep pemrograman baru, praktik adalah kunci. Cobalah menciptakan fungsi currying Anda sendiri dan eksperimen dengan berbagai kasus penggunaan.

Currying mungkin terlihat abstrak pada awalnya, tapi seiring waktu Anda akan mulai melihat bagaimana itu dapat membuat kode Anda lebih fleksibel dan dapat digunakan kembali. Seperti belajar menggunakan alat baru di dalam kotak alat Anda — awalnya mungkin terasa aneh, tapi segera Anda akan bertanya-tanya bagaimana Anda pernah menulis kode tanpanya!

Tetap coding, tetap belajar, dan yang paling penting, bersenang-senang! JavaScript adalah taman kebebasan, dan currying adalah salah satu dari banyak fitur menarik yang menunggu Anda untuk mengenalnya.

Credits: Image by storyset