วัตถุ JavaScript

❮ ก่อนหน้า ถัดไป ❯

ใน JavaScript วัตถุเป็นราชา หากคุณเข้าใจวัตถุ แสดงว่าคุณเข้าใจ JavaScript

ใน JavaScript เกือบ "ทุกอย่าง" เป็นวัตถุ

บูลีนสามารถเป็นวัตถุได้ (หากกำหนดด้วยnewคีย์เวิร์ด)
ตัวเลขสามารถเป็นวัตถุได้ (หากกำหนดด้วยnewคีย์เวิร์ด)
สตริงสามารถเป็นวัตถุได้ (หากกำหนดด้วยnewคีย์เวิร์ด)
วันที่มักจะเป็นวัตถุ
คณิตศาสตร์เป็นวัตถุเสมอ
นิพจน์ทั่วไปมักจะเป็นวัตถุ
อาร์เรย์เป็นวัตถุเสมอ
ฟังก์ชั่นเป็นวัตถุเสมอ
วัตถุก็คือวัตถุเสมอ

ค่า JavaScript ทั้งหมด ยกเว้น primitive เป็นอ็อบเจ็กต์

JavaScript Primitives

ค่าดั้งเดิมคือค่าที่ไม่มีคุณสมบัติหรือวิธีการ

ชนิดข้อมูลดั้งเดิมคือข้อมูลที่มีค่าพื้นฐาน

JavaScript กำหนดประเภทข้อมูลพื้นฐาน 5 ประเภท:

string
number
boolean
null
undefined

ค่าดั้งเดิมนั้นไม่เปลี่ยนรูป (เป็นแบบฮาร์ดโค้ดและไม่สามารถเปลี่ยนแปลงได้)

ถ้า x = 3.14 คุณสามารถเปลี่ยนค่าของ x ได้ แต่คุณไม่สามารถเปลี่ยนค่าของ 3.14 ได้

ค่า	พิมพ์	ความคิดเห็น
"สวัสดี"	สตริง	"ฮัลโหล" ก็คือ "ฮัลโหล" เสมอ
3.14	ตัวเลข	3.14 เสมอ 3.14
จริง	บูลีน	ความจริงย่อมเป็นความจริงเสมอ
เท็จ	บูลีน	เท็จย่อมเท็จเสมอ
โมฆะ	null (วัตถุ)	null จะเป็นโมฆะเสมอ
ไม่ได้กำหนด	ไม่ได้กำหนด	undefined คือ undefined เสมอ

วัตถุเป็นตัวแปร

ตัวแปร JavaScript สามารถมีค่าเดียว:

ตัวอย่าง

let person = "John Doe";

ตัวแปร JavaScript สามารถมีค่าได้มากมาย

วัตถุก็เป็นตัวแปรเช่นกัน แต่วัตถุสามารถมีค่าได้มากมาย

ค่าอ็อบเจ็กต์เขียนเป็นname : value pairs (ชื่อและค่าคั่นด้วยเครื่องหมายทวิภาค)

ตัวอย่าง

let person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

วัตถุ JavaScript คือชุดของค่าที่มีชื่อ

เป็นเรื่องปกติที่จะประกาศวัตถุด้วยconstคำหลัก

ตัวอย่าง

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

คุณสมบัติของวัตถุ

ค่าที่มีชื่อในวัตถุ JavaScript เรียกว่าคุณสมบัติ

คุณสมบัติ	ค่า
ชื่อจริง	จอห์น
นามสกุล	โด่
อายุ	50
สีตา	สีฟ้า

ออบเจ็กต์ที่เขียนเป็นคู่ค่าชื่อจะคล้ายกับ:

แอสโซซิเอทีฟอาเรย์ใน PHP
พจนานุกรมในภาษาไพทอน
ตารางแฮชในC
แผนที่แฮชใน Java
แฮชใน Ruby และ Perl

วิธีการวัตถุ

เมธอดคือการกระทำที่สามารถทำได้กับออบเจ็กต์

คุณสมบัติของอ็อบเจ็กต์สามารถเป็นได้ทั้งค่าดั้งเดิม ออบเจ็กต์อื่นๆ และฟังก์ชัน

เมธอดของอ็อบเจ็กต์คือคุณสมบัติของอ็อบเจ็กต์ที่มีนิยามฟังก์ชัน

คุณสมบัติ	ค่า
ชื่อจริง	จอห์น
นามสกุล	โด่
อายุ	50
สีตา	สีฟ้า
ชื่อเต็ม	function() {ส่งคืน this.firstName + " " + this.lastName;}

ออบเจ็กต์ JavaScript เป็นคอนเทนเนอร์สำหรับค่าที่มีชื่อ ซึ่งเรียกว่าคุณสมบัติและเมธอด

คุณจะได้เรียนรู้เพิ่มเติมเกี่ยวกับวิธีการต่างๆ ในบทต่อไป

การสร้างวัตถุ JavaScript

ด้วย JavaScript คุณสามารถกำหนดและสร้างวัตถุของคุณเองได้

มีหลายวิธีในการสร้างวัตถุใหม่:

สร้างอ็อบเจ็กต์เดียว โดยใช้อ็อบเจกต์ตามตัวอักษร
newสร้างออบเจ็กต์เดียวโดย ใช้คีย์เวิร์ด
กำหนดตัวสร้างอ็อบเจ็กต์ แล้วสร้างอ็อบเจ็กต์ตามประเภทที่สร้างขึ้น
สร้างวัตถุโดยใช้Object.create().

การใช้ Object Literal

นี่เป็นวิธีที่ง่ายที่สุดในการสร้างวัตถุ JavaScript

คุณทั้งคู่กำหนดและสร้างวัตถุในคำสั่งเดียวโดยใช้ตัวอักษรอ็อบเจ็กต์

อ็อบเจ็กต์ตามตัวอักษรคือรายการคู่ของชื่อ:ค่า (เช่น อายุ:50) ที่อยู่ในวงเล็บปีกกา {}

ตัวอย่างต่อไปนี้สร้างอ็อบเจ็กต์ JavaScript ใหม่พร้อมคุณสมบัติสี่ประการ:

ตัวอย่าง

const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

การเว้นวรรคและการขึ้นบรรทัดใหม่ไม่สำคัญ คำจำกัดความของวัตถุสามารถขยายได้หลายบรรทัด:

ตัวอย่าง

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

ตัวอย่างนี้สร้างวัตถุ JavaScript ว่าง และเพิ่มคุณสมบัติ 4 อย่าง:

ตัวอย่าง

const person = {};
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";

การใช้คำสำคัญ JavaScript ใหม่

ตัวอย่างต่อไปนี้สร้างวัตถุ JavaScript ใหม่โดยใช้new Object()แล้วเพิ่มคุณสมบัติ 4 ประการ:

ตัวอย่าง

const person = new Object();
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";

ตัวอย่างข้างต้นทำเช่นเดียวกันทุกประการ

แต่ไม่จำเป็นต้องnew Object()ใช้

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