Bagaimana cara pelewatan parameter di javascript?

Fungsi dan Parameter

Dalam artikel sebelumnya kita sudah membahas apa itu fungsi, kegunaannya dan bagaimana cara membuatnya. Sekarang kita akan membahas parameter, secara umum sebenarnya parameter dapat diartikan luas yaitu sebuah acuan nilai yang digunakan untuk menarik sebuah kesimpulan. Sedangkan dalam artikel ini parameter adalah sebuah nilai yang akan diolah oleh sebuah fungsi dan bersifat dinamis (bergantung dengan apa yang akan kita olah dalam sebuah fungsi). Untuk dapat menggunakan parameter dalam sebuah fungsi kita butuh mengoper sebuah parameter atau sebuah nilai kedalam fungsi tersebut (parsing) dan juga jumlah parameternya pun dapat lebih dari satu. Parameter yang dapat diparsing dalam sebuah fungsi dapat berupa interger atau number, string, object ataupun array, sekali lagi bergantung pada apa yang akan diolah pada fungsi tersebut.

Table of Contents

• Fungsi dan Parameter
• 2 Jenis Fungsi di Javascript
• Mendeklarasikan Fungsi dan Prosedur di Javascript
• Deklarasi Fungsi
• Deklarasi Prosedur
• Cara Memanggil Fungsi
• Memanggil Secara Langsung
• Memanggil Fungsi Dari Hyperlink
• Menggunakan Event (Rekasi Terhadap Suatu kejadian)
• Contoh Event Onclick
• Contoh Event Onchange
• Fungsi Dengan Parameter
• Apa itu parameter dalam JavaScript?
• Bagaimanakah cara membuat sebuah fungsi di dalam javascripts?
• Bagaimana mendeklarasikan variabel pada JavaScript?
• Bagaimana Cara Menggunakan memanggil sebuah fungsi dengan nama myFunction di JavaScript?

function namaFungsi(parameter){

// action

}

Secara konsep dasar hal diatas adalah cara kita mendefinisikan fungsi dengan parameter. Berikut adalah contohnya:

function add(a){
    return a
}

var nilaiAdd = add(9)
console.log(nilaiAdd);

Dalam blog diatas kita sudah mendeklarasikan sebuah fungsi yaitu add dengan parameter a didalamnya yang akan kita gunakan sebagai nilai return (kembali) dari fungsi tersebut, setelah itu kita mendefinisikan variabel nilaiAdd dengen fungsi add dengan memparsing nilai 9 dalam fungsi add, secara otomatis nilai 9 nantinya akan menjadi variabel a di dalam fungsi add yang dijadikan sebagai return. Apa buktinya? ketika kita console.log nilai add akan bernilai 9. Contoh diatas adalah kita parsing satu nilai kedalam atau parameter bagaimana kalau lebih dari satu parameter?

function add(a, b){
    var result = a + b
    return result
}

var nilaiAdd = add(9, 8)
console.log(nilaiAdd);

Cara parsing 2 atau lebih parameter dalam sebuah fungsi menggunakan tanda koma "," seabagai pemisah antara parameter pertama dan kedua. Contohnya adalah blok pemrograman diatas antara parameter a dan b.

Default Parameter

Dalam menggunakan parameter kita juga dapat menggunakan default parameter. Defautl parameter adalah sebuah nilai default yang akan digunakan ketika kita tidak memparsing sebuah nilai kedalam sebuah fungsi. Jika kita melihat contoh diatas dan kita tidak memparsing parameter yang dibutuhkan pada fungsi tersebut hal ini akan meyebabkan error. Sebagai contoh:

function add(a, b = 2){
    var result = a + b
    return result
}

var nilaiAdd = add(9)
console.log(nilaiAdd);

Dalam contoh diatas kita sudah menggunakan default parameter yang dicontohkan pada paramter b, dengan cara mendefinisikan parameter b dengan nilai 2. Lalau kita hanya memparsing satu nilai yaitu nilai 9 yang akan menjadi parameter a.

var nilaiAdd = add(9, 9)
console.log(nilaiAdd);

Dengan ini akan mendapatkan hasil yang berbeda ketika kita memparsing kedua nilai. Dalam hal ini kita akan menggambil kesimpulan bahwa dalam fungsi add nilai parameter b akan bernilai 2 jika tidak ada nilai parameter b yang dioper.

