JavascriptMateri CourseNusantech Academy

Modul 4-2. Argument & Parameter

Pendahuluan

Halo teman-teman semua selamat datang kembali di Javascript Course dari nusantech academy. Sebelum teman-teman melanjutkan membaca materi ini, diharapkan teman-teman sudah mengerti tentang materi sebelumnya, yaitu tentang pengenalan fungsi dalam javascript. Pada pembahasan kali ini kita akan membahas tentang argument dan parameter yang biasa kita gunakan dalam sebuah fungsi.

Argument & Parameter

Istilah argument dan parameter sering digunakan secara bergantian dan seolah kedua istilah tersebut memiliki arti yang sama. Akan tetapi terdapat perbedaan antara argument dan parameter. Argument adalah nilai yang diteruskan ke dalam sebuah fungsi ketika fungsi itu dipanggil, sedangkan parameter adalah variabel yang terdaftar menjadi bagian dari definisi fungsi. Dengan mengetahui perbedaan antara argument dan parameter, kita dapat mencegah terjadinya kesalahan dalam kode program yang kita buat karena javascript tidak akan menampilkan error ketika jumlah argument yang diteruskan ke dalam fungsi berbeda dengan jumlah parameter yang tercantum saat fungsi didefinisikan. Contohnya :

function testArgument(parameter1, parameter2, parameter3){
 console.log(parameter1 + parameter2 + parameter3);
}
 
// testArgument dengan argument tambahan
testArgument(1,2,3,4);
 
// testArgument dengan argument tidak lengkap
testArgument(1,2);

Hasil console contoh testArgument

Pada contoh di atas, terdapat sebuah fungsi testArgument dengan tiga parameter yang menampilkan hasil penjumlahan dari ketiga parameter tersebut di dalam console. Pada contoh tersebut kita mencoba untuk memanggil fungsi testArgument dengan argument tambahan dan dengan argument yang tidak lengkap. Bisa dilihat hasilnya di dalam console bahwa dalam kedua kasus tersebut javascript tidak menampilkan error. Meskipun hasilnya mungkin tidak sesuai seperti yang diharapkan. Pada kasus argument tambahan, argument 4 akan dihiraukan oleh fungsi karena hanya memproses penjumlahan antara argument 1, 2  dan 3, sedangkan pada kasus argument tidak lengkap, parameter3 akan bernilai undefined sehingga hasil penjumlahannya akan menghasilkan NaN (Not a Number).

Default parameter

Dalam javascript, sebuah parameter memiliki nilai default undefined. Jadi ketika kita tidak meneruskan argument ke dalam sebuah fungsi, maka parameter yang dimiliki oleh fungsi tersebut akan bernilai undefined. Jika kita ingin mengubah nilai default dari sebuah parameter, kita bisa menggunakan operator penugasan (=) lalu diikuti dengan nilai default dari parameter tersebut. Contohnya:

function talk(message='How are you ?'){
 console.log(message);
}
 
talk(); // hasilnya: 'How are you?'
talk('Hello there, General Kenobi'); // hasilnya: 'Hello there, General Kenobi'

Hasil console contoh default parameter

Pada contoh di atas, ketika kita memanggil fungsi talk() tanpa argumen maka akan menghasilkan output ‘How are you ?’ di dalam console sesuai dengan nilai default dari parameter message yang sudah dideklarasikan dalam fungsi talk. Ketika kita memanggil fungsi talk dengan suatu nilai argument, maka akan menghasilkan output sesuai dengan nilai argument tersebut, seperti contoh di atas.

Rest Parameter

Pada update ES6 terdapat jenis parameter baru yang bernama rest parameter yang memiliki tanda tiga titik (…) sebagai prefix. Rest parameter memungkinkan kita untuk mewakili jumlah argument yang tidak terhingga sebagai array. Contohnya:

function restParam(parameter1, ...args){
 console.log('parameter1: ',parameter1);
 console.log('args: ', args)
}
 
restParam(1,2,3,4,5,6);

Hasil console contoh rest parameter

Pada contoh di atas terdapat sebuah fungsi restParam dengan parameter parameter1 dan args. Akan tetapi pada parameter args kita menggunakan prefix (…) sehingga membuat parameter args menjadi rest parameter. Ketika kita memberikan argument pada fungsi restParam seperti pada contoh di atas, maka nilai 1 adalah nilai untuk parameter1 dan sisanya adalah nilai untuk parameter args. Rest parameter digunakan untuk mengantisipasi jumlah argument yang tidak pasti. Berbeda dengan object argument, rest parameter berbentuk array sehingga kita bisa melakukan metode seperti forEach, sort dan metode-metode array atau object lainnya. Contohnya:

function sum(...restArgs){
 let total = 0;
 restArgs.forEach((num) =>{
   total  += num
 })
 return total;
}
 
sum(1,2,3); // hasilnya: 6

Pada contoh di atas terdapat fungsi sum yang mengembalikan hasil penjumlahan terhadap semua argument yang diteruskan ke fungsi sum tersebut.

Penutup

Jadi untuk mereview materi yang telah kita bahas, argument dan parameter sering dianggap sebagai satu entitas yang sama, padahal berbeda. Argument adalah nilai yang diteruskan ke dalam fungsi saat fungsi dipanggil, sedangkan parameter adalah variabel yang terdaftar menjadi bagian dari definisi fungsi. Nilai default dari sebuah parameter dapat diatur dengan menggunakan operator penugasan (=). Pada update ES6 terdapat fitur baru, yaitu rest parameter yang memungkinkan kita untuk mewakili jumlah argument yang tidak terhingga sebagai array dalam sebuah fungsi.

Baik teman-teman, saya rasa cukup untuk materi tentang argument & parameter ini. Tetap semangat mengikuti Javascript Course dari Nusantech Academy.

Thank you and see you next time!

Quiz Time:

1. Output dari fungsi di bawah adalah:

function argumentTest(parameter1, parameter2, parameter3){
 console.log(arguments.length);
 console.log(arguments[3]);
}
 
argumentTest(1,2,3,4,5);
  • 5 dan 3
  • 3 dan 3
  • 5 dan 4
  • Error

2. Output dari fungsi di bawah adalah:

function restParam(parameter1, ...restArgs){
 console.log(restArgs.length);
 console.log(restArgs[2]);
}
 
restParam('a','b','c','d','e');
  • 5 dan c
  • 5 dan b
  • 4 dan d
  • 4 dan c

3. Terdapat sebuah fungsi sederhana:

function say(message='Hello there') {
 console.log(message);
}

Jika kita memanggil fungsi say dengan argument undefined, maka outputnya adalah:

  • Undefined
  • Hello there
  • Null
  • Error