Belajar javascript dasar lengkap – JavaScript dapat diimplementasikan menggunakan pernyataan JavaScript yang ditempatkan  dalam <script> … </script> tag HTML di halaman web. Anda dapat menempatkan tag <script>, yang berisi JavaScript Anda, di mana saja di dalam halaman web Anda, tetapi biasanya disarankan agar Anda menyimpannya di dalam tag <head>. Tag <script> memperingatkan program browser untuk mulai menafsirkan semua teks di antara tag ini sebagai skrip.

Belajar javascript dasar untuk pemula

Pada pertemuan kedua ini, kita akan mereview pengetahuan kalian tentang Javascript yang ada pada MODUL-2 yaitu:

• Memulai JavaScript
• Penempatan JavaScript
• Varible dalam JavaScript

Memulai JavaScript

Mari kita ambil contoh contoh untuk mencetak “Hello World”. Kami menambahkan komentar HTML opsional yang mengelilingi kode JavaScript kami. Ini untuk menyimpan kode kita dari browser yang tidak mendukung JavaScript. Komentar diakhiri dengan “//->”. Di sini “//” menandakan komentar dalam JavaScript, jadi kami menambahkannya untuk mencegah browser membaca akhir komentar HTML sebagai bagian dari JavaScript kode. Selanjutnya, kita memanggil fungsi document.write yang menulis string ke dalam dokumen HTML kita.

Contoh 1

<html>
<body>
<script language="javascript" type="text/javascript">
<!--
document.write ("Hello World!")
//-->
</script>
</body>
</html>

Contoh Penggunaan JavaScript

Pernyataan sederhana dalam JavaScript umumnya diikuti oleh karakter titik koma, seperti halnya di C, C++, dan Java. JavaScript, bagaimanapun, memungkinkan Anda untuk menghilangkan titik koma ini jika setiap pernyataan Anda ditempatkan pada baris terpisah. Misalnya, kode berikut dapat ditulis tanpa titik koma. Penggunaan titik koma adalah opsional.

Contoh penggunaan titik koma (semicolon)

<script language="javascript" type="text/javascript">
      var1 = 10;    var2 = 20;
</script>

Contoh tidak penggunaan titik koma (semicolon)

<script language="javascript" type="text/javascript">
    var1 = 10
    var2 = 20
 </script>

JavaScript adalah bahasa yang peka (case sensitive) huruf besar/kecil. Ini berarti bahwa kata kunci bahasa, variabel, nama fungsi, dan pengenal lainnya harus selalu diketik dengan huruf besar yang konsisten. Jadi pengidentifikasi Waktu dan WAKTU akan menyampaikan arti yang berbeda dalam JavaScript.

CATATAN: Perhatian harus dilakukan saat menulis nama variabel dan fungsi dalam JavaScript.

JavaScript mendukung komentar gaya-C dan gaya-C++. Jadi:

• Setiap teks antara // dan akhir baris diperlakukan sebagai komentar dan diabaikan oleh JavaScript.
• Setiap teks antara karakter / * dan * / diperlakukan sebagai komentar. Ini dengan rentang beberapa baris.
• JavaScript juga mengenali urutan pembuka komentar HTML <!- JavaScript memperlakukan ini sebagai komentar satu baris, seperti halnya // komentar.

Urutan penutupan komentar HTML -> tidak dikenali oleh JavaScript jadi harus ditulis sebagai //->.

<script language="javascript" type="text/javascript">

// This is a comment. It is similar to comments in C++
/*
* This is a multiline comment in JavaScript
* It is very similar to comments in C Programming
*/

 </script>

Penempatan JavaScript

Ada fleksibilitas yang diberikan untuk memasukkan kode JavaScript di mana saja dalam dokumen HTML. Namun cara yang paling disukai untuk memasukkan JavaScript dalam dokumen HTML adalah sebagai berikut:

Skrip di bagian <head> … </head>.

Skrip di bagian <body> … </body>.

Skrip di bagian <body> … </body> dan <head> … </head>.

Skrip dalam file eksternal dan kemudian sertakan di bagian <head> … </head>.

Di bagian berikut, kita akan melihat bagaimana kita dapat menempatkan JavaScript dalam file HTML dengan cara yang berbeda.

Contoh 2

<html>
<head>
<script type="text/javascript">
function sayHello() {
alert("Hello World")
}
</script>
</head>
<body>
Click here for the result
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>