Fungsi atau yang bisa kita sebut prosedur adalah suatu blog program yang mempunyai tugas tertentu berdasarkan tujuan dari fungsi/prosedur itu sendiri. Dalam bahas pemrograman lain seperti pascal fungsi dan prosedur dibedakan dalam cara pendeklarasian, contohnya di dalam pascal ada pernyataan procedure dan function untuk pendeklarasiannya, Namun di javascript tidak ada perbedaan secara khusus dalam cara pendeklarasian untuk fungsi maupun prosedur. Cara untuk mengetahui apakah suatu blok program merupakan fungsi adalah jika memiliki nilai balik (return value) sedangkan prosedur tidak memiliki.

Artikel terkait : Perbedaan fungsi dan prosedur di C++

Penggunaan fungsi dan prosedur akan sering digunakan saat teman-teman menerapkan konsep object oriented programming (OOP). Konsep ini akan kita bahas di artikel lain.

• 2 Jenis Fungsi di Javascript
• Mendeklarasikan Fungsi dan Prosedur di Javascript
• Cara Memanggil Fungsi
• Memanggil Secara Langsung
• Memanggil Fungsi Dari Hyperlink
• Menggunakan Event (Rekasi Terhadap Suatu kejadian)
• Fungsi Dengan Parameter
• Kesimpulan

2 Jenis Fungsi di Javascript

Fungsi atau prosedur di dalam javascript dibedakan menjadi dua yaitu:

1. Fungsi yang telah dibuat oleh javascript (built-in function)
2. Fungsi yang dibuat oleh pengembang (user defined function)

Pada artikel kali ini saya akan membahas fungsi yang di definsikan oleh pengembang (user).

Mendeklarasikan Fungsi dan Prosedur di Javascript

Sebenarnya ada beberapa bentuk/cara mendeklarasikan fungsi di javascript misalnya dengan mendeklarasikan secara langsung (tanpa kata kunci function di depan nama fungsi) atau dengan ekspresi assignment. Tetapi bentuk umum dan yang saya rekomendasikan adalah dengan menggunakan kata kunci function sebelum nama fungsi. Seperti yang terlihat pada contoh dibawah ini:

Deklarasi Fungsi

function nama_fungsi(){
  return blok_program
}

Deklarasi Prosedur

function nama_fungsi(){
  blok_program
}

Dari bentuk di atas dapat dilihat dengan jelas perbedaan antara fungsi dan prosedur di mana fungsi memiliki nilai balik (return value) sedangkan prosedur tidak memiliki.

Artikel lainnya : Belajar array (larik) di javascript

Cara Memanggil Fungsi

Setelah kita mendeklarasikan suatu fungsi dan kemudian ingin kita gunakan maka kita perlu memanggilnya. Ada 3 cara memanggil fungsi di javascript yaitu:

1. Memanggil secara langsung dari dokumen HTML
2. Memanggil dengan hyperlink
3. Menggunakan Event

Memanggil Secara Langsung

Kita dapat langsung memanggil suatu fungsi yang telah dibuat dalam dokumen HTML

<!DOCTYPE html>
<html>
    <head>
        <script>
            //Membuat fungsi Hello()
            function Hello(){
                 return alert('Hello Guys')
            }
        
        </script>
    </head>

    <body>
        <script>
            //Memanggil fungsi Hello()
            Hello()
        </script>
    </body>
</html>

Perhatikan pada contoh diatas fungsi Hello() saya buat di dalam tag <head> lalu kemudian saya panggil fungsi tersebut dari tag <body>.

Harap diperhatikan karena program yag dibuat secara sekuensial (program di eksekusi dari atas ke bawah) maka pendeklarasian fungsi harus terlebih dahulu di deklarasikan sebelum kita memanggilnya.

Memanggil Fungsi Dari Hyperlink

Fungsi juga dapat dipanggil dari hyperlink melalui atribut href. Perhatikan contoh dibawah ini:

<!DOCTYPE html>
<html>
    <head>
        <script>
            function Hello(){
                return alert('Hello Guys')
            }
        
        </script>
    </head>
    <body>
        <a href='Javascript:Hello()'>Klik Disini</a><br>
    </body>
</html>

Kita dapat memanggil fungsi javascript dari link lewat atribut href dengan nilai ‘Javascript:nama_fungsi()’ penggunaan ini bisa kalian terapkan saat ingin membuat sebuah aksi saat pengguna mengklik link.

Menggunakan Event (Rekasi Terhadap Suatu kejadian)

Javascript mampu memberikan reaksi pada suatu elemen HTML yaitu dengan menggunakan event.

Baca jenis-jenis event di javascript.

Ada banyak jenis event namun saya akan beri 2 contoh event berikut:

Contoh Event Onclick

<!DOCTYPE html>
<html>
    <head>
        <script>
            //Membuat fungsi Hello()
            function Hello(){
                return alert('Hello Guys')
            }
        
        </script>
    </head>

    <body>
        <a href='#' onclick="Hello()">Klik Disini</a>
    </body>
</html>

Dapat dilihat pada contoh diatas fungsi Hello() dipanggil melalui event onclick, ketika pengguna mengklik link tersebut maka akan memicu event ini terjadi.

Contoh Event Onchange

<!DOCTYPE html>
<html>
    <head>
        <script>
            //Membuat fungsi Hello()
            function tampilNama(){
                var nama = document.getElementById("nama").value
                document.getElementById("tampil").innerHTML="Nama : "+nama
            }
        
        </script>
    </head>
    <body>
        <select id="nama" OnChange="tampilNama()">
            <option value="Nia">Nia</option>
            <option value="Okta">Okta</option>
            <option value="Saras">Saras</option>
        </select>
        <br>
        <div id='tampil'></div>
    </body>
</html>

Pada contoh kedua fungsi akan di panggil dari event onchange, ketika terdapat perubahan nilai dalam combobox maka memicu event ini bekerja.

Pembahasan mengenai event ini akan saya bahas lebih detail pada artikel lain.

Fungsi Dengan Parameter

Fungsi di dalam pemrograman juga dapat disematkan daftar variabel yang berisi nilai untuk diproses pada fungsi tersebut. Di javascript pelewatan parameter bisa dilakukan dengan nilai (value)

Contoh :

//Membuat fungsi jumlah dengan parameter a dan b
function jumlah(a,b)
    {
        return document.write('Hasil = '+(a+b))
    }
 //Memanggil fungsi jumlah       
jumlah(3,6)

Hasil :

Hasil = 9 

Fungsi jumlah() memiliki 2 parameter yaitu a dan b dengan menampilkan hasil penjumlahan dari kedua variabel tersebut.

Ketika fungsi tersebut dipanggil maka, harus kita sematkan nilai (value) untuk masing-masing parameter dalam fungsitersebut.

Nilai yang saya sematkan pada fungsi jumlah() adalah 3 dan 6 masing-masing nilai tersebut akan di masukan pada variabel yang terdapat dalam parameter fungsi jumlah().

Kesimpulan

Fungsi yang didefinisikan oleh user sangatlah penting untuk kita pelajari saat belajar dasar javascript, karena ke depan kita akan banyak bekerja dalam manipulasi elemen HTML menggunakan fungsi atau membuat objek dan masih banyak lagi.

Kalian bisa explore dengan belajar dari referensi yang lain untuk menambah pengetahuan kalian. Silahkan beri komentar kalian di bawah artikel ini jika ada yang ingin ditanyakan, Terima kasih.

Apa itu parameter dalam JavaScript?

Parameter, dalam pemanggilan fungsi, adalah argumen fungsi. Argumen JavaScript diteruskan oleh nilai: Fungsi hanya mengetahui nilai, bukan lokasi argumen. Jika suatu fungsi mengubah nilai argumen, maka tidak mengubah nilai asli parameter.

Bagaimanakah cara membuat sebuah fungsi di dalam javascripts?

untuk membuat function, penulisannya harus di awali oleh syntax “function” dan kemudian di lanjutkan dengan nama function yang mau di buat. dan isi dari function di tuliskan di dalam tanda kurung kurawal pembuka “{” dan tanda kurung kurawal penutup “}”.

Bagaimana mendeklarasikan variabel pada JavaScript?

Cara membuat variabel yang umum digunakan di javascript adalah menggunakan kata kunci var lalu diikuti dengan nama variabel dan nilainya. Contoh: var title = "Belajar Pemrograman Javascript"; Pada contoh di atas, kita membuat variabel bernama title dengan nilai berupa teks (string): "Belajar Pemrograman Javascript" .

Bagaimana Cara Menggunakan memanggil sebuah fungsi dengan nama myFunction di JavaScript?

Memanggil Fungsi JavaScript.

function myFunction(a, b) { return a * b; } myFunction(10, 2); // Will return 20..

function myFunction(a, b) { return a * b; } window. ... .

var x = myFunction(); // x will be the window object function myFunction() { return this; }.