Bagaimana untuk membuat tatasusunan berbilang objek dengan berbilang pasangan nilai kunci bersarang dalam JavaScript?

WBOY
Lepaskan: 2023-09-04 20:13:08
ke hadapan
1215 orang telah melayarinya

如何在 JavaScript 中创建具有多个嵌套键值对的多个对象的数组?

JavaScript ialah bahasa tujuan umum yang digunakan secara meluas untuk mencipta aplikasi web dinamik. Salah satu struktur data yang paling biasa digunakan dalam JavaScript ialah tatasusunan. Tatasusunan ialah koleksi elemen yang boleh terdiri daripada sebarang jenis, termasuk objek. Dalam artikel ini, kita akan membincangkan cara membuat tatasusunan berbilang objek dengan berbilang pasangan nilai kunci bersarang dalam JavaScript.

Apakah itu tatasusunan?

Tatasusunan ialah jenis objek khas yang digunakan untuk menyimpan koleksi nilai. Nilai boleh terdiri daripada sebarang jenis data, seperti nombor, rentetan, boolean, atau tatasusunan lain. Tatasusunan ialah ciri yang sangat berkuasa dalam JavaScript yang boleh digunakan dalam pelbagai jenis aplikasi.

Tatabahasa

let myArray = [20, 22, 24];
Or
const arr = [hello, ‘world’];
Salin selepas log masuk

Buat tatasusunan yang mengandungi berbilang objek

Pertama, untuk mencipta tatasusunan yang mengandungi berbilang objek dalam JavaScript, kita perlu menentukan tatasusunan kosong, yang mana kita boleh menggunakan tatatanda []. Selepas mentakrifkan tatasusunan, kita boleh menggunakan kaedah push() untuk menambah satu atau lebih objek pada tatasusunan. Contohnya -

let arr = [];
arr.push({
  key1: value1,
  key2: value2
});
arr.push({
  key1: value3,
  key2: value4
});
Salin selepas log masuk

Dalam contoh yang diberikan, kami menolak tatasusunan bernama "arr" yang mempunyai dua objek. Kami menggunakan kaedah push() untuk menambah setiap objek ke penghujung tatasusunan. Di sini objek tatasusunan ditakrifkan menggunakan pendakap kerinting {} dengan pasangan nilai kunci. Sebaik sahaja kami telah mencipta tatasusunan yang mengandungi objek, kami kini boleh menggunakan kaedah atau operasi JavaScript untuk mengakses dan memanipulasi objek dan sifatnya.

Terdapat banyak cara untuk mengakses objek dalam tatasusunan, salah satu caranya ialah menggunakan kaedah forEach () untuk menggelung tatasusunan dan mengakses setiap objek dan sifatnya secara individu, atau kita juga boleh menggunakan kaedah seperti map() atau penapis( ) untuk penukaran atau Kendalikan elemen dalam tatasusunan.

Tambah pasangan nilai kunci bersarang pada objek

Selepas mencipta tatasusunan, kini kita boleh menambah pasangan nilai kunci bersarang pada objek dengan mentakrifkan objek dalam objek lain. Contohnya -

let myObj = {
  key1: value1,
  key2: {
    nestedKey1: nestedValue1,
    nestedKey2: nestedValue2
  }
};
Salin selepas log masuk

Dalam contoh yang diberikan, kami telah mentakrifkan myObj sebagai objek dengan dua pasangan nilai kunci. Nilai pasangan key2 ialah objek lain dengan dua pasangan nilai kunci bersarang.

Buat tatasusunan menggunakan objek dengan pasangan nilai kunci bersarang

Untuk mencipta susunan objek dengan pasangan nilai kunci bersarang, kita boleh menggabungkan teknik yang dibincangkan di atas. Contohnya -

let arr = [];
arr.push({
  key1: value1,
  key2: {
    nestedKey1: nestedValue1,
    nestedKey2: nestedValue2
  }
});
arr.push({
  key1: value3,
  key2: {
    nestedKey1: nestedValue3,
    nestedKey2: nestedValue4
  }
});
Salin selepas log masuk

Di atas, kami menentukan tatasusunan kosong dan menambahkan dua objek padanya menggunakan kaedah push() Setiap objek mengandungi dua pasangan nilai kunci2 ialah satu lagi dengan dua pasangan nilai kunci bersarang

Akses data dalam pelbagai objek menggunakan pasangan nilai kunci bersarang

Kaedah 1

Dalam kaedah ini, kami akan menggunakan gabungan notasi titik dan notasi kurungan untuk mengakses data dalam tatasusunan objek dengan pasangan nilai kunci bersarang. Notasi titik membenarkan akses terus kepada sifat objek, manakala dalam notasi kurungan persegi kita boleh mengakses sifat menggunakan pembolehubah.

