Dasar-dasar JavaScript. Bagian 2 Kursus JavaScript dari Pemula hingga Mahir

Ini adalah bagian kedua dari seri posting blog JavaScript yang akan membawa Anda dari pemula hingga mahir. Pada akhir seri ini, Anda akan mengetahui semua dasar yang perlu Anda ketahui untuk memulai pengkodean dalam JavaScript. Tanpa basa-basi lagi, mari kita mulai dengan tutorial kedua.

Dasar-dasar JavaScript – daftar isi:

1. Dasar-dasar JavaScript
2. Eksekusi baris demi baris
3. Dua cara untuk mengakhiri instruksi
4. Komentar

Dalam posting blog ini kita akan melanjutkan di mana kita tinggalkan dari posting blog pertama. Pada tahap ini Anda harus membuka browser Google Chrome dan lebih khusus lagi membuka konsol JavaScript Anda. Jika Anda karena alasan tertentu menutupnya, ini saat yang tepat untuk membukanya kembali. Mari mulai belajar dasar-dasar JavaScrip

Jika Anda menggunakan Mac, pintasan keyboard untuk membuka konsol adalah dengan menekan "option + command + J", setelah Anda membuka Chrome. Jika Anda menggunakan perangkat Windows, Anda dapat menggunakan pintasan keyboard "Control + Shift + J", untuk membuka Konsol JavaScript, setelah Anda membuka Chrome. Atau bisa juga masuk ke menu di atas dan masuk ke View -> Developer -> JavaScript Console.

Dasar-dasar JavaScript

JavaScript, seperti semua bahasa pemrograman lainnya, adalah bahasa yang Anda gunakan untuk berkomunikasi dengan komputer. Seperti bahasa alami yang memiliki tata bahasa dan kata-kata yang dikenal untuk membentuk kalimat yang tepat, bahasa pemrograman juga memiliki aturan tertentu yang harus Anda ikuti untuk berkomunikasi secara efektif dengan komputer.

Misalnya kata-kata tertentu berarti hal-hal tertentu untuk mesin JavaScript yang menjalankan kode kita, seperti kata kunci "peringatan" yang kita gunakan di tutorial sebelumnya memiliki arti menampilkan peringatan kepada pengguna dengan kata-kata tertentu yang mereka masukkan ke dalam tanda kurung setelahnya. . Dalam kasus kami, kami menulis "Halo, Dunia!" jadi kami mendapat peringatan yang mengatakan "Halo, Dunia!".

Ada juga kata kunci cadangan lainnya dalam JavaScript yang harus kita waspadai sehingga kita dapat berkomunikasi secara efektif dengan komputer menggunakan kata-kata dan tata bahasa yang tepat. Juga seperti tata bahasa yang kita miliki dalam bahasa alami, ada juga tata bahasa dalam bahasa pemrograman. Tata bahasa itu biasa disebut "sintaks" dalam bahasa pemrograman dan JavaScript tidak terkecuali untuk ini. Itulah mengapa ada baiknya untuk memahami kata kunci utama dan tata bahasa yang kita miliki di JavaScript saat kita mulai belajar tentang dasar-dasar JavaScript. Mari kita lihat beberapa hal utama yang harus kita ketahui tentang JavaScript.

Eksekusi baris demi baris

Ketika berbicara tentang dasar-dasar JavaScript, salah satu hal pertama yang harus Anda ketahui adalah bahwa kode yang Anda tulis akan dieksekusi baris demi baris, dari atas ke bawah. Gaya eksekusi kode ini juga disebut sebagai JavaScript sebagai "bahasa pemrograman yang ditafsirkan".

Sebaliknya beberapa bahasa pemrograman adalah "bahasa pemrograman yang dikompilasi". Beberapa contoh bahasa yang dikompilasi adalah: C, C++, C#, Swift, Java, dan seterusnya. Perbedaan utama adalah bahwa dengan bahasa pemrograman yang dikompilasi, semua kode yang Anda tulis akan "dikompilasi" dan akan dieksekusi secara utuh oleh komputer. Itu juga mengapa mungkin lebih sulit untuk mulai mempelajari bahasa pemrograman yang dikompilasi karena akan lebih sulit untuk menemukan di mana Anda membuat kesalahan dalam program Anda.

