Dasar-dasar JavaScript Bagian 2

Photo by Juanjo Jaramillo on Unsplash

Artikel ini adalah artikel lanjutan mengenai dasar-dasar javascript yang merupakan bagian dari series Pembelajaran Javascript Fundamental. Series ini dibuat dan disesuaikan untuk rekan-rekan yg baru belajar atau berniat untuk mempelajari javaScript. JavaScript juga bisa kita digunakan sebagai dasar memahami bahasa pemrograman yang lain.

Pada series kali ini, kita akan membahas mengenai Comments dan Operator. Comments dalam bahasa indonesia diartikan sebagai komentar, sedangkan operator adalah pengoprasi. untuk lebih jelasnya, simak penjelasan berikut ini :

JavaScript Comments

JavaScript Comments digunakan untuk menuliskan penjelasan mengenai script yang kita tulis, sehingga lebih mudah terbaca dan dipahami oleh orang lain. Bahkan kita sendiri terkadang lupa dengan script yang kita buat, sehingga penulisan Comments sangat penting sekali.

// Konversi Suhu dari Celcius ke Reamur
function cToR(Celcius) {
    return 4/5 * Celcius;
}


// Konversi Suhu dari Celcius ke Fahrenheit
function cToF(Celcius) {
    return 9/5 * Celcius + 32;
}


// contoh penggunaan
let R = cToR(5);
console.log(R); // output : 4

Selain itu, Comments bisa digunakan untuk menonaktifkan perintah yang kita buat. Misalnya saat kita melakukan testing, perintah yang kita tulis mau kita ubah, tapi kita tidak mau menghapusnya.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>greet</title>
  </head>
  <body>
    <h1 id="title">Selamat Datang</h1>
    <p>Mari kita sambut perubahan dengan semangat dan kerja keras</p>
    <script>
      // document.getElementById("title").style.display = "none";
      // document.getElementsByTagName("p")[0].style.display = "none";
    </script>
  </body>
</html>

Tulis kembali kode diatas lalu jalankan di browser, kemudian perhatikan apa yang terjadi. langkah selanjutnya adalah hapus tanda // di depan perintah diatas kemudian perhatikan kembali. Silakan simpulkan percobaan yang telah kita lakukan (Trial and Error merupakan cara paling efektif dalam mempelajari suatu bahasa pemrograman)

JavaScript Comments bisa kita buat dengan menggunakan 2 buah Simbol.

  • Single Line Comments (Komentar untuk satu baris)
    Single Line Comments dimulai dengan //. Semua text yang berada 1 baris dengan // tidak akan di eksekusi oleh javaScript seperti yang sudah kita contohkan diatas.
  • Multi-Line Comments (Komentar untuk beberapa blok baris)
    Multi-Line Comments  dimulai dengan tanda /* dan diakhiri dengan tanda */. Semua text yang ada pada baris tersebut tidak akan di eksekusi oleh javaScript. Perhatikan Contoh berikut ini :

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <title>greet</title>
      </head>
      <body>
        <h1 id="title">Selamat Datang</h1>
        <p>Mari kita sambut perubahan dengan semangat dan kerja keras</p>
        <script>
          /* Tulisan dan script ini tidak akan dieksekusi oleh javaScript
          document.getElementById("title").style.display = "none";
          document.getElementsByTagName("p")[0].style.display = "none"; */
          document.getElementById(
            "title"
          ).innerHTML = "Welcome";
        </script>
      </body>
    </html>

JavaScript Operator

