Gambar 1. Pengenalan JavaScript.
JavaScript adalah bahasa pemrograman yang sangat populer dan banyak digunakan dalam pengembangan situs web. Sebagian besar situs web yang ada saat ini menggunakan JavaScript untuk memberikan interaktivitas dan fungsionalitas yang lebih baik kepada pengguna. Selain itu, JavaScript juga memiliki beragam framework dan library yang memudahkan pengembangan aplikasi web. Dengan memahami dasar-dasar JavaScript, kalian akan lebih mudah mempelajari dan menggunakan berbagai framework dan library tersebut.
JavaScript merupakan salah satu bahasa pemrograman yang cukup bersejarah, karena ia sudah hadir sejak tahun 1995. Pada awalnya, JavaScript bernama Mocca, kemudian berganti nama menjadi LiveScript sebelum akhirnya diberi nama JavaScript setelah disetujui oleh standar EcmaScript. EcmaScript adalah standar yang ditetapkan oleh organisasi European Computer Manufacturers Association (ECMA) untuk mengatur sintaks, fitur, dan perilaku JavaScript. Versi EcmaScript yang paling banyak digunakan adalah ES6, yang dirilis pada tahun 2015. ES6 atau dikenal juga sebagai ECMAScript 2015 menghadirkan banyak perubahan dan peningkatan signifikan dalam bahasa JavaScript.
JavaScript juga merupakan jenis bahasa scripting, yang berarti ia digunakan sebagai bagian dari program yang lebih besar, seperti web browser. Artinya, JavaScript hanya dapat digunakan dalam program tersebut. Selain itu, JavaScript juga merupakan bahasa yang ditulis secara dinamis (dynamically typed). Hal ini berarti bahwa satu variabel dalam program JavaScript dapat berisi tipe data yang berbeda. Anda dapat mengisi variabel dengan angka dan kemudian mengubahnya menjadi huruf tanpa mengalami kesalahan.
Gambar 2. Penjelasan interpreter.
Untuk menjalankan JavaScript, diperlukan interpreter. Interpreter ini akan menerjemahkan kode JavaScript ke dalam bahasa yang dapat dimengerti oleh komputer agar dapat dijalankan. Penerjemahan ini dilakukan secara otomatis oleh web browser saat halaman web yang mengandung kode JavaScript diakses.
Sebelum kita melangkah ke dalam dunia coding JavaScript yang menarik, ada beberapa konsep dasar yang penting untuk dipahami. Mari kita bahas!
Ada beberapa konsep dasar yang perlu kita patuhi dalam penulisan kode javascript. Yaitu:
a. Whitespace
Gambar 3. Penggunaan whitespace.
Whitespace mengacu pada area kosong yang terdiri dari karakter-karakter tidak terlihat seperti spasi, tab, atau enter dalam JavaScript atau bisa dilihat pada gambar 3.. Whitespace ini memiliki peran penting dalam menjaga tata letak kode agar terlihat lebih rapi dan teratur. Penggunaan whitespace tidak akan mempengaruhi ukuran file JavaScript secara signifikan, sehingga tidak perlu khawatir akan berdampak pada kinerja website. Selain itu, saat browser menjalankan JavaScript, Whitespace akan diabaikan, sehingga tidak mempengaruhi eksekusi kode secara langsung.
b. Line Length
Gambar 4. Penggunaan line length.
Line length mengacu pada jumlah karakter dalam satu baris kode JavaScript. Untuk menciptakan pengalaman coding JavaScript yang lebih nyaman, idealnya satu baris kode sebaiknya tidak melebihi 80 karakter. Jika sebuah perintah JavaScript terlalu panjang untuk muat dalam satu baris, sebaiknya potong perintah tersebut menjadi dua baris. Disarankan untuk memotong perintah setelah operator (+, -, =) atau koma (,) atau bisa dilihat pada gambar 4.
c. Comments
Gambar 5. Penggunaan komentar.
Komentar membantu kita mencatat tujuan dari satu atau beberapa baris kode. Komentar dalam JavaScript memainkan peran penting dalam menjelaskan maksud atau fungsi dari kode kita. Dengan menggunakan komentar yang baik, kita bisa memberikan konteks yang berharga kepada diri sendiri dan juga kepada orang lain yang membaca kode tersebut. Komentar satu baris dituliskan dengan menambahkan // pada awal penulisan komentar. Kita juga dapat menuliskan komentar multi baris dengan menambahkan /* pada awal komentar dan ditutup dengan */ pada akhir komentar seperti pada gambar 5.
d. Case Sensitive
Gambar 6. Penggunaan case sensitive.
Case Sensitive membedakan penulisan antara huruf besar dan huruf kecil. Misalnya, sebuah variabel bernama 'helloworld' dianggap berbeda dengan 'HelloWorld' seperti gambar 6. Untuk itu, sangat penting bagi kita untuk tetap konsisten dalam menulis kode. Walaupun terlihat seperti perbedaan kecil, kesalahan penulisan dapat menyebabkan masalah pada website kalian.
e. Statement Rules
Gambar 7. Penggunaan statement rules.
Dalam dunia pemrograman, sebuah pernyataan (statement) dapat dianggap sebagai instruksi atau langkah-langkah kerja yang harus dilakukan oleh program. Aturan pertama yang perlu diketahui adalah simple statement. Simple statement adalah pernyataan sederhana yang biasanya terdiri dari satu baris kode dan diakhiri dengan tanda titik koma (;). Namun, perlu diketahui bahwa penggunaan tanda titik koma (;) pada akhir setiap simple statement bersifat opsional dalam JavaScript. JavaScript memiliki mekanisme yang disebut "automatic semicolon insertion" yang secara otomatis akan menambahkan tanda titik koma jika diperlukan seperti pada gambar 7.
f. Reserved Words
Reserved Words adalah kata-kata khusus yang sudah ditentukan di dalam bahasa JavaScript dan digunakan untuk menjalankan perintah-perintah bawaan atau fitur-fitur tertentu yang telah tersedia. Oleh karena itu, kita tidak diperbolehkan menggunakan Reserved Words sebagai nama variabel atau fungsi dalam kode kita. Mengapa kita harus memperhatikan Reserved Words? Hal ini dikarenakan JavaScript akan menganggap kata-kata tersebut memiliki makna khusus, dan jika kita menggunakan Reserved Words sebagai nama variabel atau fungsi, akan menyebabkan kebingungan atau bahkan kesalahan dalam eksekusi kode.
Berikut ini adalah daftar kata-kata reserved words pada JavaScript:
abstract |
arguments |
await* |
boolean |
break |
byte |
case |
catch |
char |
class* |
const |
continue |
debugger |
default |
delete |
do |
double |
else |
enum* |
eval |
export* |
extends* |
false |
final |
finally |
float |
for |
function |
goto |
if |
implements |
import* |
in |
instanceof |
int |
interface |
let* |
long |
native |
new |
null |
package |
private |
protected |
public |
return |
shirt |
static |
super* |
switch |
synchronized |
this |
throw |
throws |
transient |
true |
try |
typeof |
var |
void |
volatile |
while |
with |
yield |
Kata-kata dengan tanda * merupakan kata-kata baru di ECMAScript 5 dan 6. Lalu berikut adalah objects, properties, dan methods bawaan dari JavaScript:
Array |
Date |
eval |
function |
hasOwnProperty |
Infinity |
isFinite |
isNan |
isPrototypeOf |
length |
Math |
NaN |
name |
Number |
Object |
protoype |
String |
toString |
undefined |
valueOf |
Berikut adalah reserved words dari properties dan object Java yang juga harus dihindari penggunaannya:
getClass |
java |
JavaArray |
javaClass |
JavaObject |
JavaPackage |
|
|
Karena JavaScript sering digunakan bersamaan dengan aplikasi lain sehingga terdapat beberapa penggunaan nama objek dan properti HTML dan Windows yang harus dihindari, seperti:
alert |
all |
anchor |
anchors |
area |
assign |
blur |
button |
checkbox |
clearInterval |
clearTimeout |
clientInformation |
close |
closed |
confirm |
constructor |
crypto |
decodeURI |
decodeURIComponent |
defaultStatus |
document |
element |
elements |
embed |
embeds |
encodeURI |
encodeURIComponent |
escape |
event |
fileUpload |
focus |
form |
forms |
frame |
innerHeight |
innerWidth |
layer |
layers |
link |
location |
mimeTypes |
navigate |
navigator |
frames |
frameRate |
hidden |
history |
image |
images |
offscreenBuffering |
open |
opener |
option |
outerHeight |
outerWidth |
packages |
pageXOffset |
pageYOffset |
parent |
parseFloat |
parseInt |
password |
pkcs11 |
plugin |
prompt |
propertyIsEnum |
radio |
reset |
screenX |
screenY |
scroll |
secure |
select |
self |
setInter val |
setTimeout |
status |
submit |
taint |
text |
textarea |
top |
unescape |
untaint |
window |
|
|
|
Lalu terdapat beberapa reserved words yang digunakan oleh HTML event handlers:
onblur |
onclick |
onerror |
onfocus |
onkeydown |
onkeypress |
onkeyup |
onmouseover |
onload |
onmouseup |
onmousedown |
onsubmit |
Gambar 8. Penggunaan variabel.
Variabel adalah wadah ajaib dalam dunia pemrograman yang digunakan untuk menyimpan nilai atau data yang ingin kita gunakan. Jadi, bayangkan variabel sebagai suatu nama yang kita berikan kepada sebuah nilai/data atau bisa lihat gambar 8.
Variabel dapat menampung berbagai jenis nilai, seperti angka, teks, boolean, dan masih banyak lagi. Artinya, kita bisa menggunakan variabel untuk menyimpan angka favorit kita, kata-kata yang ingin kita tampilkan di layar, atau bahkan apakah suatu kondisi benar atau salah. Terdapat tiga Reserved Words yang dapat digunakan untuk mendeklarasikan variabel yaitu var, let, dan const.
Saat kita belajar JavaScript, terdapat tiga tahap penting dalam penggunaan variabel, yaitu:
Gambar 9. Tahapan dalam penggunaan variabel.
a. Declaration
Tahap ini melibatkan pendaftaran variabel ke dalam program yang kita tulis.
b. Initialization
Tahap ini melibatkan penyiapan memori yang akan digunakan oleh variabel.
c. Assignment
Tahap ini melibatkan penetapan nilai spesifik yang akan disimpan dalam variabel.
Terdapat beberapa aturan yang perlu diperhatikan saat membuat variabel, yaitu:
a. Penggunaan Spasi
Gambar 10. Penggunaan underscore.
Jika nama variabel terdiri dari dua kata, hindari menggunakan spasi sebagai pemisah. Sebaiknya gunakan underscore (_) untuk memisah dua atau lebih kata atau bisa lihat gambar 10.
b. Awalan Angka
Gambar 11. Penggunaan awalan angka dalam penamaan variabel.
Angka tidak boleh digunakan sebagai awalan nama variabel, tetapi dapat digunakan untuk mengakhiri nama variabel atau bisa lihat gambar 11.
c. Penggunaan camelCase
Gambar 12. Penggunaan camelcase.
camelCase adalah konvensi penulisan variabel yang direkomendasikan. Format dasarnya adalah dengan menggunakan huruf kecil untuk seluruh kata pertama dan huruf kapital untuk huruf pertama pada kata kedua atau bisa lihat gambar 12.
d. Penggunaan Shorthand
Gambar 13. Penggunaan shorthand.
Shorthand adalah metode yang digunakan untuk mempersingkat penulisan variabel. Hal ini berguna untuk membuat kode program menjadi lebih ringkas. Dengan menggunakan Shorthand, kita tidak perlu menuliskan kata kunci var pada 'age' dan 'pass', meskipun keduanya tetap merupakan variabel atau bisa lihat gambar 13.
Tipe data digunakan untuk mendefinisikan jenis nilai yang dapat disimpan dalam variabel. Beberapa tipe data dasar dalam JavaScript meliputi:
a. Number
Gambar 14. Tipe data number.
Berbeda dengan bahasa pemrograman lain, JavaScript memiliki pendekatan yang lebih sederhana dalam hal tipe data angka. Di JavaScript, kita tidak perlu memikirkan jenis angka seperti integer, float, atau long seperti pada gambar 14. Sebaliknya, JavaScript hanya memiliki satu jenis tipe data angka yang disebut "number". Tipe data number dalam JavaScript dapat menyimpan nilai angka dengan presisi hingga 64 bit.
b. String
Gambar 15. Tipe data string.
Di JavaScript, kita menggunakan tipe data string untuk menyimpan data teks atau kata-kata. Untuk membuat string, kita perlu menambahkan tanda petik di sekitar teks tersebut. Kita bisa menggunakan petik dua (" ") atau petik satu (' ') untuk tujuan ini atau bisa lihat gambar 15. Sebenarnya, tidak ada aturan yang baku yang mengatur kapan kita harus menggunakan petik dua atau petik satu. Namun, umumnya disarankan untuk menggunakan petik dua (" ") untuk penulisan string. Ini dikarenakan penggunaan petik dua lebih umum dan lebih konsisten dalam komunitas JavaScript.
c. Boolean
Gambar 16. Tipe data boolean.
Boolean adalah salah satu tipe data penting dalam JavaScript yang digunakan untuk mengungkapkan nilai logika. Tipe data ini hanya memiliki dua nilai, yaitu true (benar) atau false (salah) seperti pada gambar 16. Dengan menggunakan tipe data boolean, kita dapat membuat pengambilan keputusan dan mengatur alur kerja program. Misalnya, kita bisa menggunakan tipe data Boolean untuk menentukan kondisi-kondisi tertentu dalam program. Jika suatu kondisi bernilai true, maka aksi tertentu dapat dilakukan. Namun, jika kondisi tersebut bernilai false, maka aksi tersebut dapat diabaikan.
d. Null
Gambar 17. Tipe data null.
Null adalah tipe data khusus dalam JavaScript yang digunakan untuk menunjukkan bahwa suatu variabel tidak memiliki nilai atau kosong. Ketika kita mendefinisikan variabel dengan nilai null, itu berarti variabel tersebut tidak mengandung data apapun atau bisa lihat gambar 17.
Misalnya, kita dapat menggunakan null untuk menandakan bahwa suatu variabel tidak memiliki referensi ke objek atau nilai yang valid. Null sering digunakan saat kita ingin secara eksplisit menetapkan bahwa variabel tidak memiliki nilai yang berguna pada saat itu. Perlu diperhatikan bahwa null bukanlah string kosong (" ") atau angka nol (0). Null adalah nilai yang secara khusus menunjukkan ketiadaan nilai.
e. Undefined
Gambar 18. Tipe data undefined
Undefined adalah tipe data special dalam JavaScript yang menunjukkan bahwa suatu variabel belum diinisialisasi atau tidak memiliki nilai. Ketika kita mendeklarasikan sebuah variabel tanpa memberikan nilai awal, secara otomatis variabel tersebut akan memiliki nilai undefined. Perlu diingat bahwa undefined adalah nilai yang diberikan secara otomatis pada variabel yang belum diinisialisasi atau pada situasi tertentu seperti fungsi tanpa pernyataan return atau properti objek yang tidak didefinisikan.
Dalam pengembangan aplikasi, penting untuk mengelola variabel dengan baik dan memastikan bahwa mereka memiliki nilai yang valid. Jika kita ingin menunjukkan bahwa suatu variabel tidak memiliki nilai, lebih baik menggunakan null daripada mengandalkan undefined secara implisit.
Struktur kontrol dalam JavaScript digunakan untuk mengatur alur eksekusi program berdasarkan kondisi-kondisi tertentu atau melakukan pengulangan terhadap blok kode tertentu. Ada beberapa struktur kontrol yang umum digunakan dalam JavaScript, yaitu:
a. Pernyataan if-else
Gambar 19. Percabangan if-else.
Percabangan if-else adalah salah satu konsep dasar dalam pemrograman yang digunakan untuk membuat keputusan berdasarkan kondisi yang diberikan. Dalam JavaScript, if-else digunakan untuk mengontrol alur eksekusi program, di mana blok kode akan dieksekusi jika kondisi tertentu terpenuhi, dan blok kode lainnya akan dieksekusi jika kondisi tersebut tidak terpenuhi.
Gambar 20. Contoh penggunaan if-else
Pada program di gambar 20, kita menggunakan if-else untuk memeriksa apakah nilai angka lebih besar dari 10. Jika kondisi angka > 10 bernilai salah, maka blok kode dalam else akan dieksekusi dan "Angka tidak lebih besar dari 10" akan ditampilkan.
b. Pernyataan switch-case
Gambar 21. Percabangan switch-case.
Percabangan switch-case adalah salah satu konstruksi kontrol dalam JavaScript yang digunakan untuk memilih aksi yang berbeda berdasarkan nilai ekspresi yang diberikan. Jika nilai ekspresi cocok dengan salah satu kasus yang didefinisikan, blok kode yang terkait dengan kasus tersebut akan dieksekusi.
Gambar 22. Contoh penggunaan switch-case.
Pada program di gambar 22, switch-case digunakan untuk menentukan rasa buah berdasarkan nilai variabel buah dan mengubah nilai variabel rasa sesuai dengan pilihan yang dipilih.
c. Perulangan for
Gambar 23. Perulangan for.
Perulangan for adalah salah satu struktur pengulangan yang digunakan dalam JavaScript untuk mengulangi blok kode tertentu sejumlah kali. Perulangan ini berguna saat kita ingin melakukan tugas yang sama secara berulang berdasarkan kondisi atau iterasi.
Gambar 24. Contoh penggunaan for.
Pada program di gambar 24, perulangan for digunakan untuk mencetak setiap elemen dalam array fruits. Variabel i diinisialisasi dengan nilai awal 0, kondisi i < fruits.length akan dievaluasi sebelum setiap iterasi, dan variabel i akan ditingkatkan dengan 1 setiap kali iterasi selesai. Di dalam blok kode, kita menggunakan fruits[i] untuk mengakses dan mencetak elemen-elemen array.
d. Perulangan while
Gambar 25.
Perulangan while.
Perulangan while adalah salah satu struktur pengulangan yang digunakan dalam JavaScript untuk mengulangi blok kode tertentu selama kondisi yang ditentukan bernilai benar (true). Perulangan ini berguna ketika kita tidak tahu berapa kali kita perlu mengulangi tugas, tetapi kita hanya ingin melanjutkan selama kondisi terpenuhi.
Gambar 26. Contoh penggunaan while.
Pada program di gambar 26, perulangan while akan mengeksekusi blok kode yang mencetak pesan "Iterasi ke-" ditambah nomor iterasi dari 1 hingga 5. Variabel i diinisialisasi dengan nilai awal 1, dan setiap kali iterasi selesai, nilai i ditingkatkan dengan 1. Perulangan akan terus berlanjut selama kondisi i <= 5 bernilai benar.
e. Perulangan do-while
Gambar 27. Perulangan do-while.
Perulangan do-while adalah salah satu struktur pengulangan yang digunakan dalam JavaScript untuk mengulangi blok kode tertentu setidaknya satu kali, kemudian dilanjutkan selama kondisi yang ditentukan masih bernilai benar (true). Perulangan ini berguna ketika kita ingin memastikan bahwa blok kode dijalankan setidaknya sekali sebelum memeriksa kondisi.
Gambar 28. Contoh penggunaan do-while.
Pada program di gambar 28, perulangan do-while akan mengeksekusi blok kode yang mencetak pesan "Iterasi ke-" ditambah nomor iterasi dari 1 hingga 5. Blok kode akan dijalankan setidaknya sekali sebelum memeriksa kondisi. Variabel i diinisialisasi dengan nilai awal 1, dan setiap kali iterasi selesai, nilai i ditingkatkan dengan 1. Perulangan akan berlanjut selama kondisi i <= 5 bernilai benar.
f. Perulangan forin
Gambar 29. Perulangan forin.
Perulangan forin digunakan dalam JavaScript untuk mengulangi setiap properti yang dapat di enumerasi dari sebuah objek. Properti yang di enumerasi dapat berupa properti milik objek itu sendiri maupun properti yang diwarisi dari prototype objek.
Gambar 30. Contoh penggunaan forin.
Pada program di gambar 30, perulangan for-in digunakan untuk mengulangi setiap properti pada objek person. Pada setiap iterasi, properti disimpan dalam variabel prop, dan nilai properti diakses menggunakan person[prop]. Dalam contoh ini, kita mencetak nama properti beserta nilainya menggunakan console.log().
g. Perulangan forof
Gambar 31. Perulangan forof.
Perulangan for...of adalah fitur baru dalam JavaScript yang memungkinkan kita mengulangi elemen-elemen dari struktur data yang dapat diiterasi seperti array, string, objek iterable, dan lainnya. Perulangan ini memberikan cara yang lebih sederhana dan ekspresif untuk mengakses setiap elemen dalam struktur data.
Gambar 32. Contoh penggunaan forof.
Pada program di gambar 32, perulangan for...of digunakan untuk mengulangi setiap elemen dalam array fruits. Setiap elemen disimpan dalam variabel fruit, dan kemudian dicetak menggunakan console.log().
h. Perulangan trycatch
Gambar 33. Perulangan trycatch
Perulangan try...catch adalah fitur dalam JavaScript yang digunakan untuk menangani kesalahan atau exception yang mungkin terjadi dalam blok kode. Dengan menggunakan try...catch, kita dapat mencoba menjalankan potensi kode yang memicu kesalahan dan menangkap serta mengelola kesalahan tersebut dengan cara yang terkontrol.
Gambar 34. Contoh penggunaan trycatch.
Pada program di gambar 34, kita mencoba membagi angka 10 dengan 0, yang akan memicu kesalahan pembagian oleh nol. Dalam blok try, kesalahan tersebut ditangkap dan di-handle di dalam blok catch. Pesan kesalahan error.message dicetak ke console.log().
Function dalam JavaScript adalah blok kode yang dapat dipanggil atau dieksekusi secara berulang dengan memberikan nilai input dan mengembalikan nilai output tertentu. Function memungkinkan kita untuk memecah kode menjadi bagian-bagian yang lebih kecil, modular, dan dapat digunakan kembali. Ada beberapa hal yang perlu diperhatikan dalam menggunakan function, yaitu:
a. Pendefinisian function
Gambar 35. Mendefinisikan function.
Pada program di gambar 35, function didefinisikan dengan menggunakan kata kunci function, diikuti dengan nama function dan tanda kurung . Blok kode function diapit oleh kurung kurawal { }.
b. Pemanggilan function
Gambar 36. Pemanggilan function.
Pada program di gambar 36, untuk menjalankan kode dalam function, kita perlu memanggilnya dengan menggunakan nama fungsi diikuti tanda kurung .
c. Parameter dan argumen
Gambar 37. Parameter dan argumen dalam function.
Function dapat menerima parameter, yaitu nilai yang diberikan saat memanggil function. Parameter digunakan untuk mengirimkan data ke dalam function. Ketika function dipanggil, parameter diisi dengan argumen yang diberikan.
d. Nilai kembalian
Gambar 38. Penggunaan return pada function.
Function dapat mengembalikan nilai menggunakan kata kunci return. Nilai kembalian digunakan untuk mengirimkan hasil atau output dari function ke tempat pemanggilan.
e. Function sebagai nilai
Gambar 39. Function sebagai nilai.
Di JavaScript, function juga dapat digunakan sebagai nilai dan disimpan dalam variabel. Kita dapat memanfaatkan hal ini untuk mengirim function sebagai argumen ke function lainnya atau menyimpan fungsi dalam struktur data.
f. Function rekursif
Gambar 40. Function rekursif.
Function rekursif adalah function yang memanggil dirinya sendiri. Ini memungkinkan kita untuk melakukan iterasi atau perulangan dalam cara yang terstruktur dan terkontrol atau bisa lihat gambar 40.
Dalam pemrograman JavaScript, terdapat dua konsep yang penting untuk kita pahami terkait dengan objek, yaitu this dan closure. Kenapa kita perlu memahami kedua konsep ini? Mempelajari konsep this dan closure pada pemrograman JavaScript sangat penting karena keduanya memiliki peran yang signifikan dalam pengembangan aplikasi JavaScript yang lebih kompleks. Mari kita bahas!
Gambar 41. Pengenalan this.
This adalah sebuah kata kunci yang digunakan dalam JavaScript untuk merujuk pada objek saat ini yang sedang dieksekusi. Dengan menggunakan this, kita dapat mengakses properti dan metode dari objek tersebut. Jadi, this memungkinkan objek untuk berinteraksi dengan data dan perilaku yang dimilikinya.
Misalnya, jika kita memiliki objek "mahasiswa" dengan properti "nama" dan metode "getInfo", kita dapat menggunakan this dalam metode tersebut untuk mengakses properti "nama" dari objek saat ini.
Gambar 42. Contoh penggunaan this.
Pada program di gambar 42, this digunakan untuk mengakses properti "nama" dan "umur" dari objek "mahasiswa" saat metode "getInfo" dipanggil.
Gambar 43. Lexical environment.
Closure merupakan kombinasi antara function dan lingkungan leksikal di mana function tersebut didefinisikan. Dalam JavaScript, setiap kali sebuah function dibuat, ia menyimpan referensi ke lingkungan leksikalnya. Hal ini memungkinkan function tersebut untuk mengakses variabel-variabel yang berada di lingkup yang sama dengan function tersebut, bahkan jika function itu dieksekusi di lingkup yang berbeda.
Misalnya, kita dapat membuat sebuah function yang mengembalikan function lain yang memiliki akses ke variabel di lingkungan leksikalnya. Dengan menggunakan closure, kita dapat membuat functions yang memiliki akses ke variabel-variabel tertentu, bahkan setelah function utama telah selesai dieksekusi.
Gambar 44. Contoh penggunaan closure.
Pada
program di gambar
44, function innerFunction merupakan sebuah closure karena ia memiliki akses ke
variabel outerVariable yang berada di
lingkungan luarannya (yaitu di dalam function
outerFunction). Meskipun outerFunction telah selesai
dieksekusi, variabel outerVariable masih dapat diakses
oleh innerFunction melalui mekanisme
closure. Ketika kita memanggil closureFunction, ia akan mencetak "Hello World!"
ke konsol.
Referensi
12 Konsep Dasar JavaScript yang Harus Diketahui Developer | WEBAPP | APPKEY
Panduan Belajar JavaScript Terlengkap untuk Pemula 2023 (niagahoster.co.id)
Struktur kendali JavaScript - Belajar Front-End Website (petik.net)