Cara menggunakan cara memanggil javascript

Question

Fungsi atau biasa kita sebut prosedur adalah program blog yang memiliki tugas-tugas tertentu berdasarkan tujuan dari fungsi/prosedur itu sendiri. Dalam topik pemrograman lain seperti Pascal, fungsi dan prosedur dibedakan dalam cara mereka didefinisikan, misalnya dalam Pascal ada prosedur dan pernyataan fungsi untuk definisi mereka, tetapi dalam javascript tidak ada perbedaan khusus dalam cara mereka didefinisikan untuk fungsi dan prosedur. Cara untuk mengetahui apakah sebuah blok program adalah sebuah fungsi adalah jika ia memiliki nilai kembalian sedangkan prosedurnya tidak

Table of Contents Show

2 Jenis Fungsi dalam Javascript
Mendeklarasikan Fungsi dan Prosedur dalam Javascript
Deklarasi Fungsi
Deklarasi Prosedural
Cara Memanggil Fungsi
Hubungi Langsung
Memanggil Fungsi Dari Hyperlink
Menggunakan Acara (Reaksi terhadap suatu acara)
Contoh Acara Onclick
Contoh Pergantian Acara
Fungsi Dengan Parameter
Bisakah JavaScript berjalan di seluler?
Di mana kode JavaScript ditempatkan?
Bagaimana cara menulis kode program JavaScript pada dokumen HTML?

Artikel terkait. Perbedaan antara fungsi dan prosedur di C++

Penggunaan fungsi dan prosedur akan sering digunakan ketika teman-teman menerapkan konsep object oriented programming (OOP). Kami akan membahas konsep ini di artikel lain

Daftar isi

2 Jenis Fungsi dalam Javascript

Fungsi atau prosedur dalam javascript terbagi menjadi dua yaitu

Fungsi yang telah dibuat oleh javascript (fungsi bawaan)
Fungsi yang dibuat oleh pengembang (fungsi yang ditentukan pengguna)

Pada artikel ini saya akan membahas fungsi yang didefinisikan oleh developer (pengguna)

Mendeklarasikan Fungsi dan Prosedur dalam Javascript

Sebenarnya ada beberapa bentuk/cara mendeklarasikan fungsi pada javascript, misalnya dengan mendeklarasikan secara langsung (tanpa kata kunci function di depan nama fungsi) atau dengan ekspresi penugasan. Namun bentuk umum dan yang saya sarankan adalah menggunakan kata kunci fungsi sebelum nama fungsi. Seperti yang terlihat pada contoh di bawah ini

Deklarasi Fungsi

function nama_fungsi(){
  return blok_program
}

Deklarasi Prosedural

function nama_fungsi(){
  blok_program
}

_

Dari bentuk diatas dapat dilihat dengan jelas perbedaan antara fungsi dan prosedur dimana fungsi memiliki nilai kembalian (return value) sedangkan prosedur tidak memiliki

artikel lainnya. Pelajari array dalam javascript

Cara Memanggil Fungsi

Setelah kita mendeklarasikan sebuah fungsi dan kemudian kita ingin menggunakannya, kita perlu memanggilnya. Ada 3 cara untuk memanggil suatu fungsi dalam javascript, yaitu

Menelepon langsung dari dokumen HTML
Memanggil dengan hyperlink
Menggunakan Acara

Hubungi Langsung

Kita bisa langsung memanggil 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 lalu kemudian saya panggil fungsi tersebut dari tag .

Perlu diketahui bahwa karena program dibuat secara berurutan (program dijalankan dari atas ke bawah) definisi fungsi harus dideklarasikan terlebih dahulu sebelum kita memanggilnya

Memanggil Fungsi Dari Hyperlink

Fungsi juga dapat dipanggil dari hyperlink melalui atribut href. Lihatlah contoh di bawah 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 melalui atribut href dengan nilai 'Javascript'. function_name()' dapat digunakan saat Anda ingin membuat tindakan saat pengguna mengklik tautan

Menggunakan Acara (Reaksi terhadap suatu acara)

Javascript mampu bereaksi terhadap elemen HTML dengan menggunakan event

Baca jenis acara di javascript

Ada banyak jenis event, tapi saya akan memberikan 2 contoh event berikut ini

OnClick Suatu peristiwa yang terjadi ketika suatu elemen diklik OnChange Suatu peristiwa yang terjadi ketika nilai suatu elemen berubah

Contoh Acara 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 di atas bahwa fungsi Hello() dipanggil melalui event onclick, ketika pengguna mengklik link maka akan memicu terjadinya event ini.

Contoh Pergantian Acara

<!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 dipanggil dari event onchange, ketika ada perubahan nilai pada combobox, maka event ini akan terpicu untuk bekerja.

Acara ini akan saya bahas lebih detail di artikel lain

Fungsi Dengan Parameter

Fungsi dalam pemrograman juga dapat disematkan ke daftar variabel yang berisi nilai untuk diproses dalam fungsi tersebut. Dalam parameter lewat javascript dapat dilakukan dengan nilai

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 sum() memiliki 2 parameter yaitu a dan b dengan menampilkan hasil penjumlahan dari kedua variabel tersebut

Saat fungsi dipanggil, kita harus menyematkan nilai untuk setiap parameter dalam fungsi

Nilai yang saya masukkan ke dalam fungsi sum() masing-masing adalah 3 dan 6, dan nilai tersebut akan dimasukkan ke dalam variabel yang terdapat di parameter fungsi sum()

Kesimpulan

Fungsi yang didefinisikan oleh pengguna sangat penting untuk kita pelajari ketika mempelajari dasar-dasar javascript, karena di masa depan kita akan banyak bekerja dalam manipulasi elemen HTML menggunakan fungsi atau membuat objek dan banyak lagi.

Anda bisa bereksplorasi dengan belajar dari referensi lain untuk menambah pengetahuan Anda. Silahkan berkomentar di bawah artikel ini jika ada pertanyaan, terima kasih

Bisakah JavaScript berjalan di seluler?

Sekarang, bahasa pemrograman ini dapat digunakan di mobile API untuk membuat aplikasi mobile .

Di mana kode JavaScript ditempatkan?

Kode Javascript disimpan dalam file dengan ekstensi '. js' . Kemudian file eksternal ini dapat dipanggil dari dokumen HTML dengan menggunakan atribut 'src' dari tag