Sebagai contoh, kita boleh mengakses sifat nama objek pertama dalam arr menggunakan notasi titik seperti berikut -

const objOne = arr[0];
const object = objOne.name;
Salin selepas log masuk

Di sini, kami menetapkan objek pertama dalam arr kepada pembolehubah bernama objOne. Sekarang menggunakan notasi titik, kita boleh mengakses mana-mana harta objOne dan menetapkannya kepada objek bernama pembolehubah.

Untuk mengakses atribut keadaan atribut alamat objek kedua dalam arr, kita boleh menggunakan notasi kurungan berikut -

const objTwo = arr[1];
const address = objTwo["city"]["state"];
Salin selepas log masuk

Di sini, kami menetapkan objek lain dalam arr kepada pembolehubah bernama objTwo. Sekarang menggunakan notasi kurungan, kita boleh mengakses harta bandar objTwo dan kemudian menetapkan sifat keadaan objek bersarang kepada pembolehubah alamat.

Kaedah 2

Cara lain untuk mengakses data dalam tatasusunan objek dengan pasangan nilai kunci bersarang ialah menggunakan kaedah forEach(). Dalam kaedah ini, tatasusunan diulang menggunakan kaedah forEach() dan untuk setiap objek dalam tatasusunan, gelung for...in digunakan untuk mengekstrak nilai setiap pasangan nilai kunci. Nilai-nilai ini kemudiannya ditolak ke dalam tatasusunan baharu.

Contoh 1

Contoh ini menunjukkan cara membuat tatasusunan yang mengandungi berbilang objek dengan pasangan nilai kunci bersarang.

Kami mencipta tatasusunan kosong bernama arr dan menambah tiga objek padanya menggunakan kaedah push(). Setiap objek mempunyai pasangan nilai kunci: key1 mempunyai nilai "value1", key2 mempunyai nilai "value2", dan seterusnya. Kaedah Push() menambah item pada tatasusunan dan mengambil satu atau lebih parameter yang mewakili item yang akan ditambah, dan akhirnya, ketiga-tiga objek itu dihantar sebagai parameter berasingan.

<!DOCTYPE html>
<html>
   <body>
      <p id="array"></p>
      <script>
         let arr = [];
         arr.push({ key1: "value1" }, { key2: "value2" }, { key3: "value 3" });
         document.getElementById("array").innerHTML = JSON.stringify(arr);
      </script>
   </body>
</html>
Salin selepas log masuk

Contoh 2

Contoh ini menunjukkan cara membuat dua tatasusunan yang mengandungi berbilang objek dengan pasangan nilai kunci bersarang dan menambahkannya pada tatasusunan tunggal.

Dalam kod di bawah, kami menggunakan gelung for...in untuk melelaran melalui setiap objek dalam arr1 dan arr2 untuk mengakses nilai yang dikaitkan dengan setiap kekunci. Kami kemudian menggunakan arr3.push(object[key]) untuk menolak hanya nilai ke dalam tatasusunan arr3.

<!DOCTYPE html>
<html>
   <body>
      <p id="array"></p>
      <script>
         const arr1 = [
            { key1: "value 1" },
            { key2: "value 2" },
            { key3: "value 3" },
         ];
         const arr2 = [
            { key4: "value 4" },
            { key5: "value 5" },
            { key6: "value 6" },
         ];
         const arr3 = [];
         arr1.forEach(function (object) {
            for (const key in object) {
               arr3.push(object[key]);
            }
         });
         arr2.forEach(function (object) {
            for (const key in object) {
               arr3.push(object[key]);
            }
         });
         document.getElementById("array").innerHTML = JSON.stringify(arr3);
      </script>
   </body>
</html>
Salin selepas log masuk

结论

数组是 JavaScript 中的一种重要数据结构,可以存储任何数据类型(包括对象)的信息集合。创建具有多个嵌套键值对的多个对象的数组是一个简单的过程,为此,我们首先定义一个空数组并使用 push() 方法向其中添加对象,其中每个对象都使用 {} (花括号)定义),包含使用逗号分隔的键值对。要访问和操作对象及其属性,我们可以使用 JavaScript 方法。

我们还可以通过在另一个对象中定义一个对象来向对象添加嵌套键值对。使用带有嵌套键值对的对象的方法可以在 JavaScript 中创建更强大、更灵活的数据结构。我们看到了不同的方法,包括点符号和括号符号的组合,或者使用 forEach() 方法和 for...in 循环来提取每个键值对的值,以访问嵌套对象数组中的数据键值对。

Atas ialah kandungan terperinci Bagaimana untuk membuat tatasusunan berbilang objek dengan berbilang pasangan nilai kunci bersarang dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:tutorialspoint.com
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan