Ditanyain LMS

Tutorials

Fundamental JavaScript & Environment

Selamat datang di langkah pertama Anda dalam dunia pemrograman! Sebelum kita menyentuh baris kode pertama, kita harus memahami apa sebenarnya "mesin" yang sedang kita pelajari. JavaScript adalah bahasa pemrograman yang sangat spesial karena ia merupakan bahasa yang memberikan "nyawa" pada halaman web. Tanpa JavaScript, sebuah website hanyalah tumpukan teks dan gambar yang kaku. Dengan JavaScript, kita bisa membuat tombol yang merespons klik, formulir yang memvalidasi data secara instan, hingga aplikasi kompleks seperti Instagram atau Google Maps yang berjalan langsung di browser Anda.

Awalnya, JavaScript diciptakan hanya untuk berjalan di dalam browser (Frontend). Namun, seiring berkembangnya teknologi, muncul sebuah alat bernama Node.js yang memungkinkan JavaScript berjalan di komputer server (Backend). Ini berarti, dengan mempelajari satu bahasa ini, Anda memiliki kekuatan untuk membangun aplikasi web yang lengkap dari sisi depan hingga belakang.

Cara Kerja JavaScript di Browser

Pernahkah Anda bertanya-tanya bagaimana teks yang Anda ketik bisa berubah menjadi perintah yang dipahami komputer? Di dalam browser seperti Google Chrome atau Firefox, terdapat sebuah komponen bernama JavaScript Engine. Di Google Chrome, mesin ini disebut V8. Tugasnya adalah membaca kode Anda baris demi baris, menerjemahkannya, dan langsung mengeksekusinya. Inilah sebabnya JavaScript disebut sebagai interpreted language.

Mari kita coba perintah pertama kita. Bayangkan Anda ingin memberikan salam melalui sebuah kotak pesan kecil yang muncul di layar. Kita akan menggunakan perintah alert().

1// Perintah ini akan memunculkan pop-up di browser Anda 2alert("Halo, saya sedang belajar JavaScript!");

Dalam kode di atas, alert adalah sebuah fungsi bawaan yang sudah disediakan oleh browser. Teks di dalam tanda kurung "Halo, saya sedang belajar JavaScript!" adalah informasi yang kita berikan kepada fungsi tersebut untuk ditampilkan. Kesalahan umum pemula adalah lupa menutup tanda kurung atau menghilangkan tanda petik pada teks, yang akan mengakibatkan kode gagal berjalan karena browser tidak tahu di mana teks tersebut berakhir.

Tools & Environment

Untuk mulai menulis kode dengan cara yang profesional, Anda membutuhkan "kotak perkakas" yang tepat. Meskipun Anda bisa menulis JavaScript di Notepad, para pengembang profesional menggunakan Code Editor seperti Visual Studio Code (VS Code). VS Code membantu Anda dengan fitur syntax highlighting (memberi warna pada kode agar mudah dibaca) dan auto-completion.

Selain editor, alat paling penting bagi pengembang JavaScript adalah Browser Developer Tools. Anda bisa membukanya di Chrome dengan cara klik kanan di mana saja lalu pilih "Inspect", atau tekan F12. Di sana, terdapat tab bernama Console. Console adalah tempat kita "berbicara" langsung dengan mesin JavaScript untuk menguji ide-ide kecil atau melihat pesan error saat kode kita bermasalah.

1// Mengirim pesan ke tab 'Console' di Developer Tools 2console.log("Pesan ini tidak muncul di layar utama, tapi di Console."); 3console.log(10 + 20);

Perhatikan perintah console.log(). Ini adalah alat navigasi utama kita. Bayangkan ini seperti senter di dalam gua yang gelap; saat kode kita tidak berjalan sesuai keinginan, kita menggunakan console.log() untuk melihat apa yang sedang terjadi di balik layar. Pada contoh kedua, JavaScript tidak mencetak teks "10 + 20", melainkan langsung menghitung hasilnya dan mencetak 30.

Struktur File & Cara Menjalankan JavaScript

Dalam pengembangan web yang nyata, kita tidak menuliskan semua kode di dalam satu tempat. Ada dua cara utama untuk menghubungkan JavaScript dengan halaman HTML Anda:

  1. Internal JavaScript: Menuliskan kode langsung di dalam tag <script> di file HTML.
  2. External JavaScript: Menuliskan kode di file terpisah dengan ekstensi .js (misalnya app.js), lalu menghubungkannya ke HTML menggunakan atribut src.

Menggunakan file eksternal adalah best practice karena menjaga kode tetap rapi dan terorganisir. Berikut adalah contoh bagaimana struktur file JavaScript eksternal terlihat:

1// file: script.js 2 3// 1. Membersihkan layar console (opsional) 4console.clear(); 5 6// 2. Menampilkan pesan sambutan 7console.log("Aplikasi dimulai..."); 8 9/* Ini adalah contoh komentar multi-baris. 10 Baris-baris ini tidak akan dijalankan oleh komputer. 11 Gunakan ini untuk memberi catatan pada diri sendiri atau rekan tim. 12*/ 13 14console.log("JavaScript siap digunakan!");

Alur Eksekusi Baris demi Baris:

  1. Baris pertama adalah komentar satu baris yang dimulai dengan //. Komputer akan mengabaikannya sepenuhnya.
  2. console.clear() dijalankan untuk menghapus semua teks lama yang ada di Console agar tampilan bersih.
  3. console.log("Aplikasi dimulai...") mengeksekusi perintah untuk mencetak teks ke Console.
  4. Blok tengah adalah komentar multi-baris yang dibuka dengan /* dan ditutup dengan */. Ini sangat berguna untuk penjelasan yang panjang.
  5. Baris terakhir mencetak konfirmasi bahwa program telah selesai dimuat.

Satu aturan emas dalam penulisan: JavaScript sangat sensitif terhadap huruf besar dan kecil (case-sensitive). Menulis Console.log() (dengan C besar) akan menyebabkan error karena JavaScript hanya mengenali console.log() (dengan c kecil). Memahami ketelitian ini adalah langkah pertama untuk berpikir seperti seorang programmer.

Next
Syntax, Variable & Data Type