Add Object To Array Javascript At Index

MUAZHAN

5 min read

·

Jun 22, 2024

39

Share

Menambahkan Objek ke Array di JavaScript pada Index Tertentu

Dalam JavaScript, Anda seringkali perlu menambahkan objek baru ke dalam array di posisi tertentu. Ini bisa berguna saat Anda ingin menyisipkan data baru di tengah array tanpa mengganggu urutan elemen yang ada.

Berikut adalah beberapa cara untuk menambahkan objek ke array di JavaScript pada index tertentu:

1. Menggunakan splice()

Metode splice() memungkinkan Anda untuk menambahkan, menghapus, dan mengganti elemen dalam array. Untuk menambahkan objek pada index tertentu, Anda dapat menggunakan syntax berikut:

const myArray = ['apel', 'jeruk', 'pisang'];

// Menambahkan objek 'mangga' pada index 1
myArray.splice(1, 0, { nama: 'mangga', warna: 'kuning' });

console.log(myArray); // Output: ['apel', { nama: 'mangga', warna: 'kuning' }, 'jeruk', 'pisang']

Penjelasan:

• splice(1, 0, { nama: 'mangga', warna: 'kuning' }):
  • 1: Menentukan index tempat objek akan dimasukkan.
  • 0: Menentukan jumlah elemen yang akan dihapus (dalam kasus ini, tidak ada yang dihapus).
  • { nama: 'mangga', warna: 'kuning' }: Objek yang akan ditambahkan.

2. Menggunakan destructuring assignment

Destructuring assignment memberikan cara yang lebih ringkas untuk menambahkan objek ke array pada index tertentu. Anda dapat menggunakan syntax berikut:

const myArray = ['apel', 'jeruk', 'pisang'];

// Menambahkan objek 'mangga' pada index 1
const [first, ...rest] = myArray;
const newMyArray = [first, { nama: 'mangga', warna: 'kuning' }, ...rest];

console.log(newMyArray); // Output: ['apel', { nama: 'mangga', warna: 'kuning' }, 'jeruk', 'pisang']

Penjelasan:

• const [first, ...rest] = myArray: Memisahkan elemen pertama (first) dari array dan sisanya (rest) ke dalam variabel baru.
• const newMyArray = [first, { nama: 'mangga', warna: 'kuning' }, ...rest]: Membuat array baru dengan elemen pertama (first), objek mangga pada index 1, dan elemen sisanya (rest).

3. Menggunakan concat()

Metode concat() menggabungkan dua atau lebih array menjadi satu array baru. Anda dapat menggunakannya untuk menambahkan objek ke array pada index tertentu dengan cara berikut:

const myArray = ['apel', 'jeruk', 'pisang'];

// Menambahkan objek 'mangga' pada index 1
const newMyArray = myArray.slice(0, 1).concat({ nama: 'mangga', warna: 'kuning' }, myArray.slice(1));

console.log(newMyArray); // Output: ['apel', { nama: 'mangga', warna: 'kuning' }, 'jeruk', 'pisang']

Penjelasan:

• myArray.slice(0, 1): Membuat array baru yang berisi elemen pertama dari myArray.
• myArray.slice(1): Membuat array baru yang berisi elemen mulai dari index 1.
• concat({ nama: 'mangga', warna: 'kuning' }, myArray.slice(1)): Menggabungkan array pertama, objek mangga, dan array kedua menjadi array baru.

4. Menggunakan Array Spread Operator

Array Spread Operator (...) dapat digunakan untuk menyalin semua elemen dari satu array ke array lainnya. Anda dapat menambahkan objek pada index tertentu dengan cara ini:

const myArray = ['apel', 'jeruk', 'pisang'];

// Menambahkan objek 'mangga' pada index 1
const newMyArray = [...myArray.slice(0, 1), { nama: 'mangga', warna: 'kuning' }, ...myArray.slice(1)];

console.log(newMyArray); // Output: ['apel', { nama: 'mangga', warna: 'kuning' }, 'jeruk', 'pisang']

Penjelasan:

• ...myArray.slice(0, 1): Menyalin elemen pertama dari myArray.
• ...myArray.slice(1): Menyalin elemen mulai dari index 1 dari myArray.

Pilih Metode Terbaik

Metode splice() umumnya merupakan pilihan terbaik untuk menambahkan objek ke array pada index tertentu karena mudah digunakan dan efisien. Namun, metode lainnya seperti destructuring assignment atau Array Spread Operator dapat digunakan dalam kasus-kasus tertentu jika Anda lebih menyukai syntax yang lebih ringkas atau ingin melakukan operasi lain pada array.

Penting untuk memilih metode yang paling sesuai dengan kebutuhan dan preferensi Anda.