Sunday, February 10, 2019

Variabel dan Tipe Data Pada Pemrograman Javascript

Variabel dan Tipe Data Pada Pemrograman Javascript

Variabel dan Tipe Data adalah dua hal dasar dalam bahasa pemrograman yang selalu digunakan, dan dua hal ini akan selalu ada di setiap bahasa pemrograman.

Apa Pengertian dari Variabel?

Variabel merupkan nama yang mewakili nilai. Variabel bisa diisi dengan berbagai macam nilai dengan berbagai macam tipe data, seperti string (teks), number (angka), objek, array, dan yang lainnya.

Jika diibaratkan dengan sebuah benda, maka variabel itu seperti wadah untuk menyimpan sesuatu.

Variabel dan Tipe Data Pada Pemrograman Javascript

Pada materi ini kita akan belajar mengenai variabel dan tipe data yang ada didalam Javascript.

Kita akan memulai dari cara membuat variabel, cara mencetak variabel ke output, mengisi ulang, dan menghapusnya dari memori.


Cara Membuat Variabel di Javascript

Cara membuat variabel yang umum digunakan pada pemrograman javascript adalah menggunakan kata kunci var lalu diikuti dengan nama variabel dan nilainya.

Contoh Codingnya :
var judul = "Belajar Javascript di FajarYusuf.Com";
Pada contoh coding di atas, kita membuat variabel bernama judul dengan nilai berupa teks dengan tipe data string : "Belajar Javascript di FajarYusuf.Com".

Contoh Codingnya Selanjutnya :

var webName = "FajarYusuf.Com";
var url = "https://www.FajarYusuf.com";
var visitorCount = 1404; 

Pada contoh di atas, kita menggunakan huruf bersar untuk nama-nama variabel yang terdiri dari dua suku kata.

Kenapa kita tidak menggunakan underscore saja?

Pada Pemrograman Javascript kita lebih dianjurkan menggunakan camelCase dalam penamaan variabel. 
Variabel dan Tipe Data Pada Pemrograman Javascript
Boleh tidak jika kita menggunakan camelCase? , boleh saja menggunakan snake case atau underscore seperti contoh ini:
var web_name= "FajarYusuf.Com";
var visitor_count = 1404;
Hal tersebut tidak akan menjadi masalah atau error coding, program masih akan tetap valid dan dapat di running. Tetapi, mayoritas programmer Javascript lebih suka menggunakan camelCase.

Sesuai selera anda, mau ikut yang camelCase mayoritas atau snake_case minoritas.

Perlu untuk diketahui juga, selain menggunakan keyword var kita juga bisa membuat variabel dengan keyword let atau tanpa keyword apapun.

Contoh Codingnya:
//membuat varibel dengan keyword let
let price = 14000;
//membuat variabel tanpa keyword apapun
stock = 12
Apa perbedaan diantara ketiga cara tersebut yang menggunakan var, let dan yang tanpa keyword?

Perbedaannya terletak pada jangkauan dan penggunaanya. Nanti akan dibahas lebih dalam lagi.

Pertanyaan lainnya mungkin :
“Apa yang terjadi jika nilai variabel tidak diisi?”

Jawabannya, variabel akan bernilai undefined (belum ditentukan).

Contohnya :
var x;
Maka variabel x akan bernilai undefined.

Cara Menampilkan isi Variabel Javascript

Cara untuk menampilkan isi variabel, kita bisa memanfaatkan fungsi-fungsi yang ada untuk menampilkan output seperti berikut :
  • Fungsi console.log() menampilkan output ke console javascript;
  • Fungsi document.write() menampilkan output ke dokumen HTML;
  • dan Fungsi alert() menampilkan output ke jendela dialog.

Mari kita coba, buatlah file bernama belajar-variabel.html, lalu isi dengan kode dibawah, atau kalian juga bisa coba pada editor html fajaryusuf.com  DISINI :

<html lang="en">
<head>
    <title>Belajar Variabel Javascript di FajarYusuf.Com</title>
    <script>
        // membuat variabel
        var name = "FajarYusuf.Com";
        var visitorCount = 1404;
        var isActive = true;
        var url = "https://www.fajaryusuf.com";
        // menampilkan variabel ke jendela dialog (alert)
        alert("Selamat datang di " + name);
        // menampilkan variabel ke dalam HTML
        document.write("Nama Situs: " + name + "<br>");
        document.write("Jumlah Pengunjung: " + visitorCount + "<br>");
        document.write("Status Aktif: " + isActive + "<br>");
        document.write("Alamat URL: " + url + "<br>");
    </script>
</head>
<body>
</body>
</html>



Hasilnya :
Variabel dan Tipe Data Pada Pemrograman Javascript


Arti dari simbol plus (+) pada contoh di atas adalah untuk menggabungkan, bukan untuk menjumlahkan.

Cara Mengisi Merubah Isi dari Variabel

Variabel bersifat mutable, artinya nilai yang tersimpan di dalamnya dapat kita isi ulang atau berubah.

Contoh Codingnya :

// mula-mula kita membuat variabel dengan isi awal ini
var age = 25;
// lalu kita ubah isinya
age = 17;
Kenapa saat mengisi ulang atau merubah nilai variabel tidak menggunakan keyword var?

Karena keyword var dibutuhkan saat membuat variabel saja. Sedangkan untuk mengisi ulang, kita cukup tulis seperti di atas.

Apabila kita menggunakan keyword var, berarti dapat diartikan kita membuat variabel baru, bukan mengisi ulang atau merubah nilai.

Cara Menghapus Variabel

Penghapusan variabel dalam Javscript memang jarang dilakukan. Namun, untuk program yang membutuhkan ketelitian dalam alokasi memori, penghapusan variabel perlu dilakukan agar penggunaan memori lebih optimal dan dapat dikontrol.

Penghapusan variabel dapat dilakukan dengan keyword delete.

Contoh Codingnya :
judul= "Belajar Pemrograman Javascript Di FajarYusuf.Com ";
delete judul;
Maka variabel judul akan terhapus dari memori.

Penghapusan variabel hanya bisa dilakukan pada variabel yang dibuat tanpa awalan keyword. Sedangkan variabel yang dibuat dengan keyword var dan let akan terhapus otomatis.

Apa Itu Tipe Data

Tipe data adalah berbagai macam jenis data yang bisa kita gunakan di dalam variabel untuk menentukan jenis data dari nilai.

Ada beberapa tipe data dalam pemrograman Javascript:

  • String (teks)
  • Integer atau Number (bilangan bulat)
  • Float (bilangan Pecahan)
  • Boolean
  • Object
Javascript adalah bahasa yang bersifat dynamic typing, artinya kita tidak harus menuliskan atau menentukan tipe data pada saat pembuatan variabel. Tidak seperti pada bahasa C, C++, Java, dsb.yang bersifat static typing.

Contoh Codingnya:
var name = "Eka";
var age = 24;
var single = false;
Javascript akan otomatis mengenali tipe data yang kita berikan pada setiap variabel yang diberi nilai.

Pada contoh di atas kita akan dapatkan seperti berikut :

  • name bertipe data String;
  • age bertipe data integer;
  • dan single bertipe data boolean.
Untuk hal pasti dari tipe data ini bisa juga kita cek dengan keyword typeof.

Contoh Codingnya :
typeof name;
typeof age;
typeof single;

Hasil pada console :
Variabel dan Tipe Data Pada Pemrograman Javascript

Bagaimana cara kita bisa mengenali tipe data pada javascript selain menggunakan typeof?

Kita bisa mengenali melalui cara penulisannya.

Contoh Codingnya :
// untuk tipe data teks atau string penulisannya selalu diapit dengan tanda petik
var author = "Fajar Yusuf";
// sedangkan untuk tipe data number dan boolean tidak diapit dengan tanda petik
var available = true; // untuk tipe data boolean hanya bernilai true dan false
var total = 25;


Aturan Untuk Penulisan Nama Variabel di Javascript

Ada beberapa aturan penulisan variabel dalam Javascript:

Aturan pertama : Penamaan variabel tidak boleh menggunakan angka di depannya.

contoh codingnya:
// yang salah
var 123name = "FajarYusuf.Com";
   
// yang benar
var name123 = "FajarYusuf.Com";
Aturan Kedua : Penamaan variabel boleh menggunakan awal underscore.

