Hal pertama yang akan kita pelajari adalah blok penyusun kode.
Pernyataan adalah konstruksi sintaksis dan perintah yang melakukan tindakan.
Kita telah melihat pernyataan, alert('Hello, world!')
, yang menampilkan pesan “Halo, dunia!”.
Kita dapat memiliki pernyataan dalam kode sebanyak yang kita inginkan. Pernyataan dapat dipisahkan dengan titik koma.
Misalnya, di sini kami membagi “Halo Dunia” menjadi dua peringatan:
peringatan('Halo'); waspada('Dunia');
Biasanya, pernyataan ditulis pada baris terpisah agar kode lebih mudah dibaca:
peringatan('Halo'); waspada('Dunia');
Titik koma dapat dihilangkan dalam banyak kasus ketika ada jeda baris.
Ini juga akan berhasil:
waspada('Halo') waspada('Dunia')
Di sini, JavaScript menafsirkan jeda baris sebagai titik koma “implisit”. Ini disebut penyisipan titik koma otomatis.
Dalam kebanyakan kasus, baris baru menyiratkan titik koma. Namun “dalam banyak kasus” tidak berarti “selalu”!
Ada kalanya baris baru tidak berarti titik koma. Misalnya:
peringatan(3+ 1 + 2);
Kode menghasilkan 6
karena JavaScript tidak memasukkan titik koma di sini. Secara intuitif jelas bahwa jika baris diakhiri dengan tanda tambah "+"
, maka itu adalah "ekspresi tidak lengkap", jadi titik koma di sana akan salah. Dan dalam hal ini, itu berfungsi sebagaimana mestinya.
Namun ada situasi di mana JavaScript “gagal” menggunakan titik koma di tempat yang benar-benar diperlukan.
Kesalahan yang terjadi dalam kasus seperti ini cukup sulit ditemukan dan diperbaiki.
Contoh kesalahan
Jika Anda penasaran untuk melihat contoh nyata dari kesalahan tersebut, lihat kode ini:
peringatan("Halo"); [1, 2].forEach(peringatan);
Tidak perlu lagi memikirkan arti tanda kurung []
dan forEach
. Kami akan mempelajarinya nanti. Untuk saat ini, ingat saja hasil dari menjalankan kode: ini menunjukkan Hello
, lalu 1
, lalu 2
.
Sekarang mari kita hapus titik koma setelah alert
:
peringatan("Halo") [1, 2].forEach(peringatan);
Perbedaannya dibandingkan kode di atas hanya satu karakter: titik koma di akhir baris pertama hilang.
Jika kita menjalankan kode ini, hanya Hello
pertama yang ditampilkan (dan terjadi kesalahan, Anda mungkin perlu membuka konsol untuk melihatnya). Tidak ada angka lagi.
Itu karena JavaScript tidak menggunakan titik koma sebelum tanda kurung siku [...]
. Jadi, kode pada contoh terakhir diperlakukan sebagai satu pernyataan.
Begini cara mesin melihatnya:
peringatan("Halo")[1, 2].forEach(peringatan);
Terlihat aneh, bukan? Penggabungan seperti itu dalam kasus ini adalah salah. Kita perlu memberi tanda titik koma setelah alert
agar kode berfungsi dengan benar.
Hal ini juga dapat terjadi pada situasi lain.
Kami merekomendasikan menempatkan titik koma di antara pernyataan meskipun pernyataan tersebut dipisahkan oleh baris baru. Aturan ini banyak dianut oleh masyarakat. Mari kita perhatikan sekali lagi – titik koma bisa saja dihilangkan pada sebagian besar waktu. Namun lebih aman – terutama bagi pemula – untuk menggunakannya.
Seiring berjalannya waktu, program menjadi semakin kompleks. Penting untuk menambahkan komentar yang menjelaskan fungsi kode dan alasannya.
Komentar dapat dimasukkan ke tempat mana pun dalam skrip. Mereka tidak mempengaruhi eksekusinya karena mesin mengabaikannya.
Komentar satu baris dimulai dengan dua karakter garis miring //
.
Baris selanjutnya adalah komentar. Ini mungkin menempati satu baris penuh atau mengikuti sebuah pernyataan.
Seperti di sini:
// Komentar ini menempati baris tersendiri peringatan('Halo'); waspada('Dunia'); // Komentar ini mengikuti pernyataan tersebut
Komentar multiline dimulai dengan garis miring dan tanda bintang /*
dan diakhiri dengan tanda bintang dan garis miring */
.
Seperti ini:
/* Contoh dengan dua pesan. Ini adalah komentar multiline. */ peringatan('Halo'); waspada('Dunia');
Isi komentar diabaikan, jadi jika kita memasukkan kode ke dalam /* … */
, kode tersebut tidak akan dieksekusi.
Terkadang berguna untuk menonaktifkan sementara sebagian kode:
/* Mengomentari kode peringatan('Halo'); */ waspada('Dunia');
Gunakan tombol pintas!
Di sebagian besar editor, satu baris kode dapat dikomentari dengan menekan tombol Ctrl + / hotkey untuk komentar satu baris dan sesuatu seperti Ctrl + Shift + / – untuk komentar multibaris (pilih sepotong kode dan tekan tombol pintas). Untuk Mac, coba Cmd dari pada Ctrl dan Option dari pada Shift .
Komentar bertingkat tidak didukung!
Mungkin tidak ada /*...*/
di dalam /*...*/
yang lain.
Kode tersebut akan mati karena kesalahan:
/* /* komentar bersarang?!? */ */ peringatan('Dunia' );
Tolong, jangan ragu untuk mengomentari kode Anda.
Komentar meningkatkan jejak kode secara keseluruhan, tapi itu tidak menjadi masalah sama sekali. Ada banyak alat yang memperkecil kode sebelum dipublikasikan ke server produksi. Mereka menghapus komentar, sehingga tidak muncul di skrip yang berfungsi. Oleh karena itu, komentar sama sekali tidak berdampak negatif terhadap produksi.
Nanti di tutorialnya akan ada bab Kualitas kode yang juga menjelaskan cara menulis komentar yang lebih baik.