Rumah > Artikel > hujung hadapan web > Bagaimana untuk menetapkan nilai lalai apabila memusnahkan objek dalam JavaScript?

Bagaimana untuk menetapkan nilai lalai apabila memusnahkan objek dalam JavaScript?

WBOYke hadapan: 2023-09-01 18:09:061056semak imbas

在 JavaScript 中解构对象时如何设置默认值？

Arrays and Objects Destructuring fungsi telah diperkenalkan dalam versi ES6 JavaScript. Pemusnahan tatasusunan dan objek membolehkan kita menyimpan nilainya dalam pembolehubah berasingan. Kami kemudiannya boleh menggunakan pembolehubah ini untuk mengakses nilai sifat tertentu objek.

Isu utama yang perlu kita perhatikan apabila memusnahkan objek tatasusunan ialah nilai lalai. Sebagai contoh, kami menambah pembolehubah property3 dalam memusnahkan objek, tetapi jika objek tidak mengandungi property3, memusnahkan akan menetapkan nilai yang tidak ditentukan kepada pembolehubah property3.

Pengguna boleh mengikuti contoh di bawah untuk memahami Memusnahkancara menetapkan nilai yang tidak ditentukan kepada harta yang tidak wujud.

Contoh

Dalam contoh di bawah, kami telah mencipta objek demo_obj yang mengandungi sifat x dan y dengan beberapa nilai integer. Selepas itu, kami menyahbina demo_obj dan cuba menetapkan nilai atributnya dalam pembolehubah w, x, y, dan z.

Dalam output, kita dapat melihat bahawa nilai pembolehubah w dan z tidak ditentukan kerana ia tidak wujud dalam objek demo_obj.

<html>
<body>
   <h2>Destructuring objects without default values in JavaScript</h2>
   <div id = "output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   let demo_obj = {
      x: 30,
      y: 60
   }
   const { w, x, y, z } = demo_obj;
   output.innerHTML += "The value of w variable is " + w + "<br/>";
   output.innerHTML += "The value of x variable is " + x + "<br/>";
   output.innerHTML += "The value of y variable is " + y + "<br/>";
   output.innerHTML += "The value of z variable is " + z + "<br/>";
</script>
</html>

Daripada contoh di atas, pengguna memahami mengapa kita perlu menetapkan nilai lalai untuk pembolehubah apabila memusnahkan objek.

Tatabahasa

Pengguna boleh menetapkan nilai lalai mengikut sintaks berikut apabila memusnahkan objek dalam JavaScript.

const { prop1, prop2 = default_value, prop3 = default_value } = {
   prop1 : value1,
   prop2 : value2
};

Dalam sintaks di atas, kami memusnahkan objek dalam pembolehubah prop1, prop2 dan porp3. Selain itu, kami menetapkan nilai lalai untuk pembolehubah prop2 dan prop3.

Contoh

Dalam contoh di bawah, kami mencipta objek pekerja yang mengandungi ID, nama dan gaji. Selepas itu, kami memusnahkan objek pekerja dalam pembolehubah id, nama, gaji dan umur. Selain itu, kami memulakan pembolehubah umur dengan nilai lalai 22.

Dalam output, kita boleh perhatikan bahawa pembolehubah umur mempunyai nilai 22, iaitu nilai lalai kerana objek pekerja tidak mengandungi atribut umur.

<html>
<body>
   <h2>Destructuring objects <i> with default values </i> in JavaScript.</h2>
   <div id = "output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   let employee = {
      id: "12345",
      name: "Shubham",
      salary: "10000$",
   }
   const { id, name, salary, age = 22 } = employee;
   output.innerHTML += "The value of id variable is " + id + "<br/>";
   output.innerHTML += "The value of name variable is " + name + "<br/>";
   output.innerHTML += "The value of salary variable is " + salary + "<br/>";
   output.innerHTML += "The value of age variable is " + age + "<br/>";
</script>
</html>

Contoh

Dalam contoh di bawah, kami mencipta objek jadual dan memusnahkannya kepada pembolehubah id, laci, lebar dan warna. Pengguna boleh melihat bahawa memandangkan objek jadual tidak mengandungi sifat lebar, nilai pembolehubah lebar ialah 4 kaki, yang merupakan nilai lalai.

Untuk pembolehubah lain, ia mendapat nilai daripada sifat objek. Sebagai contoh, nilai lalai pembolehubah warna ialah hitam. Walau bagaimanapun, memandangkan objek mengandungi sifat warna dengan nilai hijau, hijau ditetapkan sebagai nilai pembolehubah warna.

<html>
<body>
   <h2>Destructuring objects <i> with default values </i> in JavaScript</h2>
   <div id= "output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   let table = {
      id: "table2",
      color: "blue",
      drawers: 3,
   }
   const { id, color = "black", drawers = 5, width = "4 feet" } = table; 
   output.innerHTML += "The value of id variable is " + id + "<br/>";
   output.innerHTML += "The value of color variable is " + color + "<br/>";
   output.innerHTML += "The value of drawers variable is " + drawers + "<br/>";
   output.innerHTML += "The value of width variable is " + width + "<br/>";
</script>
</html>

Pengguna belajar dalam tutorial ini cara memusnahkan objek dengan nilai lalai. Selain itu, pengguna boleh memulakan pembolehubah dengan beberapa nilai lalai apabila ia dibuat, dan bukannya memberikannya beberapa nilai lalai apabila memusnahkan objek.

Daripada contoh di atas, kita boleh memahami bahawa apabila objek mengandungi sebarang atribut, nilai atribut akan ditetapkan kepada pembolehubah jika tidak, pembolehubah akan mengekalkan nilai lalai.

Atas ialah kandungan terperinci Bagaimana untuk menetapkan nilai lalai apabila memusnahkan objek dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

JavaScript es6 对象

Kenyataan：

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

Artikel sebelumnya：Bagaimana untuk memindahkan garis dasar satu aksara dalam teks menggunakan FabricJS?Artikel seterusnya：Bagaimana untuk memindahkan garis dasar satu aksara dalam teks menggunakan FabricJS?

Artikel berkaitan

Lihat lagi