Rumah > Artikel > hujung hadapan web > Bagaimana untuk menukar tatasusunan Objek kepada tatasusunan menggunakan JavaScript?

Bagaimana untuk menukar tatasusunan Objek kepada tatasusunan menggunakan JavaScript?

WBOYke hadapan: 2023-09-22 11:29:021491semak imbas

如何使用 JavaScript 将 Object 数组转换为数组？

Kita boleh menukar tatasusunan Objek kepada tatasusunan JavaScript menggunakan kaedah Object.values(), kaedah Array puch() dan gelung untuk... . Mula-mula, kita gelung melalui setiap objek menggunakan for...of dan kemudian gunakan kaedah Object.values() untuk mengakses nilai objek tunggal. Kemudian gunakan kaedah Array Push() untuk menambah nilai pada tatasusunan. Dalam artikel ini, kami akan membincangkan kaedah ini secara terperinci.

Mari lihat contoh untuk memahami masalahnya.

Anda telah diberikan tatasusunan objek, dan tugasnya adalah untuk menukar tatasusunan objek kepada tatasusunan nilai objek. Berikut adalah contoh perkara yang ingin kita capai.

Diberikan tatasusunan objek -

let carObj = [
   { name: "John", car: "Ford" },
   { name: "Mark", car: "BMW" },
   { name: "Ben", car: "Toyota" }
]

hendaklah ditukar kepada -

let carObj = ["John", "Ford", "Mark", "BMW", "Ben", "Toyota" ]

Terdapat banyak cara untuk mencapai ini. Sebahagian daripadanya ialah -

Gunakan untuk...gelung
Gunakan kaedah tatasusunan.peta

Gunakan untuk...gelung

for...of loop digunakan untuk mengulang nilai tatasusunan atau sebarang objek boleh lelaran. Untuk menukar tatasusunan objek kepada tatasusunan menggunakan gelung for...of, kami menggunakan langkah berikut.

Langkah

Buat ruang kosong untuk menyimpan nilai hasil.
Gunakan untuk...untuk menggelung melalui tatasusunan objek
Kita tahu bahawa item tatasusunan adalah objek yang nilainya kita inginkan.
Tolak nilai objek semasa ke dalam tatasusunan kosong melalui kaedah tatasusunan.push dan Object.values().

Contoh

Dalam contoh ini, kami mempunyai pelbagai objek. Objek ini mengandungi nama dan mod kereta. Kami mengekstrak nilai ini dan menetapkannya ke dalam tatasusunan tunggal menggunakan gelung for..of.

<html>
<head>
   <title>How to convert Object’s array to an array using JavaScript?</title>
</head>
<body>
   <h3 id="demo">Converting Object’s array to an array using for...of loop</h3>
   <script>
      
      // The car object
      let carObj = [
         { name: "John", car: "Ford" },
         { name: "Mark", car: "BMW" },
         { name: "Ben", car: "Toyota" }
      ]
      
      // Initialize an empty array
      let arr = [];
      
      // Loop through the car object
      for (i of carObj) {
         
         // Push the values of every object into arr
         arr.push(...Object.values(i))
      }
      
      // Print the arr
      document.write("Final Array: " + arr) 
   </script>
</body>
</html>

Gunakan kaedah Array.map()

Kaedah Array.map() memanggil fungsi pada setiap elemen tatasusunan dan mengembalikan tatasusunan baharu. Untuk menukar tatasusunan objek kepada tatasusunan menggunakan kaedah Array.map(), kami menggunakan langkah berikut.

Gunakan kaedah peta pada tatasusunan objek.
Mengembalikan nilai kunci yang anda ingin ekstrak selepas setiap lelaran.
Anda akan mendapat tatasusunan semua nilai untuk kunci tertentu.

Contoh

Dalam contoh ini, kami mempunyai pelbagai objek. Objek ini mengandungi nama dan mod kereta. Kami mengekstrak semua kereta ke dalam tatasusunan berasingan dan semua nama ke dalam tatasusunan berasingan.

<html>
<head>
   <title>Example- How to convert Object's array to an array using JavaScript</title>
</head>
<body>
   <h3 id="demo">Converting Object's array to an array using Array.map() method</h3>
   <script>
      
      // The car object
      let carObj = [
         { name: "John", car: "Ford" }, 
         { name: "Mark", car: "BMW" },
         { name: "Ben", car: "Toyota" }
      ]
      let nameArr = carObj.map((item) => item.name)
      let carArr = carObj.map((item) => item.car)
      
      // Print the Arrays
      document.write("Names Array : " + nameArr + "<br>")
      document.write("Cars Array : " + carArr)
   </script>
</body>
</html>

Atas ialah kandungan terperinci Bagaimana untuk menukar tatasusunan Objek kepada tatasusunan menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

JavaScript Array Object for 循环 map 对象

Kenyataan：

Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam

Artikel sebelumnya：Apakah sessionstorageArtikel seterusnya：Apakah sessionstorage

Artikel berkaitan

Lihat lagi