Varible dalam JavaScript

Salah satu karakteristik paling mendasar dari bahasa pemrograman adalah kumpulan tipe data yang didukungnya. Ini adalah jenis nilai yang dapat direpresentasikan dan dimanipulasi dalam bahasa pemrograman.

JavaScript memungkinkan Anda untuk bekerja dengan tiga tipe data primitif:

• Angka, contoh, 123, 120,50 dll.
• String teks, contoh. “This text string ” dll.
• Boolean, contoh. true or false.

JavaScript juga mendefinisikan dua tipe data trivial, null dan undefined, yang masing-masing hanya mendefinisikan satu nilai. Selain tipe data primitif ini, JavaScript mendukung tipe data komposit yang dikenal sebagai objek. Kami akan membahas objek secara rinci dalam bab terpisah.

Catatan: Java tidak membuat perbedaan antara nilai integer dan nilai floatingpoint. Semua angka dalam JavaScript direpresentasikan sebagai nilai floating-point.

JavaScript mewakili angka menggunakan format titik-mengambang 64-bit yang ditentukan oleh

standar IEEE 754.

Sebelum Anda menggunakan variabel dalam program JavaScript, Anda harus mendeklarasikannya. Variabel dideklarasikan dengan kata kunci var sebagai berikut.

<script type="text/javascript">
var money;
var name;
</script>

Misalnya, Anda dapat membuat variabel money dan menetapkan nilai 2000,50 nanti. Untuk variabel lain, Anda dapat menetapkan nilai pada saat inisialisasi sebagai berikut :

<script type="text/javascript">
var name    = "Ahmad";
var money;
money      = 2000.50;
</script>

Contoh 3

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Variables</h1>
<p>In this example, x, y, and z are variables</p>
<p id="demo"></p>
<script>
var x = 5;
var y = 6;
var z = x + y;
document.getElementById("demo").innerHTML = z;
</script>
</body>
</html>

Lingkup Variabel JavaScript

Ruang lingkup variabel adalah wilayah program Anda di mana ia didefinisikan. Variabel JavaScript hanya memiliki dua cakupan.

Variabel Global : Variabel global memiliki cakupan global yang berarti dapat didefinisikan di mana saja dalam kode JavaScript Anda.

Variabel Lokal   : Variabel lokal hanya akan terlihat dalam suatu fungsi di mana itu didefinisikan. Parameter fungsi selalu lokal untuk fungsi itu.

<!DOCTYPE html>
<html>
<body>
<p>The local variable carName cannot be accessed from code outside the function:</p>
<p id="demo"></p>
<script>
myFunction();
document.getElementById("demo").innerHTML =
"The type of carName is " + typeof carName;
function myFunction() {
    var carName = "Volvo";
}
</script>

</body>
</html>

Contoh 5

<!DOCTYPE html>
<html>
<body>
<p>A GLOBAL variable can be accessed from any script or function.</p>
<p id="demo"></p>
<script>
var carName = "Volvo";
myFunction();
function myFunction() {
    document.getElementById("demo").innerHTML =
    "I can display " + carName;
}
</script>
</body>
</html>

Nama Variabel JavaScript

Saat memberi nama variabel Anda dalam JavaScript, ingatlah aturan berikut.

• Tidak boleh menggunakan salah satu kata kunci yang dicadangkan JavaScript sebagai nama variabel. Kata kunci ini disebutkan di bagian selanjutnya. Misalnya, nama variabel break atau boolean tidak valid.
• Nama variabel JavaScript tidak boleh dimulai dengan angka (0-9). Mereka harus dimulai dengan huruf atau karakter garis bawah. Untuk

contoh, 123test adalah nama variabel yang tidak valid tetapi _123test adalah valid.

Nama variabel JavaScript peka terhadap huruf besar/kecil. Misalnya, Name dan name adalah dua variabel yang berbeda.

TUGASSS!!

Buatlah kode HTML yang mengandung javascript untuk menampilkan perkalian, pembagian dan penambahan.

Sumber :
– w3school
– Abdul Qadir, 2013, From Zero to A Pro Javascript & Jquery, Andi Yogyakarta
– Tutorials point, 2015, JavaScript Language Tutorials Point, E-book, tutorialspoint.com
– https://www.w3bai.com/id/

<< Part 1