, masing-masing memiliki beberapa perbedaan. Kenapa kita perlu memahami varibale? Karena variable ini berkaitan dengan cara kita menyimpan data di memori. Show
Apa itu variabel?Variabel adalah sebuah wadah untuk menyimpan data atau bisa dibilang nama yang mewakili sebuah nilai. Variabel bisa diisi dengan berbagai macam nilai seperti string (teks), number (angka), objek array dan sebagainya yang akan dibahas pada artikel tipe data . Pertama mari kita mulai dengan belajar tentang variabel javascript. Cara membuat variabel JavaScriptUntuk membuat variabel di JavaScript kita bisa menggunakan var, let, dan const. Syntax :
Keterangan:
Contoh variabel : See the Pen Aturan penamaan variabelNama variabel dapat dibuat sesuai keinginan, namun harus sesuai dengan beberapa aturan yaitu :
Berikut ini contoh penamaan variabel yang benar : See the Pen Berikut ini contoh penamaan yang salah : See the Pen Penulisan nama variabel biasanya ditulis menggunakan gaya camelCase yang digunakan oleh para programmer JavaScript, jadi sangat disarankan untuk mengikutinya. Berikut ini contoh nama variabel yang menggunakan gaya penulisan camelCase : namaDepan, generateLoginToken. Jika nama variabel hanya mengandung satu kata, sebaiknya ditulis dengan huruf kecil semua. Jika lebih dari satu kata, huruf pertama dari kata kedua dan seterusnya ditulis menggunakan huruf besar. Gaya penamaan ini opsional, kita bisa menggunakan huruf kecil semua atau huruf besar semua atau menggunakan underscore sebagai pemisah, namun disarankan menggunakan camelCase. Deklarasi dan Inisialisasi variabel javascriptKetika kita mendeklarasikan variabel, itu berarti kita meminta ruang kosong di memori, sedangkan inisialisasi adalah mengisi data ke dalam ruang memori tersebut. Kita bisa membuat atau mendeklarasikan variabel atau wadah terlebih dahulu, lalu menginisialisasinya atau memasukkan datanya nanti. See the Pen Isi variabel data diubah dengan tipe data yang berbeda (Dynamic type)Di beberapa bahasa pemrograman, ketika kita membuat variabel dengan data angka, kita tidak bisa menggantinya dengan data selain angka. Selain itu, kita juga perlu menuliskan secara eksplisit tipe data yang akan ditampung oleh sebuah variabel. Namun di JavaScript hal tersebut tidak berlaku, kita bisa mengubah isi dari variabel menggunakan tipe data yang berbeda, dan kita tidak perlu menuliskan tipe data secara eksplisit saat membuat variabel. Ini dapat kita lakukan jika kita membuat variabel menggunakan keyword var atau let. Contoh : See the Pen Perbedaan var,let, dan constAdanya beberapa keyword yang bisa digunakan untuk membuat variabel bukan karena tanpa alasan, masing-masing memiliki behavior yang berbeda-beda. Secara singkat, inilah perbedaannya : Mari kita pelajari lebih lanjut VarSebelum ES6 muncul, kita hanya bisa membuat variabel menggunakan keyword var. Tapi, variabel yang dibuat menggunakan keyword var memiliki beberapa kekurangan. Itulah mengapa keyword baru diperkenalkan. Nah, Sekarang mari kita pelajari terlebih dahulu behavior variabel var. Var dapat di deklarasi ulangKetika variabel dibuat dengan keyword var, kita bisa mendeklarasikan ulang variabel dengan nama yang sama, nilai sebelumnya akan ditimpa. See the Pen Nilai var dapat diubahVariabel yang dideklarasikan menggunakan keyword var dapat diubah nilainya, entah itu menggunakan tipe data yang sama maupun berbeda. See the Pen Function Scope dalam varKode yang kita tulis dapat dikatakan berada di dalam function scope (lingkup fungsi) jika berada di antara { dan } sebuah fungsi. Kita akan mempelajari lebih banyak tentang fungsi di JavaScript nanti. Ketika variabel var di deklarasikan di dalam function scope, variabel tersebut hanya bisa digunakan di dalam function tersebut, tidak bisa digunakan di luar fungsi. Ini berlaku juga untuk let dan const, variabel yang dideklarasikan dengan keyword apapun di dalam fungsi tidak dapat diakses di luar fungsi. See the Pen Block Scope dalam varVariabel dikatakan berada di dalam block scope jika berada di antara { dan } conditional statement (if, else, else if), perulangan (for, while, do while), switch statement, dan sebagainya selain lingkup fungsi atau global. See the Pen Disinilah masalahnya, berdasarkan kode diatas kita sudah mendeklarasikan variabel nama. Jika kita secara sadar mau mendeklarasikan ulang variabel nama ini tidak menjadi masalah sama sekali, tetapi jika niat kita ingin membuat variabel baru bernama nama di dalam block scope sementara variabel nama tersebut sudah dideklarasikan di global scope yang terjadi seperti contoh di atas. Itu malah mengubah nilai pada variabel sebelumnya berubah. Jika kita telah menggunakan nama di bagian lain dari kode yang telah kita buat, ini bisa menjadi masalah dan menyebabkan bug. Itulah sebabnya let dan const hadir. Hoisting dalam varHoisting adalah istilah yang digunakan untuk menggambarkan bagaimana konteks eksekusi bekerja di JavaScript. Deklarasi variabel dan menggunakan var dan juga deklarasi fungsi akan diangkat (hoisting) ke atas cakupannya sebelum eksekusi kode. Sebelum eksekusi, JavaScript akan mencari variabel var dan deklarasi fungsi terlebih dahulu, kemudian menginisialisasinya dengan undefined. Untuk memudahkan memahaminya, kamu dapat menggunakan alat yang dapat memvisualisasikan eksekusi kode JavaScript. Agar kamu dapat melihat langkah-langkah eksekusi di JavaScript Contoh : See the Pen Hasil dari contoh di atas adalah undefined, dan kalian harus tahu bahwa undefined itu merupakan salah satu nilai atau tipe data. Lalu, mengapa JavaScript menginisialisasinya dengan nilai tersebut padahal kita tidak pernah menuliskannya. Selain itu variabel var batch = 255; juga dideklarasikan setelah console.log(batch); secara logika harusnya kita tidak bisa menggunakan variabel tersebut. Inilah yang dimaksud dengan istilah hoisting (diangkat). Berikut ini adalah langkah-langkah yang dilakukan JavaScript untuk mengeksekusi kode di atas:
letKeyword let biasanya digunakan untuk membuat variabel yang nilainya dapat diubah. Ini diperkenalkan untuk mengatasi masalah var yang telah dibahas di atas. let Tidak dapat dideklarasi ulangTidak seperti var, variabel yang dideklarasi dengan keyword let tidak dapat dideklarasi ulang. Contoh : See the Pen Nilai let Dapat DiubahSama seperti var, variabel yang dideklarasi menggunakan let nilainya dapat diubah menggunakan tipe data yang sama ataupun tipe data yang berbeda. See the Pen Function Scope dalam letIni berlaku juga untuk let dan const, variabel yang dideklarasikan dengan keyword apapun di dalam fungsi tidak dapat diakses di luar fungsi. Sama seperti var, variabel let yang di deklarasi di dalam function scope hanya bisa diakses di dalamnya, tidak dapat diakses di luar fungsi. See the Pen Block Scope dalam letLet menyelesaikan masalah block scope yang terjadi pada variabel var. Variabel let yang di deklarasikan di dalam block scope hanya bisa digunakan di dalamnya, tidak bisa digunakan di luar. Contoh : See the Pen Contoh di atas adalah contoh yang mirip dengan contoh pada variabel var tadi. Tapi console.log(nama) menghasilkan hasil yang berbeda. Karena variabel nama yang berada di block scope hanya dapat digunakan di dalam block scope. Hoisting dalam letVariabel let tidak diangkat (hoisting) seperti var, jadi kita tidak bisa mengakses variabel sebelum deklarasi. See the Pen ConstSama seperti let, namun nilai variabel const tidak dapat diubah. Const tidak dapat dideklarasikan ulangKita tidak bisa mendeklarasikan ulang variabel const. See the Pen Nilai const tidak dapat diubahNilai variabel yang dibuat menggunakan const tidak dapat diubah. See the Pen Namun kita bisa mengubah elemen yang ada di dalam array: See the Pen Begitu juga dengan object : See the Pen Function Scope dalam constSama seperti let, variabel const yang dideklarasikan di dalam function scope hanya bisa diakses di dalamnya, tidak bisa diakses di luar. See the Pen Block Scope dalam constSama seperti let, variabel const yang dideklarasikan di dalam block scope hanya bisa diakses di dalamnya, tidak bisa diakses di luar. See the Pen Hoisting dalam constSoal hoisting juga sama seperti let, variabel const tidak dapat digunakan sebelum dideklarasikan. See the Pen Kesimpulan
Demikian pembahasan kita kali ini. Jika kalian berminat untuk belajar lebih lanjut tentang pemrograman javascript dan bahasa pemrograman lainnya bisa coba kunjungi social media Xsis Academy untuk info lebih lanjut mengenai Bootcamp Apa itu block scope pada JavaScript?Block scope adalah scope yang ada di dalam area kurung kurawal {} seperti di if statement, switch statement, for loop, while loop dan do while loop. Variabel dalam block scope biasa disebut block level variable.
Apa itu function scope?Functional Scope (Local Scope)
Berkebalikan dengan global scope, functional/local scope adalah variable atau function yang dideklarasikan di dalam function dan hanya dapat diakses oleh kode di dalam function tersebut, termasuk function yang dideklarasikan di dalamnya.
Apa itu Lexical scope?Lexical scope adalah scope yang dibaca saat kode JavaScript melalui proses compile, atau sering disebut compile-time. Lexical scope ini yang mengatur di scope mana kita harus mencari sebuah variable.
|