Mengenal Mutable dan Immutable di Javascript.

Pada kali ini saya ingin berbagi tulisan tentang penggunaan mutable dan immutable di javascipt.

Immutable dan Mutable

Immutable merupakan tipe variabel yang tidak bisa diubah. Tipe data yang termasuk immutable adalah string, boolean, null, undefined, dan number. Sedangkan mutable merupakan tipe variabel yang bisa diubah. Di javascript tipe data object dan array merupakan mutable.

Untuk memahami immutable mari kita lihat contoh aplikasinya pada di tipe variabel string, object, dan array berikut.

let immutableString = "hello";
let newImmutableString = immutableString;
newImmutableString = newImmutableString + " world";
console.log(immutableString); //hello
console.log(newImmutableString);   //hello world

Selanjutnya mari kita lihat apa yang terjadi jika metode di atas kita terapkan di tipe data object.

let emlopyees = {'name' : 'zakuan', 'age' :27 }
let newEmlopyees = emlopyees
newEmlopyees.name= 'Muhammad Zakuan'
console.log(newEmlopyees) // {'name' : 'zakuan', 'age' : 27 }
console.log(emlopyees) // {'name' : 'zakuan', 'age' : 27 }

Hasil print pada pada variabel newEmployees dan employees menunjukkan nilai yang sama. Ini terjadi karena javscript hanya menyalin referencenya saja, tidak dengan nilainya. Kedua variabel employees dan newEmployees masih menggunakan memory yang sama. Dengan demikian maka object bersifat mutable.

Kasus ini berbeda dengan kasus sebelumnya pada tipe data string atau number, yang mana variabel newImmutableString ditampung di memory yang baru. Sehingga tidak merubah nilai dari variabel immutableString. Dengan demikian maka tipe data string dan number bersifat immutable.

Immutable pada object

Untuk memahami immutable pada object, mari kita lihat contoh berikut.

let emlopyees = {'name' : 'zakuan', 'age' : 27 }
let newEmlopyees = Object.assign({}, emlopyees);
newEmlopyees.name= 'Muhammad Zakuan'
console.log(newEmlopyees)//{'name' : 'Muhammad Zakuan', 'age' : 27 }
console.log(emlopyees) // {'name' : 'zakuan', 'age' : 27 }

Pada kasus di atas, awalnya suatu nilai object diassign ke variabel employees. Kemudian pada baris kedua, reference beserta nilai dari object employees disalin ke object newEmployees menggunakan perintah Object.assign(). Object.assign() digunakan untuk menyalin reference dan nilai ke object baru tanpa menggunakan nilai yang sama dengan yang lama. Sehingga dua object newEmployees dan employees menghasilkan nilai yang berbeda.

Sekian tutorialnya , sebagai latihan bisa dicoba penggunaan mutable pada number dan immutable pada array.

Semoga bermanfaat …