Pda tutorial sebelumnya,kita sudah membahas tentang Tutorial Belajar JavaScript Bagian 14 : Penjelasan Tipe Data Object di JavaScript. Dalam tutorial ini, kita akan belajar tentang 2 jenis nilai yang berbeda dalam JavaScript, yaitu primitive values dan reference values.

JavaScript memiliki dua jenis nilai yang berbeda:

• Primitive values (nilai primitive)
• Reference values (nilai referensi)

Primitive value adalah sebagian kecil dari data sedangkan refence value adalah objek yang mungkin terdiri dari beberapa nilai.

Stack dan Heap Memory

Saat Anda mendeklarasikan variabel, JavaScript mengalokasikan memori untuk variabel tersebut di dua lokasi memori: stack dan heap memory.

Data statis adalah data yang ukurannya tetap pada waktu kompilasi. Data statis meliputi:

• Primitive value (null, undefined, boolean, number, string, symbol, dan BigInt)
• Reference value yang merujuk ke object.

Karena data statis memiliki ukuran yang tidak berubah, JavaScript mengalokasikan ruang memori dalam jumlah tetap ke data statis dan menyimpannya di stack.

Misalnya, berikut ini mendeklarasikan 2 variabel dan menginisialisasi nilainya menjadi string dan angka :

let name = 'John';
let age = 25;

Karena name dan age adalah nilai primitif, JavaScript menyimpan variabel-variabel ini di stack seperti yang ditunjukkan pada gambar berikut :

Berbeda dengan stack, JavaScript menyimpan objek (dan fungsi) di heap. JavaScript tidak mengalokasikan jumlah memori tetap untuk objek ini. Sebaliknya, akan mengalokasikan lebih banyak ruang sesuai kebutuhan.

Contoh berikut mendefinisikan variabel name, age, dan person :

let name = 'John';
let age = 25;
let person = {
   name: 'Yohanes',
   age: 25,
};

Secara internal, JavaScript mengalokasikan memori seperti yang ditunjukkan pada gambar berikut:

Pada gambar ini, JavaScript mengalokasikan memori pada stack untuk tiga variabel name, age, dan person.

JavaScript membuat objek baru di memori heap. Juga, menghubungkan variabel person pada memori tumpukan ke objek pada memori tumpukan.

Karena itu, kita mengatakan bahwa variabel person adalah referensi yang merujuk ke suatu objek.

Sifat dinamis

Nilai referensi memungkinkan Anda untuk menambah, mengubah, atau menghapus properti kapan saja. Sebagai contoh:

let person = {
   name: 'Yohanes',
   age: 25,
};
// tambahkan properti ssn
person.ssn = '123-45-6789';

// ganti name
person.name = 'John Doe';

// hapus properti age
delete person.age;

console.log(person);

Hasil :

{ name: 'John Doe', ssn: '123-45-6789' }

Tidak seperti nilai referensi, nilai primitif tidak dapat memiliki properti. Ini berarti Anda tidak dapat menambahkan properti ke nilai primitif.

JavaScript memungkinkan Anda menambahkan properti ke nilai primitif. Namun, itu tidak akan berpengaruh. Sebagai contoh :

let name = 'Johan';
name.alias = 'Ksatria';
console.log(name.alias); // undefined

Hasil:

undefined

Dalam contoh ini, kami menambahkan properti alias ke nilai primitif name. Tetapi ketika kita mengakses properti alias melalui nilai primitif name, ia mengembalikan undefined.

Menyalin nilai

Saat Anda menetapkan nilai primitif dari satu variabel ke variabel lain, JavaScript akan membuat salinan dari nilai tersebut dan menetapkannya ke variabel. Sebagai contoh:

let age = 25;
let newAge = age;

Dalam contoh ini:

• Pertama, deklarasikan variabel baru age dan inisialisasi nilainya dengan 25.
• Kedua, deklarasikan variabel newAge lain dan tetapkan age ke variabel newAge.
• Di belakang layar, mesin JavaScript membuat salinan dari nilai primitif 25 dan menugaskannya ke variabel newAge.

Gambar berikut mengilustrasikan memori tumpukan setelah penugasan:

Pada memori stack, newAge dan age adalah variabel terpisah. Jika Anda mengubah nilai satu variabel, itu tidak akan memengaruhi yang lain.

Sebagai contoh:

let age = 25;
let newAge = age;
newAge = newAge + 1;
console.log(age, newAge);

Saat Anda menetapkan nilai referensi dari satu variabel ke variabel lain, JavaScript membuat referensi sehingga kedua variabel merujuk ke objek yang sama di memori heap. Ini berarti bahwa jika Anda mengubah satu variabel, itu akan memengaruhi variabel lainnya.

Sebagai contoh:

let person = {
   name: 'Yohanes',
   age: 25,
};
let member = person;
member.age = 26;
console.log(person);
console.log(member);

Bagaimana itu cara kerjanya.

Pertama, deklarasikan variabel person dan inisialisasi nilainya dengan objek dengan dua properti name dan age.

Kedua, tetapkan variabel person ke variabel member. Di memori, kedua variabel mereferensikan objek yang sama, seperti yang ditunjukkan pada gambar berikut:

Ketiga, ubah properti age object melalui variabel member:

Karena variabel person dan member mereferensikan objek yang sama, mengubah object melalui variabel member juga tercermin dalam variabel person.

Kesimpulan

• Javascript memiliki dua jenis nilai: nilai primitif dan nilai referensi.
• Anda dapat menambahkan, mengubah, atau menghapus properti ke nilai referensi, sedangkan Anda tidak dapat melakukannya dengan nilai primitif.
• Menyalin nilai primitif dari satu variabel ke variabel lainnya membuat salinan nilai terpisah. Ini berarti bahwa mengubah nilai dalam satu variabel tidak mempengaruhi yang lain.
• Menyalin referensi dari satu variabel ke variabel lainnya membuat referensi sehingga dua variabel merujuk ke object yang sama. Ini berarti bahwa mengubah object melalui satu variabel mencerminkan variabel lain.

Demikian penjelasan tentang primitive value dibandingkan dengan reference value dalam JavaScript. Semoga tutorial ini bisa membantu Anda untuk memahami tentang primitive value dan reference value.