Seperti halnya bahasa pemrograman pada umumnya, ada beberapa jenis operator dalam javaScript yang akan kita gunakan dalam mengoperasikan perintah-perintah yang kita tulis ke dalam suatu perogram.

  1. Assignment operator (Operator Penugasan)
    Assignment operator (=) digunakan untuk memberikan value kedalam suatu variabel.

    var ayah = "Budi";
    var ibu = "Wati";
    console.log("Oh "+ibu+" dan "+ayah+" selamat pagi");

     

    Selain simbol (=) ada beberapa Assignment Operator gabungan yang akan sering kita gunakan, yaitu :

    Operator Contoh Penggunaan Nilainya sama dengan
    += x += y x = x + y
    -= x -= y x = x – y
    *= x *= y x = x * y
    /= x /= y x = x / y
    %= x %= y x = x % y
  2. Arithmetic Operator (Operator Aritmatika)
    Arithmetic Operator adalah operator yang digunakan untuk mengoperasikan angka pada javascript. Perhatikan tabel dibawah ini :

    Operator Deskripsi
    + Penjumlahan
    Pengurangan
    * Perkalian
    / Pembagian
    % Modulus (Sisa hasil bagi)
    ++ Penambahan dengan angka 1
    Pengurangan dengan angka 1
    var a=2, b=3, c=5;
    console.log(a+b); // 5
    console.log(a-b); // -1
    console.log(a/b); // 0.6666
    console.log(a*b); // 6
    console.log(c%a); // 1
    console.log(++c); // 6
    console.log(b++); // 3
    console.log(--b); // 3

     

    Perhatikan kembali contoh diatas, Jika rekan-rekan benar-benar memperhatikan pada script diatas kita menemukan sebuah increament ++ yg letaknya depan dan increament ++ yg letaknya di belakang. Apakah script tersebut akan menghasilkan angka yang sama?.

    Pada umumnya script tersebut memang akan menghasilkan hasil yang sama, yaitu sama-sama menjumlahkan variabel dengan angka 1. lalu dimana letak perbedaannya? Perbedannya terletak pada saat pemrosesan statement tersebut. a++ akan menjalankan perintah atau statement terlebih dahulu kemudian menjumlahkan dengan angka 1. sedangkan ++a dia akan menjumlahkan dengan angka 1 terlebih dahulu baru menjalankan perintah atau statement pada baris tersebut.

  3. Logical Operator (Operator Logika)
    Logical Operator adalah operator logika yang di gunakan untuk mengoperasikan gerbang logika dasar dimana operator ini membutuhkan minmal satu inputan atau lebih yang menghasilkan pernyataan True atau False. Apa itu Gerbang logika dasar?Untuk memahami dan mengenal apa itu gerbang logika dasar silakan rekan-rekan baca artikel Gerbang Logika yang bisa rekan-rekan temukan pada blog ini. jika rekan-rekan sudah paham, mari kita lihat operator logika yang di pakai pada javaScript.

    Operator Deskripsi
    && logical and (Operator Logika AND/dan)
    || logical or (Operartor Logika OR/atau)
    ! logical not (Operator Logika NOT/tidak)

    Contoh Pengunaan :

    var a = 3, b = 4;
    console.log(!(a>3) && b==4);
    console.log(a>1 || !(b<4));
    console.log(!(a>3) || !(b>4));
    console.log(!(a>0 || b<0));
    console.log(!(a+b<0 && a-b >0));

     

    Coba kita tebak hasil output diatas lalu jalankan sintaks diatas pada console browser kita. Jika rekan-rekan masih kebingungan dengan materi ini, silakan diskusikan dengan saya di kolom komentar

  4. Comparison Operator (Operator Pembanding)
    Comparison Operator digunakan untuk membandingkan minimal 2 buah pernyataan. Dalam kehidupan sehari-hari kita sering menjumpai suatu kasus perbandingan, misalnya muncul pertanyaaan seperti ini.Apakah Mobil Sedan harganya sama dengan 10 Motor?
    Pertanyaan tersebut masih belum bisa kita jawab karena kita tidak tau berapa harga atau type mobil/motor pada pertanyaan tersebut. Disini, bisa kita simpulkan bahwa pernyataan kita belum spesifik dan detail atau inputan yang kita butuhkan masih ada yang kurang.Mari kita perjelas kembali pernyataan kita.Diketahui harga mobil sedan Rp 100.000.000 dan harga motor 20000.000, lalu kita ulang kembali pernyataan diatas. Apakah Mobil Sedan harganya sama dengan 10 Motor? dari sini dengan mudah kita akan menjawab bahwa harga sebuah mobil sedan tidak sama atau tidak sebanding dengan harga 10 Motor.Dari contoh diatas, kita mempelajari bahwa untuk mendapatkan suatu kesimpulan dari pernyataan maka dibutuhkan inputan-inputan dan premis yang jelas.Begitu pula dengan logika komputer, komputer saat ini tidak dirancang untuk menyelesaikan suatu permasalahan berdasarkan feeling atau terkaan. Mereka hanya menjalankan apa yang kita perintahkan dan kita intruksikan, jadi jelas sekali bahwa kita di tuntut untuk memberikan argumen yang jelas. Perhatikan contoh berikut ini?

    var panjang = 10, lebar = 20;
    var luas = p*l;
    console.log(luas);

     

    Sebelum rekan-rekan jalankan script diatas pada browser, coba rekan-rekan tebak output apa yang akan di keluarkan script diatas. Silakan simpulkan hasil analisa sederhana rekan-rekan di kolom komentar.

    Setelah kita memahami serangkaian pernyataan dan contoh diatas, mari kita lihat operator pembanding yang digunakan pada javaScript.

    Operator Deskripsi Contoh (a=4, b=3) Output
    == Sama nilainya dengan a==b False
    === Sama nilai dan tipenya a === b False
    != Tidak sama nilainya dengan a != b True
    !== Tidak sama baik nilai dan tipenya a !== b True
    > Lebih dari a > b True
    < Kurang dari a < b False
    >= Lebih dari atau sama nilainya dengan a >= b True
    <= Kurang dari atau sama nilainya dengan a <= b False
    ? Operator Ternari (Bentuk sederhana dari percabangan) a==b ? ‘Nilai A sama dengan B’ : ‘Nilai A tidak sama dengan B’ Nilai A tidak sama dengan B
  5. String Operator
    String Operator adalah operator yang digunakan untuk menggabungkan minimal 2 buah string. Untuk menggabungkan String kita bisa menggunakan operator + dan +=. diketahi text1 = “Good “text2 = “Morning”and text3 = “”, Perhatikan tabel penggabungan string dibawah ini.

    Operator Example text1 text2 text3
    + text3 = text1 + text2 “Good “ “Morning”  “Good Morning”
    += text1 += text2 “Good Morning” “Morning” “”

Demikanlah penjelasan singkat mengenai Comments dan Operator pada javaScript. Sebetulnya masih ada beberapa JavaScript Operator  yang belum kita sebutkan, mudah-mudahan dengan penjelasan singkat diatas kita diberikan kemudahan dalam memahami dasar javaScript.

Semangat Belajar dan Keep Learning. ^_^

Refferensi : https://www.w3schools.com/js/js_operators.asp