Tutorial Javascript 1 - Apa itu JavaScript?

JavaScript adalah bahasa pemrograman web yang digunakan untuk memanipulasi element html agar dapat membuat interaksi dengan pengguna di dalam browser. Sebagai contoh, apa yang terjadi ketika sebuah tombol di dalam browser di klik? lalu bagaimana membuat gambar yang muncul bergantian secara automatis (slidesow) dll, disinilah peran javascript muncul.

Jika di ibartkan dengan anatomi tubuh manusia javascript merupakan otaknya sedangkan html adalah kerangka atau tulangnya dan css merupakan pakaian sehinga jadilah satu kesatuhan sebuah website yang utuh.

JavaScript yang akan kita pelajari pada artikel ini termasuk dalam kelompok bahasa pemrograman web berbasis client (client side programming language). Artinya, javascript di proses di dalam web browser sama seperti html dan css.

Javascript menggunakan standar yang dinerikan atau ditetapkan oleh ECMAScript, maksudnya yang membuat dan mengembangkan javascript adalah ECMA (european computer manufactures association), yakni sebuah lembaga standarisasi eropa khusus komputer.

Apa perbedaan JavaScript dengan Java?

Nama javascript memang sering membuat bingung sebagian programmer pemula, ini disebabkan oleh penggunaan kata yang sama dengan bahasa pemrograman yang berlogo kopi yaitu terletak di kata "Java". Tidak sedikit yang berasumsi bahwa javacript merupakan merupakan versi ringan dari bahasa java atau javascript adalah bahasa pemrograman java yang di kususkan untuk membuat website.

Javascript sepenuhnya berbeda dengan bahasa pemrograman java, hanya penamaanya saja yang sama. Penamaan tersebut tidak lepas dari sejarah dan ide marketing yang dibuat oleh perusahaan Netscape Communications, selaku perusahaan yang pertama kali mengembangkan javascript

Sekitar tahun 1990an, Netscape berusaha mendapatkan pangsa pasar web browser, yakni persaingan antara web browser Netscape Navigator dengan Internet Explorer. Oleh karena itu, supaya lebih "menjual" Netscape mengubah bahasa pemrograman yang dikembangkanya dari LiveScript menjadi JavaScript dengan harapan bisa mengikuti kepopuleran dari bahasa pemrograman Java.

Walaupun sepenuhnya berbeda, banyak syntax dan aturan penulisan javasript mirip dengan java, ini karena keduanya sama-sama terinspirasi dari format penulisan bahasa C dan C++.

JScript dan VBScript dari Microsoft

Jika berbicara tentang javascript, perusahaan yang mengembangkanya adalah Netscape Communications, disinilah javascript berdiri dan dibesarkan. Perkembangan javascript juga diiringi sebuah era yang dinamakan "browser war". Perang web browser antara Internet Explorer buatan Microsoft dengan Netscape Navigator buatan Netscape Communications.

Melihat kesuksesan JavaScript, Microsoft tidak mau ketinggalan dan segera membuat bahasa serupa untuk Internet explorer. Tentu saja mereka tidak bisa menggunakan nama JavaScript karena masalah hak paten dengan Sun Microsystems.

Microsoft melakukan 'reverse-engineered' javascript, yakni membuat bahasa pemrograman baru dengan fitur mirip javascript. Bahasa baru ini diberi nama JScript yang dirilis pada Internet Explorer 3.0 pada agustus 1996. Namun seakan tidak puas dengan JScript, Microsoft juga mengembangkan bahasa pemrograman VBScript. Bahasa VBScript sebenarnya tidak hanya untuk web programming, tapi juga di gunakan dalam aplikasi lain yang dikembangkan Microsoft.

Karena dengan adanya perang web browser, korban dari persaingan ini adalah web programmer. Masing-masing web browser memiliki fitur dan perbedaan sehingga perlu usaha extra untuk membuat kode program yang tampil sempurna baik di IE maupun Netscape, oleh karena itulah muncul standarisai javascript.

Standarisasi JavaScript "ECMAScript"

Agar permasalah perang web browser antara Microsot dan Netscape tidak berlarut-larut, Netscape berinisiatif mengajukan sebuah standar mengenai bahasa pemrograman ini. Tujuannya agar kedua bahasa pemrograman ini mengikuti sebuah aturan yang baku. Harapanya web programmer tidak lagi di ribetkan terkait perbedaan implementasi dari kedua bahasa tersebut.

Netscape memilih badan standarisasi ECMA Internasional sebagai pihak yang akan memgembangkan bahasa pemrograman ini. Karena nama javascript terikat trademark dengan pengembang java yaitu Sun Microsystems, harus di pilih nama baru yakni ECMAScript gabungan antara ECMA dan JavaScript. Untuk membuat standar ECMAScript, dibentuklah Technical Committee 39 yang beranggotakan programmer dari berbagai perusahaan internet pada saat itu seperti Netscape, Sun, Microsoft dll.

Version ECMAScript	Release
1th Edition	June 1997
2th Edition	June 1998
3th Edition	December 1999
4th Edition	Abandoned
5th Edition	December 2009
6th Edition	June 2015
7th Edition	June 2016
8th Edition	June 2017
9th Edition	June 2018
10th Edition	June 2019

Menjalankan Kode Program JavaScript

Apa yang perlu dipersiapkan untuk memulai koding?

1. Web Browser (Chrome, Firefox, Opera, Safari dll)
2. Text Editor (VS Code, Sublime Text, Atom, Komodo dll)

Disini saya menggunakan Google Chrome sebagai web browser dan Visual studio Code sebagai text editor, namun jika anda ingin berbeda penggunan softwarenya dipersilakan dan saya tidak menuntut untuk sama seperti saya. Sedikit info sebelum memulai ngoding, javascript bersifat case sensitive artinya huruf besar dan kecil dianggap berbeda.

Sebagai pengenalan kita mulai membuat kode paling umum untu pelatihan yaitu "Hello Word", berikut kodenya:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Tutorial JavaScript</title>
</head>

<body>
    <h1>Tutorial JavaScript</h1>
     <button onclick="alert('Hello World');">Click Me!</button>
</body>

</html>

kemudian simpan dengan nama tutorial-js1.html, lalu jalankan di web browser

Inilah hasil dari kode program yang telah kita tulis tadi. Sebuah halaman html dendgan jendela popup setelah kita mengeklik button 'Click Me!' lalu memunculkan tulisan "Hello World". Mari kita bahass beberapa aspek dari kode program tersebut.

Pertama adalah 90 persen kode tersebut terdiri dari html yakni tag <head>, <meta>, <title>, <body>,<h1> dan <button>.

Kedua, satu-satunya perintah javascript yang kita jalankkan adalah kode javascript yang disisipkan ke dalam tag <button> dalam perintah alert("Hello World"). kode ini berfungsi untuk menampilkan jendela popup dengan teks "Hello world". Perintah alert merupakan sebuah function di dalam javascript. Anda bisa mengubah kode text tersebut menjadi apapun yang anda inginkan misalnya alert("Selamat Makan") maka akan tampil jendela popup dengan teks "Selamat Makan".

Ketiga, jika diperhatikan nama file yang telah kita berikan tadi tetap menggunakan extension .html mengapa demikian? sama seperti css, apabila kode javascript disisipkan ke dalam html, kita tetap menyimpanya kedalam extension `.html'. JavaScript juga mempunyai penyisipan kode inline javacript, internal javascript dan external javascript. Kebetulan yang kita pakai kali ini merupakan penyisipan inline javascript.

Sekian pada tutorial javascript kali ini, selanjutnya kita akan membahas penyisipan kode javascript. Terima kasih!