JavaScript - Parameter Function

Selamat datang, para pemrogram yang sedang berkembang! Hari ini, kita akan melihat dunia menarik JavaScript function parameters. Sebagai guru komputer yang ramah di lingkungan sekitar Anda, saya disini untuk mengarahkan Anda melalui topik esensial ini. Jadi, ambil minuman favorit Anda, rasa nyaman, dan mari kita mulai petualangan coding ini bersama!

Function Parameters dan Arguments

mari kita mulai dengan dasar. Di JavaScript, fungsi seperti mesin kecil yang melakukan tugas tertentu. Kadang-kadang, mesin ini memerlukan input untuk melakukan pekerjaannya dengan baik. Itu di mana parameter masuk!

Apa itu Parameters?

Parameter adalah variabel yang tercantum dalam deklarasi fungsi. Mereka bertindak sebagai placeholder untuk nilai yang akan diberikan ke fungsi saat itu dipanggil.

Mari kita lihat contoh sederhana:

function greet(name) {
console.log("Hello, " + name + "!");
}

greet("Alice");

Dalam contoh ini, name adalah parameter. Ketika kita memanggil fungsi dengan greet("Alice"), "Alice" adalah argumen. Fungsi kemudian menggunakan argumen ini untuk personalisasi salam.

Parameter Ganda

Fungsi dapat memiliki beberapa parameter. Mari kita perluas fungsi salam kita:

function greet(name, time) {
console.log("Good " + time + ", " + name + "!");
}

greet("Bob", "morning");

Di sini, kita memiliki dua parameter: name dan time. Ketika memanggil fungsi, kita menyediakan dua argumen dalam urutan yang sama seperti parameter didefinisikan.

Default Parameters

Kadang-kadang, Anda mungkin ingin mengatur nilai default untuk parameter. Ini berguna saat Anda ingin fungsi bekerja bahkan jika argumen tidak diberikan:

function greet(name = "friend") {
console.log("Hello, " + name + "!");
}

greet(); // Output: Hello, friend!
greet("Charlie"); // Output: Hello, Charlie!

Dalam kasus ini, jika tidak ada argumen yang diberikan untuk name, ia default ke "friend".

Object Argument

Sekarang, mari bicarakan sesuatu yang lebih lanjut: object arguments. Ini adalah variabel lokal yang tersedia di semua fungsi. Itu berisi objek seperti array dari argumen yang diberikan ke fungsi.

function sumAll() {
let total = 0;
for (let i = 0; i < arguments.length; i++) {
total += arguments[i];
}
return total;
}

console.log(sumAll(1, 2, 3, 4)); // Output: 10

Fungsi ini dapat menerima sejumlah argumen dan menjumlahkannya semua. Sangat menarik, kan?

Passing Arguments by Value

Di JavaScript, saat Anda mempasskan tipe data primitif (seperti angka, string, atau boolean) ke fungsi, mereka dipasskan oleh nilai. Ini berarti bahwa fungsi menerima salinan nilai, bukan variabel asli.

function changeValue(x) {
x = 5;
console.log("Inside function: " + x);
}

let num = 10;
console.log("Before function call: " + num);
changeValue(num);
console.log("After function call: " + num);

Output:

Before function call: 10
Inside function: 5
After function call: 10

Seperti yang Anda lihat, mengubah x di dalam fungsi tidak mempengaruhi variabel asli num.

Passing Arguments by Reference

Objek, dari lainnya, dipasskan oleh referensi. Ini berarti bahwa jika Anda mengubah objek di dalam fungsi, objek asli juga akan diubah.

function changeName(person) {
person.name = "Jane";
console.log("Inside function: " + person.name);
}

let myPerson = {name: "John"};
console.log("Before function call: " + myPerson.name);
changeName(myPerson);
console.log("After function call: " + myPerson.name);

Output:

Before function call: John
Inside function: Jane
After function call: Jane

Di sini, mengubah properti name di dalam fungsi mempengaruhi objek asli myPerson.

Catatan Peringatan

Perilaku ini bisa sia-sia dan berbahaya. Itu memungkinkan Anda untuk mengubah struktur data kompleks secara efisien, tetapi itu juga bisa menyebabkan efek samping yang tidak diinginkan jika Anda tidak hati-hati. Selalu berhati-hati tentang apakah Anda bekerja dengan primitif atau objek!

Menggabungkan Semua

Ayoakhiri dengan contoh menarik yang menggabungkan beberapa konsep yang kita pelajari:

function createSuperHero(name, power = "flying", weaknesses) {
let hero = {
name: name,
power: power,
weaknesses: []
};

for (let i = 2; i < arguments.length; i++) {
hero.weaknesses.push(arguments[i]);
}

return hero;
}

let myHero = createSuperHero("Captain Awesome", "super strength", "kryptonite", "public speaking");
console.log(myHero);

Fungsi ini membuat objek superhero. Itu menggunakan parameter default, objek arguments, dan bekerja dengan baik primitif dan objek. Cobalah menjalankan itu dan lihat apa yang Anda dapatkan!

Kesimpulan

Selamat! Anda baru saja meningkatkan keterampilan JavaScript Anda dengan menguasai parameter fungsi. Ingat, latihan membuat sempurna, jadi jangan takut untuk mencoba konsep ini dalam kode Anda sendiri.

Berikut adalah tabel rujukan cepat dari metode yang kita pelajari:

Metode	Deskripsi
Parameter Dasar	function name(param1, param2) {...}
Parameter Default	function name(param = defaultValue) {...}
Object Argument	arguments[i] untuk mengakses argumen
Pass by Value	Berlaku untuk primitif (angka, string, boolean)
Pass by Reference	Berlaku untuk objek dan array

Selamat coding, dan semoga fungsi Anda selalu berjalan tanpa bug!

Credits: Image by storyset