Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Menggabungkan Objek JavaScript dengan Cekap dengan ID Menggunakan ES6?

Bagaimanakah Saya Boleh Menggabungkan Objek JavaScript dengan Cekap dengan ID Menggunakan ES6?

Patricia Arquette
Patricia Arquetteasal
2024-12-12 14:55:14756semak imbas

How Can I Efficiently Merge JavaScript Objects by ID Using ES6?

Menggabungkan Objek JavaScript mengikut ID: Panduan Komprehensif

Menggabungkan objek dengan pengecam (id) ialah tugas biasa dalam pengaturcaraan JavaScript, terutamanya apabila menggabungkan data daripada sumber yang berbeza. Panduan ini akan membentangkan penyelesaian yang cekap menggunakan sintaks ES6 yang ringkas.

Penyelesaian:

Untuk menggabungkan dua tatasusunan objek berdasarkan medan id, kita boleh menggunakan yang berikut pendekatan:

const a3 = a1.map((t1) => ({
  ...t1,
  ...a2.find((t2) => t2.id === t1.id),
}));

Penjelasan:

  • Kaedah map() berulang pada tatasusunan pertama (a1).
  • Untuk setiap objek t1 dalam a1, kami mencipta objek baharu menggunakan operator hamparan (...) untuk menyalin sifatnya.
  • Kami menggunakan find() pada tatasusunan kedua (a2) untuk mencari objek dengan id yang sepadan dengan t1.
  • Sifat objek yang ditemui kemudiannya disalin ke dalam objek baharu menggunakan operator hamparan.

Contoh Penggunaan:

Pertimbangkan tatasusunan contoh yang disediakan dalam soalan:

var a1 = [{ id: 1, name: "test"}, { id: 2, name: "test2"}];
var a2 = [{ id: 1, count: "1"}, {id: 2, count: "2"}];

Menggunakan penyelesaian di atas akan menghasilkan tatasusunan gabungan yang diingini:

var a3 = [{ id: 1, name: "test", count: "1"}, 
          { id: 2, name: "test2", count: "2"}];

Kelebihan:

  • Ringkas dan kod boleh dibaca.
  • Penggunaan operator hamparan ES6 yang cekap untuk objek bergabung.
  • Mengendalikan kedua-dua sifat sedia ada dan hilang dalam objek yang digabungkan.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menggabungkan Objek JavaScript dengan Cekap dengan ID Menggunakan ES6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn