Javascript Remove Element From Array Of Objects By Key

Javascript Remove Element From Array Of Objects By Key

4 min read Jun 20, 2024
Javascript Remove Element From Array Of Objects By Key

Cara Menghapus Elemen dari Array Objek Berdasarkan Kunci di JavaScript

Dalam pengembangan web, sering kali kita perlu memanipulasi data yang disimpan dalam array objek. Salah satu manipulasi yang umum dilakukan adalah menghapus elemen dari array berdasarkan kunci tertentu. Artikel ini akan membahas cara menghapus elemen dari array objek berdasarkan kunci di JavaScript.

Metode Filter

Metode filter() merupakan cara yang umum dan efisien untuk menghapus elemen dari array berdasarkan kondisi tertentu. Berikut contoh kode untuk menghapus elemen dari array objek berdasarkan kunci id:

const items = [
  { id: 1, name: 'Item 1' },
  { id: 2, name: 'Item 2' },
  { id: 3, name: 'Item 3' },
];

const idToRemove = 2;

const filteredItems = items.filter(item => item.id !== idToRemove);

console.log(filteredItems);
// Output:
// [
//   { id: 1, name: 'Item 1' },
//   { id: 3, name: 'Item 3' },
// ]

Kode di atas bekerja dengan:

  1. Mendefinisikan array items yang berisi objek-objek yang ingin dihapus.
  2. Mendefinisikan idToRemove yang merupakan kunci untuk menentukan elemen yang ingin dihapus.
  3. Menggunakan filter() untuk membuat array baru (filteredItems) yang berisi hanya objek-objek yang tidak memiliki id yang sama dengan idToRemove.
  4. Mengembalikan array filteredItems yang telah dihapus elemennya.

Metode splice()

Metode splice() dapat digunakan untuk menghapus elemen dari array berdasarkan indeks. Jika kita ingin menghapus elemen berdasarkan kunci, kita perlu mencari indeks objek terlebih dahulu.

const items = [
  { id: 1, name: 'Item 1' },
  { id: 2, name: 'Item 2' },
  { id: 3, name: 'Item 3' },
];

const idToRemove = 2;

const indexToRemove = items.findIndex(item => item.id === idToRemove);

if (indexToRemove !== -1) {
  items.splice(indexToRemove, 1);
}

console.log(items);
// Output:
// [
//   { id: 1, name: 'Item 1' },
//   { id: 3, name: 'Item 3' },
// ]

Kode di atas bekerja dengan:

  1. Mendefinisikan array items yang berisi objek-objek yang ingin dihapus.
  2. Mendefinisikan idToRemove yang merupakan kunci untuk menentukan elemen yang ingin dihapus.
  3. Menggunakan findIndex() untuk mencari indeks objek yang memiliki id yang sama dengan idToRemove.
  4. Jika indeks ditemukan (indexToRemove !== -1)
    • Gunakan splice() untuk menghapus elemen pada indeks tersebut.
  5. Mengembalikan array items yang telah dihapus elemennya.

Penjelasan

Kedua metode ini memiliki keunggulan dan kekurangan masing-masing:

Metode filter():

  • Kelebihan: Lebih mudah dipahami dan lebih efisien untuk kasus sederhana.
  • Kekurangan: Membuat array baru, sehingga tidak mengubah array asli.

Metode splice():

  • Kelebihan: Mengubah array asli secara langsung.
  • Kekurangan: Membutuhkan pencarian indeks terlebih dahulu, sehingga mungkin tidak efisien untuk data yang besar.

Kesimpulan

Memilih metode yang tepat untuk menghapus elemen dari array objek berdasarkan kunci tergantung pada kebutuhan dan preferensi Anda. Metode filter() lebih mudah dipahami dan lebih efisien untuk kasus sederhana, sedangkan splice() lebih cocok untuk mengubah array asli secara langsung.