Rumah > hujung hadapan web > tutorial js > Bagaimana untuk menukar rentetan JSON kepada pelbagai objek JSON menggunakan JavaScript?

Bagaimana untuk menukar rentetan JSON kepada pelbagai objek JSON menggunakan JavaScript?

WBOY
Lepaskan: 2023-08-27 17:33:02
ke hadapan
1596 orang telah melayarinya

如何使用 JavaScript 将 JSON 字符串转换为 JSON 对象数组?

JSON digunakan untuk menukar data dari klien ke pelayan. JSON sangat ringan, mudah dibaca oleh manusia dan mudah untuk dihuraikan dan dijana oleh mesin. Banyak kali apabila kita mendapat data dalam format rentetan, kita perlu menukar data ke dalam tatasusunan. Dalam artikel ini, kita akan membincangkan pelbagai cara untuk menukar rentetan JSON kepada tatasusunan objek JSON menggunakan JavaScript.

  • Gunakan kaedah JSON.parse()

  • Gunakan fungsi eval( )

Kaedah 1: Gunakan kaedah JSON.parse()

Kaedah JSON.parse digunakan untuk menukar rentetan JSON kepada objek JSON. Ini adalah cara yang sangat pantas dan standard untuk bekerja dengan data JSON. JSON.parse mengambil String sebagai input dan mengembalikan nilai Javascript, objek, tatasusunan, boolean, null, dll. bergantung pada struktur nilai input.

Contoh

Dalam contoh ini, kami mempunyai rentetan JSON yang mengandungi data untuk pelbagai orang dan kami akan menggunakan kaedah JSON.parse untuk menukar rentetan JSON ini kepada objek JSON.

<html>
<body>
   <h2>Convert JSON string to array of JSON objects using JSON.parse method</h2>
   <p>Click the following button to convert JSON string to an array of JSON objects</p><br>
   <button id="btn" onclick="convert( )" > Click Here </button> <br>
   <p id="result"> </p>
   <script>
      function convert(){
         
         // Initialize the dummy JSON String
         let jsonString = '[ { "name" : "Ram", "age" : 20, "car" : "ford" },{ "name": "Shyam", "age" : "21", "car" : "tata" }, { "name" : "Mohan", "age" : 22, "car" : "toyota" } ]'
         
         // Conver the JSON String to JSON object
         let jsonObject = JSON.parse(jsonString);
         
         // Get the paragraph element
         let p = document.getElementById("result")
         
         /// Print the Object
         p.innerText += JSON.stringify(jsonObject);
         
         // Print the Object on Console
         console.log(jsonObject)
      }
   </script>
</body>
</html>
Salin selepas log masuk

Kaedah 2: Gunakan fungsi eval()

Fungsi eval( ) dalam JavaScript ialah fungsi global yang digunakan untuk menilai rentetan sebagai ungkapan. Untuk menukar rentetan JSON kepada tatasusunan objek JSON menggunakan fungsi eval, kami menghantar rentetan JSON dan fungsi itu mengembalikan objek JSON.

Contoh

Dalam contoh ini, kami mempunyai rentetan JSON yang mengandungi data untuk orang yang berbeza, kami akan menggunakan fungsi eval( ) untuk menukar rentetan JSON ini kepada objek JSON.

<html>
<body>
   <h2>Convert JSON string to array of JSON objects using eval function</h2>
   <p>Click the following button to convert JSON string to an array of JSON objects</p><br>
   <button id="btn" onclick="convert( )" > Click Here </button> <br>
   <p id="result"></p>
   <script>
      function convert(){
         
         // Initialize the dummy JSON String
         let jsonString = '[ { "name" : "Ram", "age" : 20, "car" : "ford"},{ "name": "Shyam", "age" : "21", "car" : "tata" }, { "name" : "Mohan", "age" : 22, "car" : "toyota" } ]'
         
         // Conver the JSON String to JSON object
         let jsonObject = eval(jsonString);
         
         // Get the paragraph element
         let p = document.getElementById("result")
         
         /// Print the Object
         p.innerText += JSON.stringify(jsonObject);
         
         // Print the Object on Console
         console.log(jsonObject)
      }
   </script>
</body>
</html>
Salin selepas log masuk

Atas ialah kandungan terperinci Bagaimana untuk menukar rentetan JSON kepada pelbagai objek JSON menggunakan 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