Dalam tutorial pertama tentang JavaScript di Duniailkom ini, kita akan bahas Pengertian dan Fungsi JavaScript di web programming serta bagaimana perkembangan JavaScript hingga saat ini. Show
Pengertian JavaScriptDalam pengertian sederhana, JavaScript adalah bahasa pemrograman web yang digunakan untuk memanipulasi element HTML dan membuat interaksi. Sebagai contoh, apa yang terjadi ketika sebuah tombol di klik? Bagaimana membuat gambar muncul bergantian secara otomatis (slider), atau bagaimana cara mengubah warna kotak dari merah ke biru setelah tampil selama 1 menit? Inilah yang bisa kita lakukan dengan JavaScript. JavaScript menambahkan aspek “interaktif” ke dalam HTML dan CSS. Misal, jika sebuah tag <h1> di klik, tampilkan isi seluruh artikel yang terdiri dari 10 tag <p>, atau jika sebuah gambar di klik, tukar class CSS-nya dari .normal menjadi .warning. JavaScript yang akan kita pelajari dalam tutorial duniailkom ini termasuk kelompok bahasa pemrograman web berbasis client (client side programming language). Artinya, JavaScript di proses dalam web browser yang sama seperti kode HTML dan CSS. Ini berbeda dengan bahasa PHP yang diproses di server (server side programming language). Mari kita simak pengertian JavaScript dari wikipedia: “JavaScript is a high-level, dynamic, untyped, and interpreted programming language. It has been standardized in the ECMAScript language specification. Alongside HTML and CSS, it is one of the three core technologies of World Wide Web content production.“ Terjemahan bebasnya: “JavaScript adalah bahasa pemrograman yang memiliki ciri-ciri: tingkat tinggi (high-level), dinamis, tidak bertipe dan diproses secara interpreted. JavaScript menggunakan standar spesifikasi ECMAScript. Bersama HTML dan CSS, JavaScript menjadi salah satu teknologi inti dari pembuatan konten halaman web (World Wide Web).“ Kita akan bahas pengertian yang “sangat teknis” ini. JavaScript disebut sebagai bahasa pemrograman tingkat tinggi atau high-level programming language karena kodenya sudah mirip dengan bahasa inggris sehari-hari. Dalam bahasa pemrograman tingkat tinggi, kita tidak lagi dipusingkan dengan pengaturan dasar seperti alokasi memory, register, garbage collection, dan hal teknis lain yang umumnya ada di dalam bahasa pemrograman tingkat rendah seperti bahasa assembly. Hampir semua bahasa pemrograman modern sudah termasuk high level programming language seperti PHP, Pascal, C++, Python dan JAVA. JavaScript memiliki fitur dinamis, tidak bertipe dan diproses secara interpreted. JavaScript mirip bahasa PHP dimana kita tidak perlu menetapkan sebuah variabel harus bertipe integer, float, maupun string. Setiap variabel di dalam JavaScript bisa diisi dengan tipe data apa saja dan kapan saja sepanjang kode program (bersifat dinamis). Ini berbeda dengan bahasa pemrograman seperti Pascal, C++ maupun JAVA yang setiap variabelnya hanya bisa diisi tipe data yang sudah ditetapkan, ini dikenal sebagai typed programming language. Dalam bahasa pemrograman jenis ini, jika sebuah variabel sudah ditetapkan bertipe integer (angka bulat), maka sepanjang kode program tidak bisa diisi dengan tipe data string (teks) maupun float (angka desimal). JavaScript menggunakan standar spesifikasi ECMAScript. Maksudnya, yang membuat dan mengembangkan JavaScript adalah ECMA. ECMA merupakan singkatan dari European Computer Manufacturers Association, sebuah lembaga standarisasi Eropa khusus komputer. Jika ingin disamakan, ini mirip seperti SNI kalau di Indonesia (Standar Nasional Indonesia). Bersama-sama dengan HTML dan CSS, JavaScript menjadi teknologi inti dari pembuatan konten halaman web (World Wide Web). Ketiga teknologi ini memiliki peran masing-masing. HTML dipakai untuk membuat struktur dan isi dari halaman web (content). CSS untuk mempercantik tampilan website (design). Dan Javacript berfungsi menangani interaksi (behavior). Sebutan kerennya: “HTML for content, CSS for presentation and JavaScript for behavior“. Jika pengertian dari wikipedia ini terasa membingungkan, jangan khawatir. Anda cukup pahami bahwa JavaScript adalah bahasa pemrograman web yang dipakai untuk memprogram HTML. Dengan JavaScript, kita bisa membuat halaman web menjadi lebih interaktif. Samakah JavaScript dengan JAVA?Nama JavaScript memang sering membuat bingung programmer pemula. Ini karena terdapat bahasa pemrograman populer lain yang bernama JAVA. Tidak sedikit yang beranggapan bahwa JavaScript adalah versi “ringan” dari JAVA, atau JavaScript adalah bahasa pemrograman JAVA yang digunakan khusus membuat web. JavaScript sepenuhnya berbeda dari JAVA. Penamaan yang mirip ini tidak lepas dari sejarah dan ide marketing oleh Netscape Communications, selaku perusahaan yang pertama kali mengembangkan JavaScript. Sekitar tahun 1990an, Netscape (yang saat itu sedang bersaing dengan Microsoft) berusaha mendapatkan pangsa pasar web browser, yakni persaingan antara web browser Netscape Navigator dengan Internet Explorer. Era ini dikenal juga dengan era “browser war”. Supaya lebih “menjual”, Netscape mengubah bahasa pemrograman yang dibuatnya dari “LiveScript” menjadi “JavaScript” dengan harapan bisa mengikuti kepopuleran bahasa pemrograman JAVA yang saat itu sedang booming di kalangan programmer. Walaupun sepenuhnya berbeda, banyak syntax dan aturan penulisan JavaScript mirip dengan JAVA, ini karena keduanya sama-sama terinspirasi dari format penulisan bahasa C dan C++. Bahasa pemrograman PHP juga turunan dari C dan C++. Jika sebelumnya anda sudah pernah mempelajari PHP, aturan penulisan kode program di JavaScript akan terasa sangat mirip. Fungsi JavaScript Dalam Pemograman WebPada awal dikembangkan, JavaScript berfungsi untuk membuat interaksi antara user dengan web menjadi lebih cepat. Sebelum ada JavaScript, setiap interaksi dari user harus diproses ke server. Bayangkan ketika kita mengisi form registrasi untuk pendaftaran sebuah situs web, lalu men-klik tombol submit, menunggu sekitar 5 detik untuk website memproses form tersebut, dan mendapati ada kolom form salah. Untuk keperluan seperti inilah JavaScript dikembangkan. Pemrosesan untuk memeriksa form bisa dipindahkan dari web server ke dalam web browser. Dalam perkembangan selanjutnya, JavaScript tidak hanya bisa dipakai untuk validasi form, namun juga berbagai keperluan yang lebih modern. Berbagai animasi untuk mempercantik halaman web, fitur chatting, efek-efek modern, games, semuanya bisa dibuat menggunakan JavaScript. Akan tetapi karena sifatnya yang dijalankan di sisi client yakni di dalam web browser yang digunakan oleh pengunjung, user sepenuhnya dapat mengontrol eksekusi JavaScript. Hampir semua web browser menyediakan fasilitas untuk mematikan JavaScript, atau bahkan mengubah kode JavaScript yang ada, sehingga kita tidak bisa bergantung sepenuhnya kepada JavaScript. Modern JavaScriptBeberapa tahun belakangan, JavaScript berkembang dengan sangat pesat, terutama sejak kehadiran Nodejs. Dengan Nodejs, JavaScript bisa berjalan sebagai bahasa pemrograman server (menggantikan peran PHP). Selain itu bermunculan framework front-end JavaScript seperti Angular, Vue, dan React. Framework jenis ini mempermudah pembuatan web SPA (Single-page Application). Contoh dari web SPA seperti Gmail, GDrive, atau Google Doc. Di web tersebut, halaman yang di akses cukup satu, tidak butuh reload seperti layaknya sebuah website. Ini lebih mirip seperti aplikasi desktop. JavaScript juga berevolusi menjadi bahasa multi-platform, tidak hanya di lingkungan web saja. Sekarang kita bisa membuat aplikasi desktop dengan framework Electron, membuat aplikasi mobile dengan React Native, serta juga tersedia library/framework JavaScript untuk perangkat IOT (Internet of Things). Semakin luasnya dunia JavaScript, membuka peluang besar bagi yang ingin fokus di bahasa yang satu ini. Dalam tutorial selanjutnya, kita akan berkenalan dengan Sejarah dan Perkembangan versi JavaScript. Saat ini di Duniailkom tersedia eBook / buku JavaScript Uncover. Dengan total lebih dari 650 halaman A4, materi di buku jauh lebih banyak daripada tutorial di web Duniailkom. Penjelasan lebih lanjut bisa ke: JavaScript Uncover – Panduan Belajar JavaScript.
JavaScript adalah skrip pemrograman ringan yang umumnya digunakan oleh developer untuk menciptakan interaksi yang lebih dinamis pada halaman web, aplikasi, server, atau game. Web developer umumnya menggunakan JavaScript bersama HTML dan CSS karena ketiganya bisa bekerja sama tanpa masalah. Jadi, JavaScript adalah bahasa pemrogramannya, HTML berfungsi untuk menyusun struktur website, dan CSS untuk mendesain serta mengatur layout halaman website. JavaScript umum digunakan pada web, aplikasi seluler, dan game development, sehingga menjadi salah satu yang paling populer. Nah, di artikel ini, kami akan menjelaskan apa itu JavaScript, cara kerjanya, serta perbedaan Java dan JavaScript. Simak sampai selesai, ya. Sebenarnya, apa yang dimaksud dengan JavaScript? Jadi, JavaScript adalah bahasa scripting untuk membuat konten dinamis di halaman atau aplikasi web, game, serta membangun web server. Kita bisa membuat elemen dinamis untuk interaksi user, seperti menu drop-down atau grafik animasi. Sejarah JavaScript dimulai pada tahun 1995, diciptakan oleh Brendan Eich di Netscape Communications. Awalnya, JavaScript hanya digunakan untuk keperluan internal dengan web browser perusahaan tersebut, Netscape Navigator. Namanya dulunya adalah LiveScript, lalu diubah menjadi JavaScript agar bisa menjadi “teman” bagi bahasa pemrograman Java milik mitra mereka, Sun Microsystems. Kami akan menjelaskan perbedaan Java dan JavaScript nanti. JavaScript terus berkembang bersama browser web baru seperti Mozilla Firefox dan Google Chrome sejak saat itu. Bahkan, saat ini sedang dikembangkan mesin JavaScript modern pertama, yaitu V8, yang bertugas untuk mengompilasi bytecode menjadi kode mesin asli. Apa Fungsi JavaScript?Fungsi JavaScript di antaranya adalah untuk pengembangan aplikasi web dan mobile, membangun web server dan aplikasi server, membuat website yang interaktif, serta game development. Saat ini, bahasa scripting ini memiliki banyak framework dan library yang bisa membantu mempercepat proses, seperti AngularJS, jQuery, and ReactJS. Meskipun umumnya melayani program berbasis web, fitur pemrograman JavaScript memiliki implementasi lain di area yang berbeda. Untuk lebih jelasnya, berikut kegunaan JavaScript: 1. Efisiensi Pengembangan Aplikasi Web dan SelulerPengembangan framework JavaScript, yang terdiri dari library kode JavaScript, memungkinkan developer menggunakan kode JS siap pakai dalam proyek mereka. Proses yang harus dilalui pun menjadi lebih cepat dan efisien karena mereka tidak perlu menulis kode dari nol. Setiap framework JavaScript memiliki fitur yang berfungsi untuk menyederhanakan proses development dan debugging. Misalnya, framework front-end seperti jQuery dan ReactJS bisa membantu meningkatkan efisiensi desain. Developer bisa menggunakan ulang dan memperbarui komponen kode tanpa memengaruhi satu sama lain, baik dari segi fungsi maupun nilai. Sementara itu, framework pengembangan aplikasi mobile seperti Cordova dan Titanium bisa digunakan untuk membuat aplikasi native atau hybrid. Implementasi kode JS di Node.js juga berperan penting dalam web development. Node.js bisa mengurangi waktu respons server karena sifatnya yang single-threaded dan memiliki arsitektur non-blocking. 2. Membangun Web Server dan Aplikasi ServerMelalui Node.js, JavaScript memungkinkan developer membangun web server dan infrastruktur back-end sehingga akan menghemat waktu dan tenaga dalam hal pembuatan web server. Modul HTTP built-in pada bahasa scripting ini memungkinkan Anda mengembangkan server HTTP basic yang menampilkan teks biasa saat pengunjung mengakses halaman web. Anda bisa menggunakan web server Node.js sendiri, Node-OS, atau milik pihak luar seperti Microsoft Internet Information Services (IIS) dan Apache untuk menangani permintaan HTTP. Node-OS bekerja paling baik di sistem operasi Linux karena dikembangkan berdasarkan kernel Linux. 3. Membuat Website yang InteraktifSalah satu yang paling utama dari fungsi JavaScript adalah menciptakan halaman web yang dinamis, seperti untuk menampilkan animasi, mengubah visibilitas teks, dan membuat menu drop-down. Meskipun Anda bisa menggunakan HTML dan CSS saja untuk membuat website, halaman yang dihasilkan hanya akan memiliki tampilan statis tanpa adanya JavaScript. Bahasa scripting ini memungkinkan pengunjung berinteraksi dengan halaman web, dan Anda pun bisa menyajikan user experience yang lebih baik. Selain itu, JavaScript memungkinkan Anda mengubah konten dan nilai atribut HTML tanpa harus merefresh halaman web dulu. Sebab, JavaScript mendukung tipe data berikut:
Tipe data primitif, yang terdiri dari semua tipe data kecuali object, hanya bisa menyimpan satu data. Sementara itu, tipe data object bisa berisi sekumpulan nilai. Dengan JavaScript, Anda juga bisa meningkatkan pengalaman browsing pengunjung menggunakan cookie. Untuk membuat, membaca, dan menghapus cookie dalam JavaScript, diperlukan properti document.cookie yang berfungsi sebagai “getter and setter” nilai cookie. 4. Memudahkan Pengembangan GameJavaScript juga bisa membantu Anda membuat game kalau digunakan dengan HTML5 dan Application Programming Interface (API) seperti WebGL. Ada banyak game engine berbasis JavaScript seperti Phaser, GDevelop, dan Kiwi.js yang tersedia untuk rendering grafis, daur ulang kode, dan aplikasi lintas platform. Beberapa contoh game yang dibuat dengan JavaScript antara lain adalah Angry Birds, The Wizard, dan 2048. Perbedaan Java dan JavaScriptMenurut informasi dari website resmi Java, bahasa pemrograman JavaScript yang dikembangkan oleh Netscape, Inc. bukanlah bagian dari platform Java yang dikembangkan oleh Sun Microsystems (sebelum diakuisisi Oracle). Perbedaan Java dan JavaScript adalah, Java merupakan bahasa pemrograman, sedangkan JavaScript adalah skrip pemrograman. Kode JavaScript ditulis dalam teks dan bisa langsung diinterpretasikan browser, sedangkan Java harus di-compile menjadi bytecode yang bisa dipahami dan dijalankan komputer. Apa bedanya scripting language dan bahasa pemrograman? Nah, bahasa scripting termasuk ke dalam bahasa pemrograman, tapi digunakan untuk memanipulasi, menyesuaikan, dan mengotomatiskan apa yang sudah ada di sistem. Sedangkan bahasa pemrograman biasanya digunakan untuk membuat program dari nol. Kemudian, Java digunakan untuk membuat aplikasi di perangkat atau browser, sedangkan JavaScript umumnya digunakan pada dokumen HTML. Plugin yang digunakan untuk menggunakan Java dan JavaScript pun berbeda. Untuk lebih jelasnya, ini perbedaan Java dan JavaScript:
Kelebihan dan Kekurangan JavaScriptJavaScript memiliki sejumlah keunggulan yang membuatnya menjadi pilihan yang lebih baik daripada bahasa pemrogramman lainnya. Antara lain, berikut kelebihan JavaScript:
Namun, JavaScript juga memiliki beberapa batasan yang perlu Anda pertimbangkan. Berikut adalah beberapa kekurangan JavaScript:
Cara Kerja JavaScript pada WebsiteJavaScript di-embed langsung ke halaman web atau direferensikan melalui file .js terpisah. Saat pengunjung membuka halaman web, browser akan menjalankan skrip beserta kode HTML dan CSS untuk membuat halaman fungsional yang disajikan melalui tab browser. Skrip kemudian didownload dan diproses di perangkat pengunjung. Yap, seperti yang kami jelaskan tadi, JavaScript adalah bahasa sisi klien. Jadi tidak seperti bahasa server side di mana server memproses skrip sebelum dikirim ke browser. Saat menemukan blok kode JavaScript, browser web akan memprosesnya dari atas ke bawah. Karena urutan akan diperhitungkan, pastikan Anda mereferensikan objek atau variabel di dalam blok lebih dulu sebelum memodifikasinya. Apabila memiliki variabel tanpa nilai, error undefined akan muncul. Cara Menggunakan JavaScript pada HTMLAda dua cara menggunakan JavaScript pada HTML, yaitu secara internal dan eksternal. JavaScript internal menggunakan tag <script> pada body script HTML untuk mencakup semua kode JavaScript. Berikut contoh JavaScript internal dengan tag <script>: <html> <head> <title>Inline JavaScript</title> <script type="text/javascript"> alert("Hello World"); </script> </head> <body> </body> </html>Anda juga bisa meng-embed skrip pada atribut event HTML, meminta browser untuk mengeksekusinya saat sebuah event dipicu. Jenis skrip ini disebut inline JavaScript (hapus tanda “*” pada “onclick” untuk menggunakan kode): <button *onclick*="alert('Click for more details')">Click</button>Di sisi lain, JavaScript eksternal dilakukan dengan menyimpan kode dalam file .js terpisah, lalu memanggilnya kembali di halaman HTML. Developer sering menggunakan metode ini saat mengerjakan proyek besar, karena akan membuat skripnya lebih teratur. Anda juga bisa menggunakan lagi skrip JavaScript eksternal di beberapa halaman HTML, yang tentunya akan sangat membantu. Misalnya, menambahkan skrip berikut ke halaman HTML memungkinkan Anda memanggil kembali file JavaScript eksternal bernama script.js: <script src="script.js" defer></script>Ini adalah contoh cara mereferensikan file JavaScript eksternal: <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Time right now:</title> </head> <body> <button type="button" onclick="myFunction()">Select</button> </body> <script src="js/script.js"></script> </html>Anda bisa membuat dan memodifikasi kode JavaScript menggunakan text editor. Aplikasi text editor yang bisa digunakan juga bermacam-macam, silakan lihat rekomendasi HTML text editor terbaik kami untuk memilih mana yang paling sesuai kebutuhan. Perlu diingat bahwa ada dua jenis text editor, yaitu WYSIWYG (what-you-see-is-what-you-get) dan editor tekstual. Editor WYSIWYG lebih cocok untuk pemula karena menampilkan tampilan blok kode pada halaman. Contohnya, TinyMCE adalah text editor WYSIWYG populer yang digunakan di WordPress. Di sisi lain, editor berbasis teks memberi Anda kebebasan untuk menyesuaikan kode, tapi membutuhkan skill HTML. Beberapa text editor yang paling populer mencakup Sublime Text, Atom, dan Notepad++. Mau tahu selengkapnya? Silakan lihat tutorial kami tentang cara membuat JavaScript di HTML. Di tutorial tersebut, kami memberikan contoh dan penjelasan lengkap tentang implementasi JavaScript. Website resmi JavaScript juga menyediakan banyak tutorial demo bagi pemula dan para fans JavaScript. KesimpulanJadi, JavaScript adalah bahasa penulisan skrip (yang juga termasuk bahasa pemrograman) berbasis objek, umumnya digunakan untuk membuat halaman web interaktif. JavaScript juga sering digunakan bersama HTML dan CSS. Selain menjelaskan apa itu JavaScript, di artikel ini kami juga sudah menjelaskan perbedaan Java dan JavaScript, yang umumnya terletak pada segi kegunaan. Kemudian, JavaScript memiliki beberapa keunggulan, di antaranya:
Semoga artikel ini bisa membantu Anda memahami apa itu JavaScript serta fungsinya untuk website dan aplikasi. Apabila ingin mempelajari JavaScript, silakan lihat panduan kami tentang belajar coding. Masih punya pertanyaan? Silakan sampaikan pada kolom komentar di bawah ini, ya. Terima kasih sudah membaca. 😊 |