Tutorial JavaScript: Menulis Kode JavaScript Pertamamu

Sebelum menulis kode JavaScript pertamamu, pastikan kamu sudah tahu mengenai apa itu JavaScript dan kenapa JavaScript itu penting. JavaScript adalah bahasa pemrograman yang wajib dikuasai oleh seorang web developer. Bahasa ini awalnya digunakan untuk membuat sebuah website menjadi lebih interaktif. Dalam perkembangannya, JavaScript tidak lagi hanya digunakan pada browser, melainkan juga bisa berjalan pada server. Ini berarti JavaScript digunakan di seluruh bagian website, mulai dari front-end hingga back-end. Bahkan, kini JavaScript mulai merambah ke platform lain seperti mobile, desktop, dan game.

Tahukah kamu bahwa artikel ini diambil langsung dari salah satu sub-modul pada kelas Belajar Dasar Pemrograman JavaScript yang disusun oleh tim expert Dicoding bersama praktisi industri dan divalidasi oleh tim dari AWS (Amazon Web Services)?

Saat ini, AWS menyediakan kelas berbahasa Indonesia di bidang Back-End Developer dan disediakan secara GRATIS melalui program beasiswa Cloud and Back-End Developer Scholarship Program. Beasiswanya untuk umum, tanpa syarat, dan sepenuhnya gratis. Untuk dapat cukup daftar dan isi formulir pendaftaran singkat di aws.dicoding.com. Setelah daftar, pasti dapat!

Menulis Kode JavaScript Pertamamu

Menulis kode dalam suatu bahasa pemrograman sederhananya adalah menuliskan instruksi-instruksi untuk dijalankan oleh komputer. Kode di bawah ini merupakan instruksi bagi terminal atau konsol untuk mencatat (log) kalimat “Hello, World!”.

1	console.log(“Hello, World!”);

console.log adalah kode bawaan JavaScript untuk menampilkan pesan ke konsol, bisa berupa web konsol atau konsol dari terminal/command prompt.

Kode atau teks yang berada di dalam tanda kurung adalah pesan yang ingin ditampilkan. Pada contoh kode di atas, kita menggunakan tanda kutip (“”) untuk menandakan bahwa pesan yang ingin ditampilkan merupakan sebuah string atau teks.

💻 Mulai Belajar Pemrograman

Belajar pemrograman di Dicoding Academy dan mulai perjalanan Anda sebagai developer profesional.

Daftar Sekarang

Expression dan Statement

Expression adalah unit kode yang dapat dievaluasi menjadi suatu nilai. Untuk lebih mudahnya, perhatikan contoh kode berikut:

1 2	5; // Baris kode ini merupakan expression karena interpreter akan membaca kode ini dan menghasilkan nilai 5. 2 + 3; // Baris kode ini juga merupakan expression. Interpreter mengevaluasi kode dan juga akan menghasilkan nilai 5.

Sementara itu, statement adalah instruksi untuk melakukan sebuah aksi tertentu. Aksi ini bisa termasuk membuat variabel, melakukan perulangan, pengecekan kondisi, dll.

var yourName;

let yourAge;

const numberOfDays; // declaration statement

Yang perlu Anda ingat adalah:

Expression merupakan kode yang menghasilkan nilai.
Statement menunjukkan aksi yang dilakukan.

Comments

Kode yang kita tulis merupakan kumpulan instruksi yang harus dijalankan oleh komputer. Salah satu instruksi yang penting adalah memberi tahu komputer untuk mengabaikan perintah yang kita tulis. Instruksi yang ditulis dalam suatu program tetapi tidak dijalankan oleh komputer disebut “comments”.

Sebuah komentar akan dilewatkan oleh interpreter atau compiler, sehingga tidak akan memengaruhi alur program yang kita tulis. Komentar ini bisa digunakan sebagai dokumentasi atau penjelasan dari kode yang kita tulis.

