Penggunaan function call, apply & bind adalah penting dalam JavaScript. Pada noob macam aku, untuk memahami bagaimana mana ia berfungsi sangatlah memeningkan. Aku ambil masa dalam beberapa minggu untuk memahami fungsi asas ni. Noob sangat kan? Ketiga-tiga function ini agak sama tapi digunakan pada situasi yang berbeza. Asasnya:

  • .call() & .apply() digunakan ketika kita mahu invoke(gunakan) secara serta merta
  • .bind() pula digunakan jika kita mahu panggil kemudian (tidak serta merta).

call()

Untuk terangkan dengan lebih jelas, sila rujuk kod dibawah ini.

Berdasarkan kod di atas, objek obj  tidak memiliki method/function. Tapi dibawahnya ada aku ada declare function penambahan  yang menerima satu argument (arg). Function penambahan ini akan return this.num + arg  . Jika kita jalankan function penambahan(3), function itu TIDAK akan return 5 sebaliknya ia akan return NaN. Ini kerana this.num  adalah undefined kerana ia merujuk kepada variable num  yang tidak pernah kita declare sebelumnya dan tidak merujuk kepada num  di dalam obj  diatas. Jadi bagaimana kita hendak rujuk num  yang ada pada obj ? Di sini hero .call() datang membantu!

Dengan menggunakan function .call(), kini this.num  merujuk num  pada obj .  Function call menerima 2 parameter; .call( Argument 1, Argument 2)  :

  • Argument 1 – objek yang kita mahu rujuk (dalam kes ini adalah obj )
  • Argument 2 – parameter arg  pada function yang dipanggil

Kod penuh adalah seperti berikut

Contoh la argument function lebih dari satu.

Penggunaan function ini juga sangat membantu kita memperoleh konsep Don’t Repeat Yourself (DRY) di dalam kod kita. Misalnya kita mahu gunakan method/function yang sama tapi dengan argument atau objek lain. kita hanya perlu panggil objek baharu tersebut.

apply()

Function apply() adalah hampir sama seperti call(). Bezanya hanyalah apply menerima Argument 2 sebagai array. Kita ambil contoh di atas:

bind()

Function ini digunakan untuk ‘menyimpan’ terlebih dahulu akan dipanggil semula kemudian. Sudah tentulah penggunaannya juga berbeza. Jika kita cuba gunakan bind() seperti ko diatas:

Ya, jika bind() digunakan seperti di atas, function ini akan return kembali sebuah function. Disebabkan bind() digunakan untuk ‘menyimpan’ terlebih dahulu untuk di panggil kemudian, jadi ia boleh disimpan didalam variable atau declared function.

Kod di atas menunjukkan kita bind function penambahan()  dengan objek obj  yang kita mahukan terlebih dahulu dan simpan di dalam declared function bound() .  Lihat function . bind()  hanya perlukan 1 argument .bind( argument )  iaitu objek yang kita mahu bind.

Inilah asas function yang sering digunakan di dalam JavaScript functional programming. Sebenarnya ini hanyalah asas. Terdapat penggunaan lebih advance function ini yang mungkin akan aku kongsikan pada post yang lain.