Pengantar Mengarungi Lautan Sintaksis
- Get link
- X
- Other Apps
Pengantar Mengarungi Lautan Sintaksis
Persiapkan jari-jemarimu karena kita akan mulai menjelajahi luasnya lautan sintaksis dalam JavaScript.
Pada modul sebelumnya, Anda telah diperkenalkan dengan JavaScript dan secara singkat memahami istilah-istilah dalam pemrograman, tujuan dari pemrograman, serta platform-platform yang mendukung bahasa JavaScript. Mulai dari modul ini hingga seterusnya, kita akan menulis kode JavaScript dan membuat program pertama menggunakan bahasa tersebut.
Dalam pembelajaran bahasa pemrograman, pemahaman aturan penulisan menjadi hal yang sangat penting. Pada modul ini, fokus kita adalah mempelajari sintaksis dan konsep dasar dalam JavaScript, seperti expression dan statement, tipe data, variabel, operator, serta komentar.
Pada akhir modul ini, Anda diharapkan dapat melakukan hal berikut.
- Menjelaskan bagian expression dan statement dalam sebuah kode JavaScript.
- Mengategorikan sebuah data berdasarkan tipenya dalam JavaScript.
- Menganalisis penggunaan sintaksis yang tepat untuk membuat sebuah variabel yang efektif berdasarkan sebuah skenario.
- Menerangkan struktur dari penggunaan unary, binary, dan ternary.
- Mengubah suatu data dari tipe ke tipe lain dengan cara yang rasional.
- Mendemonstrasikan cara menulis komentar dalam JavaScript.
Expression dan Statement
Pemrograman pada dasarnya adalah cara kita berkomunikasi dengan komputer. Komunikasi ini melibatkan pemberian instruksi kepada komputer agar menjalankan tugas-tugas tertentu dengan benar. Tentu saja, kita perlu mengikuti aturan tertentu untuk memberikan instruksi kepada komputer.
Instruksi yang diberikan kepada komputer berhubungan erat dengan proses komputasi. Oleh karena itu, instruksi tersebut haruslah jelas, terstruktur, dan sistematis. Contoh instruksi yang umum dilakukan pada komputer sebagai berikut.
- Instruksi 1: buat variabel bernama
agedan berikan nilai 10. - Instruksi 2: buat variabel bernama
namedan berikan nilai “Dicoding”. - Instruksi 3: cetak teks “Aku [name], umurku [age] tahun.”, [name] diambil dari nilai variabel
namedan [age] diambil dari nilai variabelage.
Dari contoh di atas, ada tiga instruksi yang harus dilakukan oleh komputer. Jika kita tuliskan instruksi tersebut dalam bahasa pemrograman JavaScript, kodenya akan seperti ini.
const age = 10;const name = 'Dicoding';console.log(`Aku ${name}, umurku ${age} tahun.`);Catatan
Jangan khawatir dahulu jika ada kata atau sintaks yang belum Anda pahami di atas. Anda akan memahaminya seiring mengikuti materi dalam modul ini. Untuk sekarang, cobalah lihat hasil dari kode di atas dengan menekan tombol “Jalankan”.
Contoh kode di atas terdiri dari tiga baris kode. Pada pemrograman, satu instruksi umumnya ditulis dalam satu baris kode. Jadi, tiga instruksi umumnya ditulis dalam tiga baris kode. Istilah yang digunakan untuk "instruksi" dalam bahasa pemrograman adalah "statement".
Namun, penting untuk dicatat bahwa dalam bahasa pemrograman, tidak selalu satu baris hanya memiliki satu statement. Kita dapat menuliskan beberapa statement dalam satu baris kode sekaligus, seperti pada contoh berikut.
- const age = 10; const name = 'Dicoding'; console.log(`Aku ${name}, umurku ${age} tahun.`);
Penentuan akhir dari sebuah statement biasanya ditandai dengan tanda titik koma (;). Oleh karena itu, kita dapat menulis banyak statement dalam satu baris.
Bisa disimpulkan bahwa statement adalah instruksi yang akan dieksekusi oleh komputer.
Selain statement, ada istilah lain yang penting untuk diketahui, yaitu expression. Ini merupakan bagian dari sebuah statement yang menghasilkan nilai. Setiap statement biasanya mengandung setidaknya satu expression. Contoh, expression dalam kode di atas adalah nilai age 10, teks “Dicoding”, dan teks “Aku Dicoding, umurku 10 tahun.”.
Berikut adalah ilustrasi yang bisa Anda lihat untuk memudahkan pemahaman mengenai bagian expression pada statement.
Expression dapat berupa hal-hal yang menghasilkan nilai, tidak hanya nilai statis, seperti angka 10 atau teks “Dicoding”. Namun, hasil operasi matematika seperti 4 + 4 yang akan menghasilkan nilai 8 atau penggabungan teks seperti “Dicoding” + “ “ + “Indonesia” yang akan menghasilkan teks “Dicoding Indonesia” juga merupakan sebuah expression.
Memahami istilah-istilah ini dalam struktur kode JavaScript sangatlah penting, baik dalam proses pembelajaran maupun pengembangan aplikasi nyata. Salah satu manfaat utamanya adalah ketika Anda menghadapi pesan error dari interpreter JavaScript yang sering menggunakan istilah statement atau expression dalam pesan error-nya.
Comment
Kita sudah mengetahui bahwa kode yang kita tulis dianggap sebagai instruksi dan interpreter akan menjalankan instruksi tersebut. Namun, dalam menulis kode, kita sering sekali menyisipkan sebuah catatan. Kita tidak ingin catatan tersebut ikut tereksekusi oleh interpreter. Pada kondisi ini, kita bisa menyisipkan catatan dalam bentuk komentar.
Komentar adalah teks bersifat penjelasan yang dapat dibaca oleh programmer dan ditulis dalam berkas kode. Pada JavaScript, untuk menuliskan teks komentar, ada dua cara, yaitu menggunakan tanda // dan /* */. Teks yang ditulis dengan tanda tersebut dianggap bukan instruksi dan tidak akan dijalankan oleh interpreter.
Berikut adalah contoh komentar yang ditulis dengan tanda //.
// Teks ini akan diabaikan oleh interpreterconsole.log('Hai, Readers!');console.log('Hai, JavaScript!');// console.log('Hai, Dicoding!');Jika Anda jalankan kode di atas, hanya akan tampil teks "Hai, Readers!” dan “Hai, JavaScript!”. Kode yang ditulis pada baris pertama dan terakhir akan diabaikan karena dianggap sebagai komentar.
Berikut adalah contoh dari komentar yang ditulis dengan tanda /* */.
/* * TODO * 1. Buatlah variabel bernama `PI` dan isikan dengan nilai 3.14 * 2. Cetak nilai variabel PI di terminal menggunakan console.log */const PI = '3.14';console.log(PI);Tanda /* */ memudahkan kita untuk menuliskan komentar lebih dari satu baris. Pasalnya, teks apa pun (termasuk baris baru) yang ditulis di antara tanda /* dan diakhiri dengan tanda */ akan dianggap sebagai komentar. Hal ini berbeda dengan tanda // yang tidak mendukung baris baru.
Maka dari itu, tanda // biasanya disebut dengan single line comment, sedangkan tanda /* */ disebut dengan multi line comment.
Variabel
Variabel adalah wadah untuk menampung sebuah nilai. Nilai yang ditampung dapat berupa angka, teks, atau apa pun yang menghasilkan nilai (expression). Pada JavaScript, kita bisa membuat variabel melalui dua cara, yakni dengan sintaksis const dan let.
Berikut adalah contoh cara membuat variabel dengan menggunakan const dan let.
const id = 123;let username = 'Dicoding';console.log(id); // output: 123console.log(username); //output: DicodingKode di atas merupakan contoh membuat variabel. Pada contoh tersebut, variabel bernama id dibuat menggunakan const dan variabel bernama username dibuat dengan let.
Perbedaan dari variabel yang dibuat dengan const dan let adalah variabel yang dibuat dengan const tidak dapat diinisialisasi ulang (sederhananya, diubah) nilainya, sedangkan jika variabel dibuat dengan let, kita bisa menginisialisasi ulang nilainya.
Bayangkan const seperti nomor telepon darurat, misalnya nomor 911. Nomor ini selalu sama dan tidak berubah untuk menjaga konsistensi dan keandalan dalam keadaan darurat. Demikian pula, variabel yang dideklarasikan dengan const tidak dapat diubah setelah diinisialisasi. Nomor darurat adalah sesuatu yang tidak Anda ingin ubah, sama halnya dengan const dalam kode Anda.
Sementara itu, bayangkan let seperti papan tulis di ruang kelas. Anda dapat menulis sesuatu di papan tulis, dan jika perlu, Anda bisa menghapus dan menuliskan sesuatu yang baru. Dengan cara yang sama, variabel yang dideklarasikan dengan let dapat diubah atau diperbarui nilainya setelah inisialisasi pertama.
Contoh, ketika membuat variabel dengan let, Anda bisa mengubah nilai yang ada di dalamnya setelah variabel tersebut dibuat.
let username = 'Dicoding';console.log('Sebelum diubah:', username); // output: Sebelum diubah: Dicodingusername = 'dicodingacademy';console.log('Setelah diubah:', username); // output: Setelah diubah: dicodingacademyNamun, ketika Anda membuat variabel dengan const, nilai yang ditetapkan ketika variabel dibuat, tidak bisa diubah. Jika Anda coba untuk mengubahnya, program akan terhenti dan menghasilkan error.
const username = 'Dicoding';console.log('Sebelum diubah:', username); // output: Sebelum diubah: Dicodingusername = 'dicodingacademy'; // TypeError: Assignment to constant variable. console.log('Setelah diubah:', username); // Tidak akan pernah dieksekusiVariabel yang dibuat dengan const juga umum disebut sebagai constant (konstan) karena dalam matematika istilah tersebut memiliki arti tetap atau tidak berubah-ubah.
Perhatian
Perubahan nilai yang tidak terduga menjadi salah satu akar permasalahan yang sering terjadi dalam pemrograman. Oleh sebab itu, kami rekomendasikan untuk selalu membuat variabel dengan const jika memang variabel tersebut tidak direncanakan untuk diubah nilainya.
Aturan Penamaan Variabel
Dalam membuat variabel, kita tidak bisa memberikan nama secara sembarang. Ada aturan yang perlu kita taati. Berikut adalah beberapa aturan dalam penamaan variabel pada JavaScript.
Tidak Boleh Memberikan Nama yang Sama dalam Cakupan yang Sama
Nama variabel haruslah unik dalam cakupannya. Anda tidak bisa menggunakan nama yang sama dengan variabel yang sudah terdefinisi sebelumnya.
Berikut adalah contoh kode yang akan menghasilkan error karena memberikan nama variabel yang sudah terdefinisi sebelumnya.
- // Company data
- const name = 'Dicoding';
- const legal = 'LLC';
- // Employee data
- const name = 'John'; // SyntaxError: Identifier 'name' has already been declared
- const division = 'IT';
Anda boleh menggunakan nama variabel yang sama selama cakupannya berbeda, contohnya variabel yang berada dalam sebuah fungsi berbeda.
- function printCompanyInfo() {
- const name = 'Dicoding'; // <- nama variabel sama
- const legal = 'LLC';
- console.log('Company name:', name);
- console.log('Legal type:', legal);
- }
- function printEmployeeInfo() {
- const name = 'John'; // <- nama variabel sama
- const division = 'IT';
- console.log('Employee name:', name);
- console.log('Division:', division);
- }
- printCompanyInfo();
- printEmployeeInfo();
Catatan
Kita akan membahas tentang cakupan dan fungsi pada modul terpisah.
Nama Variabel Hanya Terdiri dari Karakter Tertentu
Nama variabel tidak boleh mengandung karakter selain huruf, angka, garis bawah (underscore), dan tanda dolar. Berikut adalah contoh penamaan variabel yang benar dan salah.
- // nama variabel yang benar
- const firstName = 'Fulan';
- const last_name = 'Lestari';
- const $message = 'Hello, World!';
- const userId1 = 123;
- const userId2 = 456;
- // nama variabel yang salah
- const first-name = 'Fulan'; // tidak boleh mengandung karakter -
- const last name = 'Lestari'; // tidak boleh mengandung spasi
- const @message = 'Hello, World!'; // tidak boleh mengandung karakter @
- // ..dan lain-lain
Nama Variabel Tidak Boleh Diawali dengan Angka
Walau angka boleh digunakan dalam penamaan variabel, tetapi jika nama variabel diawali dengan angka, nama tersebut dianggap salah. Berikut contohnya.
- // nama variabel yang benar
- const firstName = 'Fulan';
- const _secondName = 'Fulana';
- // nama variabel yang salah karena diawali dengan angka
- const 1stName = 'Fulan';
- const 2ndName = 'Fulana';
Tipe Data
Nilai yang dihasilkan dari sebuah expression dapat disebut juga sebagai data. Dalam pemrograman, data adalah elemen dasar yang sering kita simpan dan olah untuk membuat instruksi atau statement. Agar kita dapat menggunakan dan mengelola data dengan baik, penting untuk memahami berbagai tipe data yang ada, terutama pada JavaScript.
Pada materi ini, kita akan membahas tipe data dasar atau yang lebih dikenal sebagai tipe data primitif. Dalam JavaScript, ada tipe data primitif yang penting untuk diketahui, yaitu string, number, boolean dan nilai kosong (null dan undefined).
Mari kita bahas satu per satu tipe data tersebut.
String
String adalah tipe data yang merepresentasikan teks. Data seperti nama, alamat, atau email adalah contoh data yang dikelola dalam bentuk string. Dalam JavaScript, nilai string diapit oleh tanda kutip. Ada tiga jenis tanda kutip yang dapat digunakan untuk membuat nilai string, yaitu petik tunggal (single quote), petik ganda (double quote), dan backticks (tanda backtick).
- "Ini merupakan contoh string di JavaScript"
- 'Ini merupakan contoh string di JavaScript'
- `Ini merupakan contoh string di JavaScript`
Anda bisa menggunakan salah satu dari ketiga tanda kutip tersebut untuk membuat nilai string, asalkan tanda kutip pembuka dan penutupnya sama.
Hampir semua karakter dapat ditulis langsung di antara tanda kutip. Namun, ada beberapa karakter yang memerlukan penanganan khusus, seperti baris baru (karakter yang terbentuk ketika Anda menekan tombol Enter). Baris baru hanya bisa dituliskan secara langsung ketika Anda menggunakan backticks. Untuk tanda kutip tunggal atau ganda, kita harus menggunakan notasi \n.
- "Baris pertama.\nBaris kedua."
- 'Baris pertama.\nBaris kedua.'
- `Baris pertama.
- Baris kedua.`
Backticks sering disebut juga sebagai template literals karena memungkinkan kita menyisipkan JavaScript expressions untuk membentuk nilai string menggunakan notasi ${}.
const currentYear = new Date().getFullYear();const text = `Sekarang adalah tahun ${currentYear}.`;console.log(text);Dengan memahami penggunaan string serta template literals, Anda dapat mengelola teks dalam JavaScript lebih efektif dan fleksibel.
Number
Semua data berupa angka direpresentasikan dalam tipe data number, baik itu bilangan bulat maupun pecahan. Untuk membuat nilai number, kita cukup menuliskan angkanya secara langsung tanpa menggunakan tanda khusus. Berikut adalah contoh nilai number dalam JavaScript.
- 40
- 3.14
- 5
- 3.333
Selain angka normal, tipe data number juga memiliki nilai spesial, yaitu Infinity dan NaN. Nilai Infinity dihasilkan ketika kita melakukan operasi aritmetika yang tidak terdefinisi, seperti membagi sebuah nilai dengan nol. Contohnya kode di bawah ini.
Adapun nilai NaN (Not-a-Number) dihasilkan ketika nilai non-numerik diubah ke tipe data number. Contohnya ketika kita mencoba mengonversi string yang bukan angka menjadi number.
Kita akan membahas lebih detail tentang konversi antar tipe data setelah mengenal seluruh tipe data yang ada.
Boolean
Boolean adalah tipe data yang hanya memiliki dua nilai: true dan false. Boolean umumnya digunakan untuk merepresentasikan “ya” atau “tidak”, “ya” adalah true dan “tidak” adalah false.
Untuk membuat nilai boolean, kita bisa menuliskan true atau false secara langsung. Contohnya seperti kode di bawah ini.
const completed = true;const passed = false;console.log(completed, passed); // output: true falseNilai boolean juga biasa diperoleh dari hasil penggunaan operator perbandingan.
const isGreater = 5 > 2;console.log(isGreater); // output: true (5 lebih besar dari 2)Dengan memahami cara kerja boolean, kita dapat menggunakan tipe data ini untuk membuat logika pemrograman yang lebih efektif dan efisien.
Nilai Kosong
JavaScript memiliki dua nilai spesial yang merepresentasikan nilai kosong, yaitu null dan undefined. Keduanya digunakan untuk menunjukkan ketiadaan nilai (the absence of something).
Null banyak diadopsi dalam berbagai bahasa pemrograman sebagai tipe data standar untuk menunjukkan nilai yang tidak ada. Untuk membuat null, kita cukup menulis sintaksis null.
- biarkan pesan = null;
- console.log(message); // output: null
Adapun undefined hadir dalam JavaScript sebagai nilai implisit ketika kita mendeklarasikan variabel tanpa menginisialisasi dengan nilai apa pun.
- biarkan pesan;
- console.log(message); // output: undefined
Secara teknis, kita juga bisa secara eksplisit memberikan nilai undefined ke dalam sebuah variabel.
- biarkan pesan = tidak terdefinisi;
- console.log(message); // output: undefined
Namun, hal ini tidak disarankan. Sebaiknya, gunakan null jika berniat untuk memberikan nilai kosong secara eksplisit.
Sekilas, null dan undefined terlihat sama, tetapi sebenarnya mereka berbeda. Perbedaan ini dapat terlihat lebih jelas ketika kita membandingkan objek yang propertinya bernilai null dan undefined dalam format JSON.
const name1 = { first: 'Dicoding', last: null };const name2 = { first: 'Dicoding', last: undefined };console.log(JSON.stringify(name1)); // output: {"first":"Dicoding","last":null}console.log(JSON.stringify(name2)); // output: {"first":"Dicoding"}Properti yang diberi nilai undefined tidak akan tampak ketika diubah ke JSON karena JSON tidak mendukung tipe data undefined. Oleh karena itu, null lebih standar untuk menunjukkan nilai kosong.
Mengubah Nilai Antar Tipe Data
Saat mengelola sebuah data dalam JavaScript, seringkali kita perlu mengubah nilai dari satu tipe data ke tipe data lain. Proses ini sangat penting karena dalam berbagai situasi, kita perlu menyesuaikan tipe data dengan konteks atau kebutuhan tertentu, baik untuk keperluan perhitungan, perbandingan, maupun manipulasi data.
JavaScript adalah bahasa pemrograman yang dinamis dan fleksibel, ia menyediakan berbagai cara untuk mengonversi tipe data. Konversi tipe data dapat dilakukan secara eksplisit oleh developer atau secara implisit oleh interpreter. Memahami cara konversi tipe data penting agar dapat menulis kode yang efisien, efektif, dan bebas dari kesalahan.
Konversi Eksplisit
Konversi eksplisit adalah cara yang paling dapat diandalkan untuk mengubah tipe data karena dilakukan dengan instruksi yang jelas, alias eksplisit dari programmer. Berikut adalah beberapa metode umum yang digunakan untuk konversi tipe data secara eksplisit.
Mengubah ke String
Untuk mengubah suatu tipe data ke bentuk string umumnya dapat dilakukan dengan dua cara, yaitu menggunakan fungsi String() dan method .toString(). Berikut adalah contoh dari penggunaan kedua cara tersebut.
const number = 123;const boolean = true;const strNumber = String(number);const strBoolean = boolean.toString();console.log(strNumber); // output: "123"console.log(strBoolean); // output: "true"Ketika ingin mengubah nilai menjadi string menggunakan String(), Anda harus memberikan nilai yang akan diubah di antara tanda kurung.
Adapun toString() adalah method yang tersedia dalam beberapa tipe data (salah satunya boolean) yang digunakan untuk mengembalikan nilai string berdasarkan nilai referensinya.
Mengubah ke Number
Secara umum, untuk mengubah bentuk numerik, seperti “10”, “3.14” dapat dilakukan dengan menggunakan fungsi Number(). Berikut contoh penggunaannya.
const strNumber = '123';const strFloat = '3.14';const boolean = true;const numFromString = Number(strNumber);const floatFromString = Number(strFloat);const numFromBoolean = Number(boolean);console.log(numFromString); // output: 123console.log(floatFromString); // output: 3.14console.log(numFromBoolean); // output: 1Catatan
Dalam number, nilai boolean direpresentasikan dengan angka 1 dan 0. Boolean true akan diubah menjadi 1, sedangkan false diubah ke 0.
Selain dengan fungsi Number(), ada juga cara yang lebih spesifik, seperti fungsi parseInt() dan parseFloat().
Fungsi parseInt() digunakan untuk mengonversi string menjadi bilangan bulat (integer). Fungsi ini memiliki kemampuan untuk membaca karakter satu per satu. Ketika menemukan karakter yang tidak bisa diubah menjadi angka, proses konversi terhenti di sana. Dengan kemampuan ini, parseInt() dapat digunakan untuk mengubah nilai string, seperti "20CM", "64px", atau angka dengan satuan lainnya.
const cm = '20cm';const px = '64px';const intFromCM = parseInt(cm);const intFromPX = parseInt(px);console.log(intFromCM); // output: 20console.log(intFromPX); // output: 64Adapun fungsi parseFloat() digunakan untuk mengonversi string menjadi angka desimal (floating-point number). Sama seperti parseInt(), fungsi ini juga memiliki kemampuan membaca karakter string satu per satu sehingga dapat mengubah numerik yang mengandung satuan.
const cm = '20.55cm';const px = '64.23px';const floatFromCM = parseFloat(cm);const floatFromPX = parseFloat(px);console.log(floatFromCM); // output: 20.55console.log(floatFromPX); // output: 64.23Mengubah ke Boolean
Untuk mengubah suatu nilai ke tipe data boolean, kita bisa gunakan fungsi Boolean(). Sama seperti fungsi sebelumnya, kita cukup memberikan nilai yang akan diubah di antara tanda kurung. Berikut adalah contoh penggunaan fungsi Boolean().
const number = 123;const string = 'Dicoding';const empty = null;const boolFromNumber = Boolean(number);const boolFromString = Boolean(string);const boolFromNull = Boolean(empty);console.log(boolFromNumber); // output: trueconsole.log(boolFromString); // output: trueconsole.log(boolFromNull); // output: falseSebagaimana yang sudah kita ketahui bahwa boolean hanya memiliki dua nilai, yaitu true dan false. Jadi seluruh nilai jika dikonversikan dalam boolean kemungkinan nilainya hanya ada dua, yaitu true dan false. Seluruh nilai yang dikonversi dalam boolean menghasilkan true disebut nilai truthy, sedangkan sebaliknya disebut dengan falsy.
Hampir seluruh nilai yang ada sifatnya truthy, hanya segelintir nilai yang sifatnya falsy. Berikut adalah daftar nilai falsy dalam JavaScript.
- false
- 0
- -0
- 0n
- ''
- null
- undefined
- NaN
Konversi Implisit
Konversi implisit terjadi ketika JavaScript secara otomatis mengubah tipe data tanpa instruksi eksplisit dari programmer. Ini biasanya terjadi dalam konteks tertentu, seperti operasi aritmetika, perbandingan, dan konteks logika. Meskipun konversi implisit bisa sangat berguna dan menghemat penulisan kode, penting untuk memahami alasan hal ini terjadi untuk menghindari bug dan perilaku yang tidak terduga dalam kode.
Berikut adalah beberapa contoh konversi implisit yang sering terjadi dalam berbagai konteks.
const age = 20;const message = 'Umurku: ' + age;console.log(message); // output: Umurku: 20Dalam contoh ini, tipe data number (age) secara otomatis dikonversi menjadi string karena operator + digunakan untuk penggabungan string.
const strNumber = '123';const result = strNumber * 2;console.log(result); // output: 246Dalam contoh ini, strNumber (yang merupakan string) dikonversi menjadi number karena operator * digunakan untuk operasi aritmetika.
Contoh lain dalam penggunaan operasi aritmetika yang mengubah nilai boolean menjadi number.
Operator
Kami yakin Anda tahu simbol seperti + atau - yang sering digunakan untuk melakukan operasi matematika. Ketahuilah bahwa simbol tersebut adalah sebuah operator. Faktanya, operator termasuk hal penting yang perlu diketahui agar Anda dapat melakukan operasi-operasi dalam membuat sebuah program. Dalam materi kali ini, kita akan membahas jenis-jenis operator yang umum digunakan pada JavaScript.
Sebelum mengenal lebih detail jenis-jenis operator yang ada, mari kita ketahui dulu dua istilah penting dalam melakukan sebuah operasi, yakni operator dan operand (operan).
- Operator merupakan sebuah simbol atau teks yang digunakan untuk melakukan sebuah operasi, misalnya aritmetika, penugasan, logika, tipe data, atau operasi lain yang berhubungan dengan pemrograman.
- Operan adalah nilai yang menjadi target dari sebuah operasi.
Sebagai contoh, ada sebuah operasi aritmetika 5 + 4. Operatornya adalah simbol + serta operannya adalah 5 dan 4. Mudah, kan? Simak ilustrasi di bawah ini agar dapat membedakannya.
Secara umum, operator dalam JavaScript terbagi menjadi tiga kelompok: unary, binary, dan ternary. Pengelompokan ini berdasarkan jumlah operan yang diperlukan untuk menggunakan suatu operator.
Operator aritmetika, seperti + termasuk dalam kelompok operator binary karena membutuhkan dua operan. Sementara itu, operator tipe data, seperti typeof adalah operator unary karena hanya memerlukan satu operan. Adapun operator ternary tentu saja membutuhkan tiga operan.
Berikut adalah contoh kode yang menunjukkan penggunaan unary, binary, dan ternary operator.
- misalkan usia = 25;
- // Operator unary
- jenis usia;
- // Operator biner
- 5 + 4;
- 10 / 2;
- usia = 30;
- // Operator ternary (operator kondisional)
- (usia < 18) ? 'Kamu terlalu muda!' : 'Selamat datang!';
Sudah jelas mengenai istilah operator dan operan beserta pengelompokan operator unary, binary, dan ternary? Jika sudah, mari kita mengenal berbagai operator yang ada dalam JavaScript.
Assignment Operator
Operator penugasan atau assignment operator adalah operator yang digunakan untuk memberikan nilai kepada sebuah variabel, baik inisiasi nilai baru maupun mengubah nilai yang sudah ada. Operator ini ditulis dengan simbol sama dengan (=). Operator penugasan termasuk dalam kategori binary operator karena membutuhkan dua operan, yaitu variabel di sisi kiri dan nilai yang akan diberikan di sisi kanan. Operator ini ditulis di antara kedua operan.
Inilah contoh penggunaan untuk inisiasi nilai.
- // Digunakan untuk menginisiasi nilai
- const name = 'Dicoding';
- let location = 'Bandung';
Adapun berikut adalah contoh penggunaan untuk mengubah nilai.
- // Digunakan untuk mengubah nilai
- location = 'Jakarta';
Arithmetic Operator
Operator aritmetika adalah operator standar yang digunakan untuk proses aritmetika, seperti penambahan (+), pengurangan (-), pengalian (*), ataupun pembagian (/). Selain operasi standar yang kami sebutkan, JavaScript juga mendukung beberapa operasi aritmetik yang bisa Anda lihat pada tabel di bawah ini.
| Operator | Deskripsi | Notasi | Contoh |
|---|---|---|---|
Sisa bagi atau Modulus (%) | Binary operator yang mengembalikan sisa hasil bagi operan kiri dan operan kanan. | operan1 % operan2 | 12 % 5 mengembalikan 2. 10 % 5 mengembalikan 0. 14 % 3 mengembalikan 2. |
Increment (++) | Unary operator yang digunakan untuk menambahkan satu nilai terhadap operan yang diberikan. Operan harus berupa variabel yang dapat diubah nilainya. Jika operator ini digunakan sebelum operan (++x), ia akan mengembalikan nilai x yang telah ditambahkan 1. Jika operator ini digunakan setelah operan (x++), ia akan mengembalikan nilai x yang belum ditambahkan 1. | ++operan; atau operan++; | Jika x adalah 3, ++x mengubah x menjadi 4 dan operasi mengembalikan 4. Jika x adalah 3, x++ operasi mengembalikan 3. Setelah itu, mengubah x menjadi 4. |
Decrement (--) | Sama seperti increment, tetapi alih-alih menambahkan, ia mengurangi nilai satu. | --operan; atau operan--; | Jika x adalah 3, --x mengubah x menjadi 2 dan operasi mengembalikan 2. Jika x adalah 3, x-- operasi mengembalikan 3. Setelah itu, mengubah x menjadi 2. |
Eksponensial atau Pangkat (**) | Binary operator yang menghitung x (basis) dengan pangkat y (eksponen). Bentuk matematika: x ^ y. | operan1 ^ operan2 | 2 ** 3 mengembalikan 8. 10 ** 2 mengembalikan 100. |
Berikut adalah contoh kode yang menunjukkan berbagai penggunaan operator aritmetika dalam JavaScript.
- 6 + 5; // mengembalikan 11
- 7 - 2; // mengembalikan 5
- 8 * 5; // mengembalikan 40
- 10 / 3; // mengembalikan 3.33
- 10 % 2; // mengembalikan 0
- 2 *(10 + 2); // mengembalikan 24
Catatan
Tanda kurung dalam operasi aritmetika menentukan urutan operasi yang dijalankan. Operasi yang diberi tanda kurung akan dikalkulasi terlebih dulu. Hal ini juga merupakan aturan umum dalam bidang matematika.
Comparison Operator
Operator perbandingan adalah operator yang digunakan untuk membandingkan dua nilai dan mengembalikan nilai boolean (true atau false) sebagai hasil perbandingan. Salah satu penggunaan operator perbandingan adalah ketika kita berhadapan dengan skenario “Apakah x lebih besar dari y?” dan mendapatkan hasil dalam bentuk “Ya” atau “Tidak”.
Berikut adalah daftar operator perbandingan yang tersedia dalam JavaScript.
| Operator | Deskripsi | Notasi | Contoh |
|---|---|---|---|
Sama (==) | Membandingkan dua operan, tanpa memperhatikan tipe data. Jika nilai kedua operan dianggap sama, operasi akan mengembalikan true, sebaliknya false. | operan1 == operan2 | 1 == 1 mengembalikan true. 1 == '1' mengembalikan true. 2 == 6 mengembalikan false. 'Dicoding' == 'dicoding' mengembalikan false. |
Tidak Sama (!=) | Membandingkan dua operan, tanpa memperhatikan tipe data. Jika nilai kedua operan dianggap tidak sama, operasi akan mengembalikan true, sebaliknya false. | operan1 != operan2 | 1 != 1 mengembalikan false. 1 != '1' mengembalikan false. 2 != 6 mengembalikan true. 'Dicoding' != 'dicoding' mengembalikan true. |
Identik (===) | Membandingkan dua operan beserta tipe datanya. Jika kedua operan identik, operasi akan mengembalikan true, sebaliknya false. | operan1 === operan2 | 1 === 1 mengembalikan true. 1 === '1' mengembalikan false. 2 === 6 mengembalikan false. 'Dicoding' === 'dicoding' mengembalikan false. |
Tidak Identik (!==) | Membandingkan dua operan beserta tipe datanya. Jika kedua operan tidak identik, operasi akan mengembalikan true, sebaliknya false. | operan1 !== operan2 | 1 !== 1 mengembalikan false. 1 !== '1' mengembalikan true. 2 !== 6 mengembalikan true. 'Dicoding' !== 'dicoding' mengembalikan true. |
Lebih dari (>) | Membandingkan dua operan, apakah operan pertama lebih dari operan kedua? Jika pernyataan benar, mengembalikan true, sebaliknya false. | operan1 > operan2 | 4 > 2 mengembalikan true. 4 > 5 mengembalikan false. 4 > 4 mengembalikan false. |
Lebih dari atau Sama dengan (>=) | Membandingkan dua operan, apakah operan pertama lebih dari atau sama dengan operan kedua? Jika pernyataan benar, mengembalikan true, sebaliknya false. | operan1 >= operan2 | 4 >= 2 mengembalikan true. 4 >= 5 mengembalikan false. 4 >= 4 mengembalikan true. |
Kurang dari (<) | Membandingkan dua operan, apakah operan pertama kurang dari operan kedua? Jika pernyataan benar, mengembalikan true, sebaliknya false. | operan1 < operan2 | 4 < 2 mengembalikan false. 4 < 5 mengembalikan true. 4 < 4 mengembalikan false. |
Kurang dari atau Sama dengan (<=) | Membandingkan dua operan, apakah operan pertama kurang dari atau sama dengan operan kedua? Jika pernyataan benar, mengembalikan true, sebaliknya false. | operan1 <= operan2 | 4 <= 2 mengembalikan false. 4 <= 5 mengembalikan true. 4 <= 4 mengembalikan true. |
Berikut adalah contoh kode yang menunjukkan berbagai penggunaan operator perbandingan dalam JavaScript.
- const a = 10;
- const b = 12;
- console.log(a < b); // output: true
- console.log(a > b); // output: false
Logical Operator
Operator logika digunakan untuk menetapkan logika dari dua nilai operan boolean. Dengan operator logika, kita bisa melakukan operasi gerbang logika, seperti AND dan OR. Operator logika dapat digunakan untuk menetapkan logika yang lebih kompleks.
Berikut adalah daftar operator logika yang tersedia dalam JavaScript.
| Operator | Deskripsi | Notasi | Contoh |
|---|---|---|---|
AND (&&) | Binary operator yang menghasilkan nilai true apabila kedua operan bernilai true (atau truthy). Jika salah satu operan bernilai false (atau falsy), operasi akan mengembalikan false. | operand1 && operand2 | true && true menghasilkan true. |
OR ( || ) | Binary operator yang menghasilkan nilai true apabila salah satu operan bernilai true (atau truthy). Jika kedua operan bernilai false (atau falsy), operasi akan mengembalikan false. | operand1 || operand2 | true || true menghasilkan true. |
NOT (!) | Unary operator yang mengubah operan bernilai true menjadi false dan false menjadi true. | !operan | !true menghasilkan false. !false menghasilkan true. !(1 > 2) menghasilkan true. !(4 === 4) menghasilkan false. |
Berikut adalah contoh kode yang menunjukkan berbagai penggunaan operator logika dalam JavaScript.
- // AND
- console.log(true && true); // true
- console.log(false && true); // false
- console.log(true && false); // false
- console.log(false && false); // false
- console.log((5 === 5) && (3 < 5)); // true
- // OR
- console.log(true || true); // true
- console.log(false || true); // true
- console.log(true || false); // true
- console.log(false || false); // false
- console.log((5 === 5) || (3 > 5)); // true
- // NOT
- console.log(!true); // false
- console.log(!false); // true
String Operator
Operator string adalah operator yang digunakan untuk menggabungkan dua nilai string. Operator ini menggunakan simbol + dan termasuk dalam kategori binary operator.
Berikut adalah contoh penggunaan operator string untuk menggabungkan dua nilai string.
- const first = 'bekerja';
- const second = 'sama';
- const merged = first + second;
- console.log(digabung); // Keluaran: bekerja sama
Perlu diperhatikan bahwa simbol + memiliki fungsi ganda tergantung pada jenis operannya. Jika salah satu operan adalah string, simbol + akan berfungsi sebagai operator string untuk menggabungkan nilai string tersebut. Sebaliknya, jika kedua operand adalah angka, simbol + akan berfungsi sebagai operator aritmetika untuk melakukan penjumlahan.
Meskipun terlihat sederhana, penggunaan simbol + ini bisa sedikit membingungkan. Contohnya, pada operasi "2" + 2, hasilnya bukan 4, melainkan "22". Hal ini terjadi karena salah satu operannya adalah string sehingga simbol + berfungsi sebagai operator string.
Rangkuman Mengarungi Lautan Sintaksis
Ekspresi dan Pernyataan
Pemrograman pada dasarnya adalah cara kita berkomunikasi dengan komputer. Komunikasi ini melibatkan penyampaian instruksi kepada komputer agar menjalankan tugas-tugas tertentu dengan benar. Tentu saja, kita perlu mengikuti aturan tertentu untuk memberikan instruksi kepada komputer.
Pada pemrograman, satu proses umumnya ditulis dalam satu baris kode. Jadi, tiga proses umumnya ditulis dalam tiga baris kode. Istilah yang digunakan untuk "instruksi" dalam bahasa pemrograman adalah " statement ".
Dapat disimpulkan bahwa statement adalah proses yang akan dieksekusi oleh komputer .
Selain statement , ada istilah lain yang penting untuk, yaitu ekspresi . Ini merupakan bagian dari sebuah pernyataan yang menghasilkan nilai. Setiap pernyataan biasanya mengandung setidaknya satu ekspresi.
- konstanta usia = 10 ;
- const name = 'Dicoding' ;
- konsol . log ( `Aku ${nama}, umurku ${usia} tahun.` );
Contoh, ekspresi dalam kode di atas adalah nilai 10, teks “Dicoding”, dan teks “Aku Dicoding, umurku 10 tahun.”.
Berikut adalah ilustrasi yang bisa Anda lihat untuk memudahkan pemahaman mengenai bagian ekspresi pada pernyataan .
Komentar
Komentar adalah teks bersifat penjelasan yang dapat dibaca oleh programmer dan ditulis dalam berkas kode. Pada JavaScript, untuk menuliskan teks komentar, ada dua cara, yaitu menggunakan tanda // dan /* */. Teks yang ditulis dengan tanda tersebut dianggap bukan instruksi dan tidak akan dijalankan oleh interpreter .
Berikut adalah contoh komentar yang ditulis dengan tanda //.
- // Teks ini akan diabaikan oleh interpreter
- console.log ( 'Hai, Pembaca! ' ) ;
- konsol . log ( 'Hai, JavaScript!' );
- // console.log('Hai, Pengodean!');
Berikut adalah contoh dari komentar yang ditulis dengan tanda /* */.
- /*
- YANG HARUS DILAKUKAN
- 1. Buatlah variabel bernama
PIdan isikan dengan nilai 3.14- 2. Cetak nilai variabel PI di terminal menggunakan console.log
- */
- konstanta PI = '3.14' ;
- konsol.log ( PI ) ;
Variabel
Variabel adalah wadah untuk menampung sebuah nilai. Nilai yang ditampung dapat berupa angka, teks, atau apa pun yang menghasilkan nilai (ekspresi). Pada JavaScript, kita bisa membuat variabel melalui dua cara, yaitu dengan sintaksis const dan let.
Perbedaan dari variabel yang dibuat dengan const dan let adalah variabel yang dibuat dengan const tidak dapat diinisialisasi ulang (sederhananya, diubah) nilainya, sedangkan jika variabel dibuat dengan let , kita bisa menginisialisasi ulang.
Variabel yang dibuat dengan const juga umum disebut sebagai konstanta (konstan) karena dalam matematika istilah tersebut memiliki arti tetap atau tidak berubah-ubah.
Dalam membuat variabel , kita tidak bisa memberikan nama secara sembarang. Ada aturan yang perlu kita taati. Berikut adalah beberapa aturan dalam penamaan variabel pada JavaScript.
- Tidak Boleh Memberikan Nama yang Sama dalam Cakupan yang Sama.
- Nama Variabel Hanya Terdiri dari Karakter Tertentu.
- Nama Variabel Tidak Boleh Diawali dengan Angka.
Mengubah Nilai Antar Tipe Data
JavaScript adalah bahasa pemrograman yang dinamis dan fleksibel, ia menyediakan berbagai cara untuk mengonversi tipe data . Konversi tipe data dapat dilakukan secara eksplisit oleh pengembang atau secara implisit oleh interpreter .
Konversi Eksplisit
Konversi eksplisit adalah cara yang paling dapat diandalkan untuk mengubah tipe data karena dilakukan dengan instruksi yang jelas, alias eksplisit dari programmer. Berikut adalah beberapa metode umum yang digunakan untuk konversi tipe data secara eksplisit.
- konstanta angka = 123 ;
- konstanta boolean = true ;
- const strNumber = String ( number );
- const strBoolean = boolean.toString ( ) ;
- console.log ( strNumber ); // output: "123 "
- console.log ( strBoolean ); // output: " true "
- const strNumber = '123' ;
- const strFloat = '3.14' ;
- konstanta boolean = true ;
- const numFromString = Number ( strNumber );
- const floatFromString = Number ( strFloat );
- const numFromBoolean = Number ( boolean );
- console.log ( numFromString ); // output : 123
- console.log ( floatFromString ); // output : 3.14
- console.log ( numFromBoolean ); // output : 1
- konstanta cm = '20cm' ;
- const px = '64px' ;
- const intFromCM = parseInt ( cm );
- const intFromPX = parseInt ( px );
- console.log ( intFromCM ) ; // output: 20
- console.log ( intFromPX ) ; // output: 64
- konstanta fCm = '20,55cm' ;
- const fPx = '64.23px' ;
- const floatFromCM = parseFloat ( fCm );
- const floatFromPX = parseFloat ( fPx );
- console.log ( floatFromCM ) ; // output : 20.55
- console.log ( floatFromPX ) ; // output : 64.23
- konstanta angka = 123 ;
- const string = 'Dicoding' ;
- konstanta kosong = null ;
- const boolFromNumber = Boolean ( 123 );
- const boolFromString = Boolean ( string );
- const boolFromNull = Boolean ( empty );
- console.log ( boolFromNumber ); // output : true
- console.log ( boolFromString ); // output : true
- console.log ( boolFromNull ) ; // output: false
Seluruh nilai yang dikonversi dalam boolean menghasilkan true disebut nilai truthy , sedangkan sebaliknya disebut dengan falsy . Hampir seluruh nilai yang bersifat truthy, hanya segelintir nilai yang bersifat falsy. Berikut adalah daftar nilai falsy dalam JavaScript.
- PALSU
- 0
- - 0
- Pada
- ''
- batal
- belum diartikan
- NaN
Konversi Implisit
Konversi implisit terjadi ketika JavaScript secara otomatis mengubah tipe data tanpa instruksi eksplisit dari programmer. Ini biasanya terjadi dalam konteks tertentu, seperti operasi aritmetika, perbandingan, dan konteks logika.
- konstanta usia = 20 ;
- const message = 'Umurku:' + umur ;
- console.log ( message ); // output: Umurku : 20
- const strNumber = '123' ;
- const result = strNumber * 2 ;
- console.log ( result ); // output : 246
- konstanta bool = true ;
- const result = 1 + bool ;
- console.log ( result ); // output : 2
Operator
Dua istilah penting dalam melakukan sebuah operasi, yaitu operator dan operan (operan).
- Operator merupakan sebuah simbol atau teks yang digunakan untuk melakukan sebuah operasi, misalnya aritmetika, penugasan, logika, tipe data , atau operasi lain yang berhubungan dengan pemrograman.
- Operan adalah nilai yang menjadi target dari sebuah operasi.
Simak ilustrasi di bawah ini agar dapat membedakannya.
Secara umum, operator dalam JavaScript terbagi menjadi tiga kelompok: unary , biner , dan ternary . Pengelompokan ini berdasarkan jumlah operan yang diperlukan untuk menggunakan suatu operator.
Berikut adalah contoh kode yang menunjukkan penggunaan operator unary, biner, dan ternary .
- misalkan usia = 25 ;
- // Operator unary
- jenis usia ;
- // Operator biner
- 5 + 4 ;
- 10 / 2 ;
- usia = 30 ;
- // Operator ternary (operator kondisional)
- ( usia < 18 tahun ) ? 'Kamu terlalu muda!' : 'Selamat datang!' ;
Sudah jelas mengenai istilah operator dan operan beserta pengelompokan operator unary, biner, dan ternary? Jika sudah, mari kita mengenal berbagai operator yang ada dalam JavaScript.
Berbagai macam operator yang tersedia di JavaScript:
- Penugasan: operator yang digunakan untuk memberikan nilai kepada sebuah variabel , baik inisiasi nilai baru maupun mengubah nilai yang sudah ada.
- Aritmatika : standar operator yang digunakan untuk proses aritmetika, seperti penambahan (+), pengurangan (-), pengalian (*), ataupun pembagian (/).
- Perbandingan : operator yang digunakan untuk membandingkan dua nilai dan mengembalikan nilai boolean (benar atau salah) sebagai hasil perbandingan.
- Logical : mengatur logika dari dua nilai operan boolean .
- Operator string : operator yang digunakan untuk menggabungkan dua nilai string .
Besambung Ke: KUIS:
jika tujuannya adalah mengikuti instruksi komentar (TODO) yang ada.
Berikut adalah perbaikannya:
Nama Variabel: Instruksi meminta variabel bernama value, tapi kamu menulisnya variabel.
Tipe Variabel: Instruksi meminta menambahkan nilai ke value. Karena nilainya berubah, gunakan let, bukan const.
Logika Penambahan: Instruksi meminta menambahkan nilai ke dalam variabel, bukan sekadar mencetaknya di console.log.
String Concatenation: Variabel money harus menggabungkan variabel-variabel yang sudah dibuat sebelumnya.
Kode yang benar:
// 1. Buat konstanta currency
const currency = "IDR";
// 2. Buat variabel value (gunakan let karena nilainya akan ditambah/berubah)
let value = 10000;
// 3. Tambahkan nilai di dalam variabel value sebesar 5000
value = value + 5000;
// 4. Buat konstanta money dengan gabungan string
const money = currency + " " + value;
console.log(money); // Hasilnya: "IDR 15000"
kode tersebut sudah berfungsi dengan sangat baik dan logikanya sudah benar sesuai instruksi.
Beberapa poin mengapa kode ini sudah tepat:
Penggunaan const dan let: Kamu sudah tepat menggunakan const untuk currency (karena tetap) dan let untuk value (karena nilainya bertambah).
Operasi Aritmatika: Baris value = value + 5000 (atau bisa disingkat value += 5000) berhasil memperbarui nilai variabel tersebut.
Penggabungan String: Variabel money akan menghasilkan string "IDR 15000", yang menggabungkan teks dan angka secara otomatis.
Jika memasukkan kode ini ke sistem auto-grader Coding Indonesia, seharusnya langsung mendapatkan status Pass/Lolos.
- Get link
- X
- Other Apps





Comments
Post a Comment