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

Bagaimana untuk menukar tatasusunan Objek kepada tatasusunan menggunakan JavaScript?

WBOY
WBOYke hadapan
2023-09-22 11:29:021543semak 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!

Kenyataan:
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam
Artikel sebelumnya:Apakah sessionstorageArtikel seterusnya:Apakah sessionstorage