Beberapa contoh bahasa pemrograman yang ditafsirkan adalah JavaScript, Python, Bash, dan Matlab. Dengan bahasa pemrograman yang ditafsirkan, Anda memiliki manfaat bawaan untuk melihat baris apa yang Anda buat kesalahannya, misalnya melupakan titik koma atau tidak mencocokkan tanda kurung dalam kode Anda. Memiliki karakteristik ini mungkin akan membuat perbedaan besar pada aplikasi tertentu, tetapi ketika kami mencoba memuat situs web dengan koneksi internet yang lambat, Anda lebih suka agar setiap baris JavaScript dieksekusi secepat mungkin.

Dua cara untuk mengakhiri instruksi

Program komputer pada akhirnya adalah sekumpulan instruksi ke komputer. Tapi di mana satu program berakhir di mana instruksi berikutnya dimulai? Ada berbagai pendekatan untuk masalah ini. JavaScript menggunakan dua hal utama, titik koma dan tanda kurung.

Tergantung pada jenis instruksi yang kita tulis, kita umumnya akan menggunakan salah satu untuk mengakhiri atau mengemas satu set instruksi. Kami akan menggunakan tipe kurung yang berbeda untuk fungsionalitas dan tipe data yang berbeda. Misalnya, dalam peringatan(“Halo, Dunia”); kode yang kita eksekusi sebelumnya, tanda kurung yang mengelilingi tulisan hello world memberitahu komputer apa yang harus dikatakan oleh peringatan, dan titik koma di akhir instruksi memberi tahu komputer bahwa, instruksi ini berakhir di sini, Anda dapat pindah ke instruksi berikutnya. Ini sangat mirip dengan bagaimana kita menggunakan titik "." untuk mengakhiri kalimat dalam bahasa Inggris.

Komentar

Menambahkan komentar ke kode adalah bagian penting dari pemrograman. Mungkin mudah untuk memahami kode apa yang Anda tulis saat Anda menulisnya, tetapi tergantung pada kerumitan kodenya, Anda mungkin hanya memiliki sedikit gagasan enam bulan ke depan, ketika Anda kembali ke kode tersebut.

Menambahkan komentar tidak hanya membuat lebih mudah untuk memahami kode Anda untuk masa depan Anda, tetapi juga membuat lebih mudah bagi siapa saja yang bekerja dengan Anda untuk memahami kode juga. Ini juga dapat membantu Anda mengembangkan pemahaman Anda dengan lebih baik tentang masalah yang sedang Anda tangani, karena biasanya jauh lebih mudah untuk memecahkan masalah dengan membaginya menjadi potongan ukuran gigitan yang lebih kecil. Bagian kode Anda yang dikomentari akan diabaikan oleh penerjemah dan tidak akan dieksekusi.

Ada dua cara untuk menambahkan komentar yaitu JavaScipt. Yang pertama adalah menambahkan komentar "satu baris" sederhana dengan dua garis miring seperti ini:

// this is a comment

Dengan cara ini, apa pun yang Anda tulis setelah dua garis miring akan diabaikan pada baris tertentu tempat Anda meletakkan garis miring. Anda dapat mengulangi ini berkali-kali untuk memiliki beberapa baris yang ditutupi dengan komentar seperti ini:

// this is a comment.
// this is another comment.
// you can keep commenting like this.

Alasan lain mengapa kami menggunakan komentar adalah untuk mengomentari sepotong kode untuk bereksperimen dengan kode. Misalnya Anda dapat menulis fungsionalitas yang sama dalam berbagai cara dan Anda mungkin ingin mengomentari satu versi dari kode yang sama untuk membandingkan kinerja atau hasil masing-masing. Mari kita lihat itu dengan sebuah contoh juga.

Silakan salin dan tempel kode berikut ke konsol JavaScript yang Anda buka di Chrome.

