Cara menggunakan function javascript parameter

Question

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.

Table of Contents Show

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 function JavaScript?
Apa parameter fungsi?
Bagaimana cara membuat fungsi di JavaScript?
Bagaimana cara memanggil function dengan nama myFunction?

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.

Daftar Isi

2 Jenis Fungsi di Javascript

Fungsi atau prosedur di dalam javascript dibedakan menjadi dua yaitu:

Fungsi yang telah dibuat oleh javascript (built-in function)
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:

Memanggil secara langsung dari dokumen HTML
Memanggil dengan hyperlink
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:

OnClickKejadian yang terjadi ketika suatu elemen di klikOnChangeKejadian yang terjadi ketika nilai suatu elemen berubah

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 fungsi tersebut.

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 function JavaScript?

Parameter adalah data-data yang sifatnya tidak tetap (bisa berubah-ubah) yang dimasukkan dan diolah dalam sebuah fungsi Javascript.

Apa parameter fungsi?

Parameter adalah suatu variabel yang berfungsi untuk menampung nilai yang akan dikirimkan ke dalam fungsi. Dengan adanya parameter, sebuah fungsi dapat bersift dinamis.

Bagaimana cara membuat fungsi di JavaScript?

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 “}”.