Cara menggunakan THOIS pada JavaScript

Output adalah sebuah tampilan program yang biasanya digunakan untuk memperlihatkan hasil akhir.

Output biasanya ditampilkan dalam bentuk teks dengan fungsi print[].

Ada 4 cara menampilkan output pada Javascript:

1. Menggunakan Fungsi console.log[];
2. Menggunakan Fungsi alert[];
3. Menggunakan Fungsi document.write[];
4. Menggunakan innerHTML.

Apa perbedaan dari keempat cara tersebut?

1. Menggunakan Fungsi console.log[]

Fungsi console.log[] adalah fungsi untuk menampilkan teks ke console Javascript.

Contoh penggunaan:

console.log["Hello World!"];

Hasilnya:

Fungsi console.log[] biasanya digunakan untuk debugging. Karena setiap pesaan error di Javascript selalu ditampilkan di dalam Console.

Selain console.log[], terdapat juga beberapa fungsi untuk debugging seperti console.debug[], console.info[], console.error[], console.dir[], dsb.

Fungsi-fungsi console ini juga berlaku pada console Nodejs.

2. Menggunakan Fungsi alert[]

Fungsi alert[] adalah fungsi untuk menampilkan jendela dialog. Fungsi sebenarnya berada pada objek window.

Secara lengkap bisa ditulis seperti ini:

window.alert["Hello World!"];

Bisa juga ditulis alert[] saja seperti ini:

Fungsi alert[], hanya bisa digunakan di dalam browser saja. Sedangkan pada Nodejs fungsi ini tidak ada.

Contoh penggunaan fungsi alert[]:

    Belajar Javascript
    
        alert["Selamat datang di tutorial belajar Javascript"];

        function sayHello[]{
            alert["Hello!"];
        }
    


    Klik Aku!

Hasilnya:

3. Menggunakan Fungsi document.write[]

Objek document adalah objek yang mewakili dokumen HTML di dalam Javascript.

Dalam objek document, terdapat fungsi write[] untuk menulis sesuatu ke dokumen HTML.

Contoh:

    Belajar Javascript
    
        document.write["
Hello World!
"];
        document.write[""];
        document.write["
Saya sedang belajar Javascript
"];
        document.write["di petanikode.com"]
    

Hasilnya:

Selain fungsi write[], objek document juga menyediakan berbagai macam fungsi untuk manipulasi dokumen HTML.

4. Menggunakan innerHTML

innerHTML adalah sebuah atribut di dalam [objek] elemen HTML yang berisi string HTML.

Dengan innerHTML, kita dapat menampilkan output ke elemen yang lebih spesifik.

Contoh:

    Belajar Javascript



    
Tutorial Javascript untuk Pemula
    



    
        // membuat objek elemen
        var hasil = document.getElementById["hasil-output"];

        // menampilkan output ke elemen hasil
        hasil.innerHTML = "
Aku suka Javascript
";
    

Hasilnya:

Akhir Kata…

Bagaimana?

Sudah paham ‘kan perbedaan dari keempat fungsi tersebut. Kalau kita ringkas akan seperti ini:

1. Fungsi console.log[] untuk menampilkan output ke console Javascript;
2. Fungsi alert[] untuk menampilkan output ke jendela dialog;
3. Fungsi document.write[] untuk menulis output ke dokumen HTML;
4. Atribut innerHTML untuk menampilkan output ke elemen HTML yang lebih spesifik.

Fungsi yang manakah yang sering kamu gunakan?

Apa Itu this di JavaScript?

Apakah fungsi alert [] dalam JavaScript?

Apa itu Get Element by id?

Bagaimana mendeklarasikan variabel pada JavaScript?