// greet user
alert("Hello, User!");
alert("Hi, User!");

Jika Anda ingin latihan ekstra untuk menulis seluruh kode sendiri, Anda dapat melakukannya juga. Satu hal yang harus Anda ketahui tentang menulis beberapa baris kode di konsol adalah bahwa untuk sampai ke baris berikutnya tanpa menjalankannya, Anda dapat menekan "shift + enter" untuk melakukannya. Jika tidak, setelah menulis satu baris kode, jika Anda menekan enter, itu akan menjalankan baris kode itu. Dalam contoh ini, ini bukan masalah besar dan sebenarnya baik untuk menjalankannya baris demi baris juga, karena kami memiliki contoh sederhana yang juga dapat bekerja dengan gaya itu.

Setelah menyalin dan menempelkannya atau menulis kode sendiri, lanjutkan dan tekan "enter" untuk menjalankan kode. Hasilnya akan memberi Anda dua peringatan terpisah. Juga untuk mengabaikan peringatan, Anda dapat mengklik "OK", dalam hal ini mereka tidak akan melakukan apa pun karena ini adalah peringatan sederhana dan tidak memicu apa pun setelah menampilkan pesan yang ingin kita tampilkan.

Ketika kami mengeksekusi kode seperti ini, kami menjalankan fungsi yang sama dua kali. Tetapi apa yang harus Anda lakukan jika Anda hanya ingin melihat satu implementasi dalam satu waktu? Nah, Anda tahu persis apa yang harus dilakukan dalam kasus ini karena kita sudah membicarakannya. Silakan dan komentari salah satu baris setelah menempelkan atau menulis kode sehingga hanya implementasi kedua dari "Hai, Pengguna!" akan dieksekusi.

Setelah Anda menyelesaikan tantangan, atau jika Anda terjebak selama tantangan, Anda dapat melihat kode solusi untuk tantangan di bawah ini. Sebelum melihat solusinya, saya selalu sangat menyarankan untuk mencobanya sendiri karena Anda akan belajar yang terbaik ketika Anda benar-benar mempraktikkannya. Jika Anda berhasil menyelesaikan tantangan, Anda akan melihat layar seperti ini:

Perhatikan bahwa ketika Anda mengomentari baris kode, itu berubah menjadi warna yang sama dengan baris komentar sebelumnya. Perbedaan warna di sini sebenarnya tidak membuat perbedaan pada komputer, tetapi ini adalah fitur yang cukup membantu kita ketika kita menulis kode. Dengan cara ini akan jauh lebih mudah jika Anda salah mengomentari baris kode karena warna akan membuatnya jelas.

Cara lain untuk mengomentari kode adalah dengan menggunakan garis miring dan karakter asterisk. Dengan cara ini kita dapat membuat komentar satu baris atau banyak baris dalam kode kita.

/* a single line comment */
/* the commenting starts when we put a forward slash and an asterisk
and the commented areas ends
when we close of the comment with an asterisk and the forward slash
like this */

Sekarang Anda tahu dasar-dasar JavaScript. Dalam tutorial berikutnya, kita akan melihat konsep yang sangat umum dalam pemrograman yang disebut "variabel" bersama dengan tipe data dasar dalam JavaScript.

Pengarang: Robert Whitney

Pakar JavaScript dan instruktur yang melatih departemen TI. Tujuan utamanya adalah meningkatkan produktivitas tim dengan mengajari orang lain cara bekerja sama secara efektif saat coding.

Lihat semua posting

Kursus JavaScript Dari Pemula hingga Mahir dalam 10 posting blog:

1. Bagaimana cara memulai pengkodean dalam JavaScript?
2. Dasar-dasar JavaScript
3. Variabel dan tipe data yang berbeda dalam JavaScript
4. Cuplikan dan struktur kontrol
5. Perulangan while dan perulangan for
6. Array Jawa
7. Fungsi JavaScript
8. objek JavaScript
9. Metode JavaScript dan banyak lagi
10. Ringkasan kursus JavaScript