ความสำคัญของแอตทริบิวต์ enumerable ในการกำหนดพร็อพเพอร์ตี้ของออบเจ็กต์ JavaScript

เราสามารถกำหนด พร็อพเพอร์ตี้ ของออบเจ็กต์ได้โดยใช้ Dot notation และ Bracket notation นอกจากนี้ยังมีวิธีอีกวิธีหนึ่งคือการใช้ Object.defineProperty() เพื่อกำหนดพร็อพเพอร์ตี้ ซึ่งมักจะรับ 3 พารามิเตอร์ ได้แก่ ชื่อออบเจ็กต์ ชื่อพร็อพเพอร์ตี้ และพร็อพเพอร์ตี้ descriptor

ไวยากรณ์

Object.defineProperty(objectName, propertyName, propertyDescriptor)

ตัวอย่าง

ในตัวอย่างต่อไปนี้ ออบเจ็กต์มีเพียงพร็อพเพอร์ตี้เดียวชื่อ one ต่อมามีการเพิ่มพร็อพเพอร์ตี้ชื่อ two แต่เมื่อพยายามแสดงพร็อพเพอร์ตี้ทั้งหมด จะแสดงเฉพาะพร็อพเพอร์ตี้แรกเท่านั้น พร็อพเพอร์ตี้ที่เพิ่มเข้ามาไม่แสดง เนื่องจากแอตทริบิวต์ enumerable มีค่าเป็น false โดยค่าเริ่มต้น

<html> <body> <script> 
    var object = {one: 1}; 
    Object.defineProperty( 
        object, 
        'two', { 
            value: 2 
        } 
    ); 
    document.write(JSON.stringify(object)); 
</script> </body> </html>

ผลลัพธ์

{"one":1}

เพื่อให้พร็อพเพอร์ตี้แสดงได้ในการวนลูปหรือ JSON.stringify ต้องตั้งค่า enumerable: true ใน descriptor

ตัวอย่างที่แก้ไขแล้ว

<html> <body> <script> 
    var object = {one: 1}; 
    Object.defineProperty( 
        object, 
        'two', { 
            value: 2, 
            enumerable: true 
        } 
    ); 
    document.write(JSON.stringify(object)); 
</script> </body> </html>

ผลลัพธ์

{"one":1,"two":2}