Rumah > Artikel > hujung hadapan web > Bagaimana untuk mencipta objek baharu daripada objek yang ditentukan di mana semua kunci adalah huruf kecil dalam JavaScript?

Bagaimana untuk mencipta objek baharu daripada objek yang ditentukan di mana semua kunci adalah huruf kecil dalam JavaScript?

WBOYke hadapan: 2023-09-17 12:09:06484semak imbas

如何从指定对象创建一个新对象，其中所有键在 JavaScript 中都是小写？

Dalam JavaScript, terdapat banyak cara untuk mencipta objek baharu daripada objek lama. Mencipta objek baharu dengan kekunci yang sama seperti objek sedia ada tetapi dengan semua kekunci dalam huruf kecil ialah kes penggunaan biasa. Ini berguna apabila bekerja dengan data daripada banyak sumber dengan sarung kunci yang tidak teratur. Dalam catatan blog ini, kita akan melihat pelbagai kaedah JavaScript untuk mencipta objek baharu menggunakan kekunci huruf kecil.

Walau bagaimanapun, sebelum melakukan itu, adalah penting untuk diingat bahawa semasa mencipta objek baharu dengan kekunci huruf kecil boleh membantu apabila bekerja dengan data daripada pelbagai sumber, anda juga perlu mengetahui kemungkinan akibat daripada menukar kes kunci.

Sebagai contoh, ia mungkin memecahkan kod yang pada masa ini menjangkakan kunci berada dalam situasi tertentu, atau ia mungkin mengganggu API luaran atau pangkalan data yang menjangkakan kunci berada dalam situasi tertentu. Sebelum menukar kes utama objek, sentiasa jalankan ujian menyeluruh pada kod anda dan pertimbangkan keperluan khusus kes penggunaan anda.

Object.assign()

Objek baharu boleh dibuat dengan menggabungkan satu atau lebih objek sedia ada bersama menggunakan kaedah JavaScript terbina dalam Object.assign(). Ia juga mungkin untuk menukar cangkerang kunci objek dengan menjana objek baharu dengan kekunci yang sama seperti objek asal tetapi dengan semua kekunci dalam huruf kecil. Sintaks asas untuk mencipta objek baharu dengan kekunci huruf kecil menggunakan Object.assign().

Contoh

<html>
<body>
   <div id="myDiv"></div>
   <script>
      var original = {name: "John", AGE: 25};
      var lowercase = Object.assign({}, original);
      document.getElementById("myDiv").innerHTML = JSON.stringify(lowercase);
   </script>
</body>
</html>

Dalam contoh ini, fungsi Object.assign() menjana objek baharu dan memberikannya sifat objek asal. Kekunci yang sama dari objek lama akan muncul dalam objek baharu, tetapi ia akan menjadi huruf kecil.

Anda boleh menggunakan fungsi Object.keys() untuk mengulangi kekunci objek asal dan menukarnya kepada huruf kecil sebelum menghantarnya ke Object.assign() -

Contoh

<html>
<body>
   <div id="myDiv"></div>
   <script>
      var original = { name: "John", AGE: 25 };
      var lowercase = Object.assign(
         {},
         ...Object.keys(original).map((k) => ({
            [k.toLowerCase()]: original[k],
         }))
      );
      document.getElementById("myDiv").innerHTML = JSON.stringify(lowercase);
   </script>
</body>
</html>

Kaedah ini menggunakan kaedah Object.keys() untuk mendapatkan tatasusunan kunci objek asal. Kaedah Array.map() digunakan untuk mengulangi kekunci dan mencipta objek baharu dengan kekunci yang sama tetapi dalam huruf kecil. Objek baharu kemudiannya dihantar ke Object.assign() menggunakan operator spread.

gelung untuk masuk

Menggunakan gelung for-in untuk beralih ke atas kekunci objek asal dan menjana objek baharu dengan kekunci yang sama tetapi dalam huruf kecil ialah satu lagi cara untuk membina objek baharu dengan kekunci huruf kecil. Sintaks asas untuk mencipta objek baharu dengan kekunci huruf kecil menggunakan gelung untuk masuk ialah -

Contoh

<html>
<body>
   <div id="myDiv"></div>
   <script>
      var original = { name: "John", AGE: 25 };
      var lowercase = {};
      for (var key in original) {
         lowercase[key.toLowerCase()] = original[key];
      }
      document.getElementById("myDiv").innerHTML = JSON.stringify(lowercase);
   </script>
</body>
</html>

Dalam contoh ini, fungsi toLowerCase() digunakan untuk menukar setiap kekunci daripada huruf besar kepada huruf kecil dan menetapkan nilai yang berkaitan kepada objek baharu. Kemudian gelung for-in berulang ke atas kekunci objek asal.

JSON.parse() dan JSON.stringify()

Menggunakan kaedah JSON.parse() dan JSON.stringify() ialah cara ketiga untuk mencipta objek baharu dengan kekunci huruf kecil. Apabila membina objek baharu dengan kekunci huruf kecil menggunakan teknik ini, sintaks asas ialah -

Contoh

<html>
<body>
   <div id="myDiv"></div>
   <script>
      var original = { name: "John", AGE: 25 };
      var lowercase = JSON.parse(JSON.stringify(original).toLowerCase());
      document.getElementById("myDiv").innerHTML = JSON.stringify(lowercase);
   </script>
</body>
</html>

Dalam contoh ini, objek asal ditukar kepada rentetan JSON menggunakan kaedah JSON.stringify(). Kemudian gunakan kaedah toLowerCase() untuk menukar semua kunci dalam rentetan JSON kepada huruf kecil.

Akhir sekali, gunakan kaedah JSON.parse() untuk menukar rentetan JSON kembali kepada objek JavaScript. Dengan menggunakan kaedah ini, objek baharu dicipta yang mempunyai kekunci yang sama dengan objek asal, tetapi dengan semua kekunci dalam huruf kecil.

Malah, kaedah ini memerlukan menukar objek kepada rentetan dan kembali semula, yang menjadikannya kurang cekap daripada dua kaedah pertama. Ia juga hanya berfungsi dengan objek mudah; ia mungkin tidak berfungsi dengan objek dengan sifat atau kaedah unik.

Kesimpulan

Dalam artikel ini, kami melihat pelbagai kaedah JavaScript untuk membina objek baharu dengan kekunci huruf kecil. Cara cepat dan cekap untuk menjana objek baharu dengan kekunci yang sama seperti objek sedia ada tetapi semua huruf kecil adalah menggunakan kaedah Object.assign(). Pilihan lain untuk mengulangi kekunci objek dan menjana objek baharu dengan kekunci yang sama tetapi dalam huruf kecil ialah gelung untuk masuk. Kekunci huruf kecil juga boleh digunakan untuk membina objek baharu menggunakan kaedah JSON.parse() dan JSON.stringify(), walaupun kaedah ini kurang cekap dan mungkin tidak berfungsi dengan semua jenis objek.

Atas ialah kandungan terperinci Bagaimana untuk mencipta objek baharu daripada objek yang ditentukan di mana semua kunci adalah huruf kecil dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

JavaScript json Array Object 运算符 for 字符串循环 map 对象数据库

Kenyataan：

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

Artikel sebelumnya：Bagaimana untuk mendapatkan pengisytiharan gaya lengkap watak dalam IText menggunakan FabricJS?Artikel seterusnya：Bagaimana untuk mendapatkan pengisytiharan gaya lengkap watak dalam IText menggunakan FabricJS?

Artikel berkaitan

Lihat lagi