contoh coding :
var _name = "FajarYusuf.Com";
Aturan Ketiga : Penamaan variabel dianjurkan menggunakan camelCase apabila tediri dari dua suku kata.

Contoh Coding :

var wbName = "FajarYusuf.Com";
Aturan Keempat : Penamaan variabel dianjurkan menggunakan bahasa inggris

Contoh Codingnya :

var postTitle = "Tutorial Javascript Di FajarYusuf.Com";


Reviewer: FajarYusuf.Com
ItemReviewed: Variabel dan Tipe Data Pada Pemrograman Javascript

Friday, February 8, 2019

Make Output By Javascript

Make Output By Javascript


The output is a display of the program that we normally use to show the outcome of the program.

Output in other programming usually displayed in text form with function print ().

There are four ways that I will discuss to display the output from Javascript programs:


First Method: Using console.log function ()

The function console.log () is a function that exist in javascript programming that allows you to display text to the browser console or console javascript.

An example for you please use the following copy the coding below, and try  HERE :

<!DOCTYPE html>
<html>
<head>
<title>Tittle Page</title>
</head>
<body>
<script>
console.log("This is the output from console.log");
</script>
</body>
</html>


Then please click ctrl + shift + J to open the console browser and please run the program, the result will be like this:
Make Output By Javascript
see the output right there in the console, will appear at the output of each coding running


Usually  console.log ()  is used for debugging . Because any error messages that exist in JavaScript is always displayed in the Console.

In addition to console.log () , there are also a number of functions for debugging such console.debug (), console.info (), console.error (), console.dir () , and so on.

Make Output By Javascript
All functions of the console is also true on the console NodeJs.


Method Two: Using functions alert ()

Function alert () is a function that allows you to display a dialog window that we usually see in a pop-up display in a browser. This function is actually located on a Windows object.

The full writing is like this:
window.alert("This is output by Window Alert");
It could also simply alert () just like the following:
alert("This is output by Alert");
Alert function (), only works on any browser. While on Nodejs this function does not exist.


Here is an example of the use of coding functions alert ():

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Learn Javascript</title>
    <script>
        alert("Welcome to Learn Javascript FajarYusuf.Com");
        function sayHello(){
            alert("Good Luck For You!");
        }
    </script>
</head>
<body>
    <button onclick="sayHello()">Klik This Please!</button>
</body>
</html>



The result:
Make Output By Javascript

Third way: Using the function document.write ()

The document object is an object that represents an HTML document in Javascript.

In the document object, there is a function write () to write something into the HTML document.

Example Code:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Learn Javascript on FajarYusuf.Com</title>
    <script>
        document.write("<h1>I'm Cool</h1>");
        document.write("<hr>");
        document.write("<p>And i learn Javascript</p>");
        document.write("on <b>FajarYusuf.Com</b>")
    </script>
</head>
<body>
</body>
</html>



The result:
Make Output By Javascript

Not only function write (), the object document also provides a wide range of functions for manipulating HTML documents.

Fourth Method: Using innerHTML

innerHTML is an attribute in the (object) HTML element that contains a string of HTML.

By using innerHTML , we can display the output to the more specific elements.

Example Code:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Learn Javascript FajarYusuf.Com</title>
</head>
<body>
    <h1>Tutorial Javascript Completed</h1>
    <div id="results-output"></div>
    <script>
        //create elemen
        var hasil = document.getElementById("results-output");
        //display output to the result element
        hasil.innerHTML = "<p>This is Output by InnerHTML</p>";
    </script>
</body>
</html>



The result:

Make Output By Javascript

Reviewer: FajarYusuf.Com
ItemReviewed: Make Output By Javascript

TENTANG SITUS

SITUS INI ADALAH SITUS PEMBELAJARAN PEMROGRAMAN DAN JUGA PEMAHAMAN TERHADAP TEKNOLOGI KOMPUTER. KALIAN BISA MENGIKUTI PEMBELAJARAN PEMROGRAMAN DENGAN BERTAHAP PADA MATERI YANG SUDAH SAYA SEDIAKAN, JIKA ADA MATERI YANG MEMBINGUNGKAN SILAKAN LAKUKAN KOMENTAR PADA MATERI YANG ANDA TANYAKAN ATAU KALIAN BISA MENGHUBUNGI SAYA DIHALAMAN KONTAK.