Memahami Immutable Array dalam JavaScript

   March 19, 2025       Mahatma Mahardhika

---

Memahami Immutable Array dalam JavaScript

Daftar Isi

• Apa Itu Immutable Array?
• Mengapa Menggunakan Immutable Array?
• Metode Immutable dalam Array
  • Menggunakan map()
  • Menggunakan filter()
  • Menggunakan concat()
  • Menggunakan Spread Operator
• Contoh Kasus
• Keuntungan Menggunakan Immutable Array
• Kesimpulan

Apa Itu Immutable Array?

Immutable Array adalah array yang tidak diubah secara langsung saat dimodifikasi. Alih-alih mengubah array asli, metode immutable membuat salinan baru dari array dengan perubahan yang diterapkan.

Mengapa Menggunakan Immutable Array?

• Menghindari Mutasi Data: Mencegah perubahan tidak disengaja pada data asli.
• Meningkatkan Keandalan Kode: Memudahkan debugging karena data tidak berubah secara tidak terduga.
• Mendukung Pemrograman Fungsional: Menggunakan metode seperti map(), filter(), dan reduce() untuk transformasi data.

Metode Immutable dalam Array

1. Menggunakan map()

Metode map() membuat array baru dengan menerapkan fungsi pada setiap elemen:

const numbers = [1, 2, 3];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // Output: [2, 4, 6]

2. Menggunakan filter()

Metode filter() membuat array baru dengan hanya elemen yang memenuhi kondisi tertentu:

const numbers = [1, 2, 3, 4];
const evens = numbers.filter(num => num % 2 === 0);
console.log(evens); // Output: [2, 4]

3. Menggunakan concat()

Metode concat() menggabungkan array tanpa mengubah yang asli:

const arr1 = [1, 2];
const arr2 = [3, 4];
const combined = arr1.concat(arr2);
console.log(combined); // Output: [1, 2, 3, 4]

4. Menggunakan Spread Operator

Spread operator (...) memungkinkan pembuatan array baru dengan menyalin elemen dari array lama:

const numbers = [1, 2, 3];
const newNumbers = [...numbers, 4];
console.log(newNumbers); // Output: [1, 2, 3, 4]

Contoh Kasus

Kasus: Menambahkan Elemen ke dalam Daftar Produk

Misalkan kita memiliki daftar produk dan ingin menambahkan produk baru tanpa mengubah daftar asli:

const products = [
    { id: 1, name: "Laptop" },
    { id: 2, name: "Mouse" }
];
const newProduct = { id: 3, name: "Keyboard" };
const updatedProducts = [...products, newProduct];
console.log(updatedProducts);
// Output: [{ id: 1, name: "Laptop" }, { id: 2, name: "Mouse" }, { id: 3, name: "Keyboard" }]

Keuntungan Menggunakan Immutable Array

• Lebih Aman: Menghindari efek samping akibat perubahan data.
• Mendukung State Management: Berguna dalam framework seperti React dan Redux.
• Memudahkan Debugging: Perubahan data lebih mudah dilacak.

Kesimpulan

Immutable Array adalah pendekatan yang efektif dalam JavaScript untuk menghindari mutasi data. Dengan menggunakan metode seperti map(), filter(), dan spread operator, kita dapat mengelola array dengan lebih aman dan lebih mudah dipahami.