Dasar-dasar JavaScript

Mengenal Variabel

Dalam kamus besar bahasa Indonesia (KBBI), Variabel adalah suatu data yang berubah – ubah, bermacam – macam. Jadi, jika kita hubungkan kedalam suatu bahasa pemrograman maka variabel adalah suatu simbol yg digunakan untuk menyimpan sebuah data, data tersebut tidaklah tetap suatu waktu bisa berubah. Dalam javascript, penulisan variabel di mulai dengan simbol var. Perhatikan contoh dibawah ini :

var a = 5;
var b = 7;
var hasil = a+b;
console.log(hasil);

 

Semua variabel JavaScript harus diidentifikasi dengan nama unik. Maksudnya, jika kita ingin menyimpan suatu nilai yang berbeda maka nama tersebut harus berbeda dengan nama variabel yang kita set sebelumnya.

Misalnya anda ingin menyimpan tahun lahir ke dalam variabel year, maka untuk tahun sekarang jangan lagi menggunakan variabel year, tapi boleh jadi yearNow. Nama unik tersebut disebut identifier. Identifier bisa berupa nama pendek (seperti x dan y) atau boleh menggunakan kata yang lebih familiar (umur, jumlah, totalVolume, etc).

Ada beberapa aturan umum dalam penulisan variabel javaScript, diantaranya :

  • Nama variabel bisa mengandung huruf, angka, garis bawah dan tanda dolar.
  • Nama variabel harus dimulai dengan huruf, tanda dollar $ atau underscore _
  • Nama variabel Case Sensitive (Membedakan huruf besar dan kecil), jadi variable A dan a berbeda
  • Tidak boleh menggunakan variabel yang sudah dipakai javaScript, misalnya fungsi-fungsi bawwan javaScript seperti : date, print, dll

Tipe Data

JavaScript mempu membedakan banyak tipe data yang beragam, mulai dari String, Number, Object, dan banyak yg lainnya. contohnya seperti dibawah ini :

var a = 42;    // a sebagai number
var a = 'bar'; // a sebagai string
var a = true;  // a sebagai boolean

 

Saat ini, EcmaScript yg paling terakhir (ES 2017) mendefinisikan tipe Data javaScript menjadi 7 tipe, diantaranya adalah :

Tipe data primitif (6 data types that are primitives)  dan Tipe data Object

  • Boolean
    adalah tipe data yang hanya memiliki 2 nilai yaitu mempresentasikan nilai true dan false.
  • Null
    adalah tipe data yang hanya memiliki sebuah nilai null. Tipe ini biasanya dipakai untuk mengisi suatu nilai awal dari suatu variabel
  • Undefined
    adalah tipe data yang hanya memiliki sebuah nilai undefined. Tipe ini mendefinisikan bahwa variabel tersebut tidak ada atau belum pernah di tulis atau dalam bahasa indonesia, Tipe ini mewakili nilai yang belum terdefinisi. contohnya seperti ini :

    var a = 10;
var b = 20;
var c = a+b+d;
console.log(c)

     

    Script diatas bila dijalankan maka akan menghasilkan undefined property. karena variabel d belum kita definisikan sehingga akan memunculkan error undefined.

  • Number
    Mengacu pada standar EcmaScript, hanya ada satu tipe data Number, yaitu Double (number diantara -(253 -1) dan 253 -1). perlu kita ketahui, pada javaScript tidak ada data spesifik seperti Integer, sehingga jika kita ingin menghasilkan tipe data integer maka kita bisa menggunakan pembulatan decimal dengan menggunakan Math.ceil, Math.floor atau fungsi yang serupa. oleh karena itu, selain mampu mewakili bilangan integer, float (decimal), tipe Number mempunyai 3 jenis simbol, yaitu +inifinitif (mewakili bilangan positif) dan -inifinitif (mewakili bilangan negatif) serta NaN (not a number/Bukan Number).
  • String
    adalah tipe data yang digunakan untuk mempresentasikan data yang berupa text. Setiap huruf dalam String menempati urutan posisi pada text itu sendiri. Huruf/Elemen petama dimulai dengan index 0, kemudian lanjut ke index 1 dan seterusnya. Jumlah panjang dari suatu elemen adalah jumlah dari huruf yang menyusun text itu sendiri.

    var nama = "Nugraha";
console.log(nama[0]) //
result
 : N
var panjang = nama.length //
result
 : 7 (terdiri dari 7 huruf)

     

    Tidak seperti bahasa C, javaScript String bersifat Immutable. jadi ketika string dibuat, maka propertiesnya object dari string itu tidak bisa diubah. dalam hal ini, bukan berarti kita tidak bisa merubah value dari variabel tersebut. tentu saja, jika kita membuat assigment baru dengan variabel yang sama maka valuenya akan berubah. perhatikan contoh dibawah ini :

    var str = 'foo';
alert(str.substr(1)); // oo
alert(str); // foo

     

    Pada contoh diatas, ketika kita akan membuat variable str maka komputer akan membuat object baru yang berisi ‘foo’ lalu pada baris selanjutnya, komputer akan membuat object baru lagi, yang berisi ‘oo’. jadi, ketika kita memanggil kembali variabel str maka dia akan kembali ke object yang pertama yang berisi ‘foo’ bukan berisi ‘oo’. namun jika kita melakukan assigment baru dengan menulis str = ‘bar’ maka komputer akan mengubah object str yang berisi ‘foo’ menjadi ‘bar’.

    Masih bingung dengan penjelasan Apa itu Immutable? kita bisa coba baca penjelasan lebih detail melalui link dibawah ini:
    https://stackoverflow.com/questions/3200211/what-does-immutable-mean#3200221.
    https://www.sitepoint.com/immutability-javascript/
    http://www.bahasajava.com/2017/07/memahami-immutable-class-dan-objek-pada-java.html
    Pada umumnya, immutable pada javaScript sama halnya dengan immutable pada java, namun jika rekan-rekan masih bingung dengan penjelasan diatas, silakan kirim pertanyaan di kolom komentar dibawah ini. Insya Allah akan saya jawab sebisa mungkin.

  • Symbol (new in ECMAScript 6)
    Tipe data Symbol merupakan tipe data baru pada javaScript. Tipe data ini di perkenalkan pada ES6. lalu apa itu tipe data Symbol?
    Tipe data Symbol adalah Tipe data yang memuat suatu nilai yang dapat dibuat dan digunakan sebagai kunci(key) properti, tapi tidak bisa diinterferensi dengan properti objek yang ada, tanpa visibilitas yang tidak diinginkan, dan tanpa penambahan yang tidak terkoordinasi oleh kode lainnya.Symbol bisa kita gunakan untuk membuat suatu private key dari object, namun penggunaan symbol sebetulnya lebih dari pada itu. Saya sendiri masih mencari refferensi lain terkait symbol ini dan belum paham betul fungsi dan kegunaan dari symbol itu sendiri. Insya allah, untuk symbol sendiri nanti akan kita bahas kembali pada artikel selanjutnya.
    Sebagai gambaran perhatikan penggunaan Symbol dibawah ini.

    var _x = Symbol("x");
var _y = Symbol("y");


class Bidang {
    constructor(x, y) {
        this[_x] = x;
        this[_y] = y;
        this._z = 5;
    }


    getCoordinate() {
        return ("x:" + this[_x] + ", y:" + this[_y]);
    }


    getZ() {
        return this._z;
    }


    changeCoordinate(x, y) {
        this[_x] = x;
        this[_y] = y;
    }
}


console.log(_x); // Symbol(x)


var AB = new Bidang(2, 3);
console.log(AB._z); // 5
console.log(AB.getZ()); // 5
console.log(AB._x); // undefined
console.log(AB.getCoordinate()); // x:2, y:3


AB._z = 7;
console.log(AB.getZ()); // 7


AB.changeCoordinate(3, 4);
console.log(AB.getCoordinate()); // x:3, y:4

     

    efferensi :

    https://docs.microsoft.com/en-us/scripting/javascript/reference/symbol-object-javascript
    https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol

  • Object
    Pengertian Object pada javascript pada umumnya sama dengan object pada bahasa pemrograman lain. Object adalah bentuk nyata dari suatu Class dimana Object memiliki ciri-ciri dan tingkah laku. ciri-ciri dalam suatu object pada javaScript kita sebut sebagai properties, sedangkan tingkah lakunya kita sebut sebagai Method. Masih bingung dengan istilah tersebut?Dalam kehidupan sehari-hari Class itu bisa kita contohkan sebagai Manusia sedangkan Anda, Saya, Kita adalah object dari Manusia itu sendiri. Kita semua punya ciri-ciri yang sama, seperti halnya kita punya hidung, mulut, mata (ini disebut sebagai properties) namun memiliki bentuk berbeda-beda. Perbedaan ini kita sebut sebagai value/nilai dari properties itu sendiri. Setiap hari kita makan dan minum ini adalah contoh dari sebuah tingkah laku. Terlepas dari semua itu, cara makan dan apa yang kita makan pun pasti sangat bervariasi.Perhatikan Class dan Function pada pembahasan Symbol, disitu secara tidak langsung saya sudah memberikan gambaran proses pembuatan object melalui Class. Adapun untuk pembahasan Object, Class, dan Function itu sendiri akan kita bahas lebih lanjut di artikel selanjutnya. Perhatikan Contoh sederhana berikut ini.

    var magcoding = {};
magcoding.lahir = 1989;


magcoding.age = function() {
    return new Date().getFullYear() - this.lahir + " Tahun";
}


console.log(magcoding); // object properties {lahir: 1989, age: ƒ}


console.log(magcoding.age()); //28 Tahun


magcoding.lahir = 1999;


console.log(magcoding.age()); //18 Tahun

     

Demikian penjelasan singkat mengenai dasar-dasar JavaScript  pada pokok bahasan Variabel dan Tipe data. Mudah-mudahan kita semua diberikan kemudahan dalam proses belajar.

Jika pembaca sekalian menemukan kesalahan ataupun pertanyaan terkait artikel yang saya buat, silakan kirimkan di kolom komentar dibawah ini. Insya Allah dengan senang hati masukkan, saran dan pertanyaan dari rekan-rekan pembaca sekalian saya tunggu dan dapat menjadikan blog ini lebih bermanfaat.

Happy Learning

^_^