JavaScript Object Destructuring
การเข้าถึง Object ในโครงสร้างที่แตกต่างจากปกติ เรียกว่า Object Destructuring จริงๆ แล้วเรามีรูปแบบที่กำหนดสำหรับแสดง Object Property แต่เราสามารถทำในรูปแบบที่ไม่ได้กำหนด เรียกว่า Object Destructuring มาดูรายละเอียดกัน
ตัวอย่างที่ 1
ในตัวอย่างนี้ กำหนด Object 'person' และเข้าถึง Property แบบปกติ คือ "person.name" แต่หากต้องการแสดงแบบ Destructured ไม่ต้องระบุ 'person.name' แค่ 'name' ก็พอ ตาม ตัวอย่างที่ 2
<html> <body> <script> let person = {name: "Nani", age: 25}; document.write(person.name); document.write("</br>"); document.write(person.age); </script> </body> </html>
ผลลัพธ์
Nani 25
ตัวอย่างที่ 2
ในตัวอย่างนี้ เข้าถึง Property ของ Object 'person' แบบ Destructured Manner และแสดงผลลัพธ์
<html> <body> <script> let person = {name: "Nani", age: 25}; let {name, age} = person; document.write(name); document.write("<br>"); document.write(age); </script> </body> </html>
ผลลัพธ์
Nani 25