วัตถุ

ออบเจ็กต์เป็นประเภทข้อมูลที่แยกจากกันโดยสิ้นเชิง ในลักษณะเดียวกับที่แต่ละวัตถุ Primitive คือประเภทข้อมูลที่มีวิกฤต ความแตกต่าง: ออบเจ็กต์นั้นเปลี่ยนแปลงได้ ต่างจากสิ่งพื้นฐาน วัตถุอาจมีข้อมูล ที่เชื่อมโยงกับตัวระบุ เช่น ตัวแปร แต่ยังคงเก็บข้อมูล object ไว้ พิมพ์ ไม่ว่าจะมีข้อมูลใด

นอกจากรูปแบบพื้นฐานแล้ว ค่า JavaScript ทั้งหมดยังเป็นวัตถุ เนื่องจาก ลิเทอรัลดั้งเดิมแสดงพฤติกรรมที่เหมือนวัตถุเนื่องจาก การสืบทอดต้นแบบ บ่อยครั้งที่กล่าวว่า JavaScript สร้างขึ้นมาจากออบเจ็กต์อย่างมีประสิทธิภาพ

Objectลิเทอรัลเป็นคู่ของวงเล็บปีกกาล้อมรอบคีย์-ค่าเป็น 0 หรือมากกว่า คู่กันที่เรียกว่า "คุณสมบัติ" ซึ่งสามารถมีค่า JavaScript ใดก็ได้

{
   
"myProperty" : true
}

คีย์พร็อพเพอร์ตี้อาจเป็นสัญลักษณ์ใดก็ได้ หรือ สตริง เช่น เมื่อกำหนดตัวระบุ ให้กับตัวแปร สตริงที่ใช้เป็นคีย์พร็อพเพอร์ตี้ควรคาดการณ์ได้และ คำอธิบาย:

let carAttributes = {
   
"color" : "red"
};

carAttributes
> Object { color: "red" }

คีย์พร็อพเพอร์ตี้ต้องใช้ลิเทอรัลสตริงเดียว (') หรืออัญประกาศคู่ (") ไม่ใช่ เทมเพลตลิเทอรัล

let carAttributes = {
   
`keyString` : false
};
> Uncaught SyntaxError: expected property name, got template literal

ค่าพร็อพเพอร์ตี้สามารถเป็นประเภทข้อมูลใดก็ได้ คุณสมบัติของวัตถุสามารถ มีวัตถุซึ่งมีคุณสมบัติของตัวเอง:

let myObject = {
   
'key' : {
       
'subkey' : true,
       
'othersubkey' : false
   
}
};

myObject
;
> Object { key: Object { subkey: true, othersubkey: false } }

เมื่อค่าของพร็อพเพอร์ตี้เป็นฟังก์ชัน พร็อพเพอร์ตี้นั้นจะเรียกว่า "เมธอด"

const myObject = {
   
"myProperty" : true,
    myMethod
() {
        console
.log( "This is a method." );
   
}
}

myObject
.myProperty;
> true

myObject
.myMethod();
> "This is a method."

คุณยังสร้างออบเจ็กต์โดยใช้คีย์เวิร์ด new ได้ด้วย ดังนี้

let myObject = new Object();

ในตัวอย่างก่อนหน้านี้ สัญพจน์ของออบเจ็กต์ที่สร้างใหม่ได้รับการกำหนด ตัวแปร แต่ไม่จำเป็น เนื่องจากคุณสามารถใช้ข้อมูลเหล่านี้เช่นเดียวกับข้อมูลประเภทอื่นๆ เป็นวัตถุที่ไม่มีตัวระบุในตำแหน่งใดก็ได้ที่คาดไว้ อย่างไรก็ตาม Object Litel ต้องใช้วงเล็บในบริบทที่อาจทำให้สับสน สำหรับคำสั่งบล็อก เนื่องจากไวยากรณ์วงเล็บปีกกาแชร์ 2 แบบ ({}) ไม่จำเป็นต้องใช้ตัวแปรนี้ในการเริ่มต้น

{ "value" : 2 }
> Uncaught SyntaxError: unexpected token: ':'

({ "value" : 2 })
> Object { value: 2 }

let valObj
= { "value" : 2 };

valObj
;
> Object { value: 2 }

การสร้างผลลัพธ์นั้นไม่แตกต่างจากกลุ่มดั้งเดิม ออบเจ็กต์โดยใช้ new Object() และสร้าง Object Literal เนื่องจาก ในทั้ง 2 กรณีนี้จะเป็นออบเจ็กต์ที่มีพร็อพเพอร์ตี้ที่รับช่วงมาจาก Object ต้นแบบ อย่างไรก็ตาม มีข้อแตกต่างในทางปฏิบัติอย่างหนึ่งระหว่าง ไวยากรณ์

คีย์เวิร์ด new ต้องกำหนดออบเจ็กต์ว่างที่มีการเติมข้อมูลในภายหลัง

let myObject = new Object();

myObject
.booleanValue = true;
myObject
.stringValue = "My string.";

ระบบจะเติมข้อมูลลิเทอรัลของออบเจ็กต์ด้วยข้อมูลเมื่อสร้างแล้ว ดังนี้

let myObject = {
   
'booleanValue' : true,
   
'stringValue' : "My string."
};

แม้จะมีประโยชน์ในทางปฏิบัติไม่มากนัก แต่ new Object() ก็สามารถพลิกโฉมแบบเดิมได้ ลงในออบเจ็กต์ประเภทที่เกี่ยวข้อง เช่น ค่าที่ส่งคืนโดยใช้ คีย์เวิร์ด new พร้อมด้วยตัวสร้าง ตัวอย่างเช่น ฟังก์ชันต่อไปนี้มีฟังก์ชันเทียบเท่ากับ new Number( 10 ):

let myObject = new Object( 10 );

myObject
;
> Number { 10 }

ค่า null และ undefined จะทําให้เป็นออบเจ็กต์ว่าง ซึ่งมีฟังก์ชันการทํางานที่เหมือนกัน เพื่อเรียก new Object() โดยไม่ต้องใส่อาร์กิวเมนต์

การส่งต่อออบเจ็กต์ลิเทอรัลไปยัง new Object() เนื่องจากอาร์กิวเมนต์ส่งผ่านออบเจ็กต์ โดยไม่ต้องเปลี่ยนอะไรเลย

let myObject = new Object( { myValue : 10 } );

myObject
;
> Object { myValue: 10 }

เช่นเดียวกับการใช้ตัวสร้างสำหรับค่าพื้นฐาน การใช้ตัวสร้างสำหรับวัตถุ แทบจะไม่มีประโยชน์ในการใช้สัญกรณ์ออบเจ็กต์ลิเทอรัล แม้ว่าจะสร้าง เพื่อใส่ค่าว่างให้กับออบเจ็กต์ในภายหลัง นักพัฒนาซอฟต์แวร์มักจะชอบออบเจ็กต์ สัญกรณ์ตามตัวอักษรเพื่อความง่าย

ตรวจสอบความเข้าใจ

คุณใช้เครื่องหมายประเภทใดเพื่อตั้งค่าคุณสมบัติของวัตถุได้

สัญลักษณ์วงเล็บ
สัญลักษณ์เส้น
สัญกรณ์รอบเดือน
สัญลักษณ์

ข้อใดต่อไปนี้คือไวยากรณ์ที่ถูกต้องสำหรับการหาค่า จาก myProp

myObj["myProp"];
myObj("myProp");
myObj{"myProp"};