Terdapat dua metode untuk memberikan komentar. Pertama, untuk memberikan komentar pada satu baris saja, kita bisa gunakan tanda dua garis miring (//) di awal baris.

// Ini merupakan komentar satu baris, kode di bawah tidak akan dijalankan

// console.log("Halo!");

Ketika kode di atas jalankan maka tidak akan muncul output Halo!

Lalu, untuk memberikan komentar lebih dari satu baris kita bisa menggunakan tanda /* sebagai pembuka komentar dan tanda */ untuk penutup komentar. Teks apa pun yang berada di antara tanda tersebut akan dijadikan komentar dan tidak akan dieksekusi.

/* Ini merupakan komentar dengan lebih dari satu baris

Teks apapun yang berada disini akan dijadikan komentar.

Ketika menggunakan ini, jangan lupa untuk menutupnya.

Variable

Ketika menulis sebuah program, kita memberi tahu komputer cara memproses informasi seperti mencetak teks ke layar atau melakukan operasi perhitungan. Untuk lebih mudah dalam penggunaan dan pemanggilan data, kita bisa memanfaatkan variabel. Variabel umumnya digunakan untuk menyimpan informasi atau nilai yang akan dikelola dalam sebuah program.

Pada JavaScript setidaknya ada tiga cara untuk mendeklarasikan sebuah variabel, yaitu menggunakan keyword var, let, dan const. Pada versi ECMAScript 2015 (ES6) dikenalkan deklarasi variabel dengan let dan const untuk menggantikan var yang dinilai kontroversial dan rawan menimbulkan bug.

Sekarang bagaimana caranya membuat sebuah variabel dalam JavaScript? Cukup mudah. Ketikkan keyword let yang diikuti dengan nama variabelnya.

1	let lastName;

Kode untuk mendeklarasikan variabel seperti di atas juga dikenal dengan declaration statement.

Selanjutnya, Anda bisa mengisi nilai variabel di atas menggunakan tanda sama dengan (=).

let lastName;

lastName = "Kurniawan";

console.log(lastName);

Jika kode di atas dijalankan maka akan muncul output Kurniawan.

Anda juga bisa langsung menginisialisasi nilai variabel setelah mendeklarasikannya seperti berikut:

let lastName = "Kurniawan";

console.log(lastName);

Jika kode di atas dijalankan maka akan muncul output Kurniawan.

Kode untuk menginisialisasikan nilai ke dalam sebuah variabel dengan tanda sama dengan (=) ini disebut dengan assignment expression.

Kita kembali bertemu dengan istilah statement dan expression. Karena expression pasti menghasilkan nilai, sehingga mereka bisa muncul di mana pun dalam program JavaScript. Sementara itu, statement merujuk pada aksi. Sehingga, pada bagian kode tertentu yang membutuhkan nilai tidak bisa kita isi dengan sebuah statement. Contohnya seperti kode berikut:

1	let fullName = let lastName;

Kode di atas error karena let lastName adalah sebuah statement untuk deklarasi variabel. Statement tidak bisa berada di posisi expression.

1	let fullName = (lastName = “Kurniawan”);

Kode di atas tidak error karena (lastName = “Kurniawan”) merupakan expression.

1	let fullName = "Kurniawan" + "Widodo";

Kode di atas tidak error karena “Kurniawan” + “Widodo” juga merupakan expression.

Melalui contoh kode di atas, kita bisa bayangkan variabel sebagai sebuah kotak atau wadah yang menyimpan nilai. Proses inisialisasi atau assignment berarti kita memasukkan nilai ke dalam kotak tersebut.

Setiap variabel memiliki nama yang dapat kita panggil dan gunakan. Kita dapat menamai variabel dengan nama apa pun, tetapi pastikan penamaannya masih masuk akal dengan konteksnya supaya kode mudah di-maintenance.

Sebaiknya hindari penamaan variabel dengan istilah umum seperti “data”. Gunakanlah penamaan variabel yang dapat mendeskripsikan nilai dari variabel itu sendiri. Berikut beberapa aturan dalam penamaan variabel yang perlu Anda ketahui:

Harus dimulai dengan huruf atau underscore (_).
Dapat terdiri dari huruf, angka, dan underscore (_) dengan berbagai kombinasi.
Tidak boleh mengandung spasi (whitespace). Jika penamaan variabel lebih dari dua kata, tuliskan secara camelCase. Contoh firstName, lastName, catName, dll.
Tidak boleh mengandung karakter spesial (! . , / \ + * = dll.)

Lalu, bagaimana dengan const? Const merupakan kependekan dari constant. Artinya, kita akan mendeklarasikan sebuah variabel dengan const ketika ingin variabel bernilai konstan dan tidak bisa diubah setelah diinisialisasi nilainya. Bayangkan variabel bernilai const sebagai sebuah kotak yang ditutup dan disegel setelah diisi, sehingga nilainya tidak bisa diubah lagi.

Komponen Lain pada JavaScript

Bagaimana menurut Anda? Masih banyak komponen lain yang perlu dipelajari seperti Data Type, Operator, If/Else Statement, Switch Case Statement, Loop, dan sebagainya. Untuk komponen-komponen ini akan di bahas di lain waktu, atau kamu bisa langsung belajar sepenuhnya di kelas Belajar Dasar Pemrograman JavaScript. Kelas ini merupakan bagian dari alur belajar (learning path) Back-End Developer yang disusun bersama Amazon Web Services beserta pelaku industri lainnya. Jika kamu butuh beasiswa untuk mendapatkan akses ke learning path tersebut, silakan daftar di program Cloud and Back-End Developer Scholarship.

Tutorial JavaScript: Menulis Kode JavaScript Pertamamu – end