การสร้าง Object ใน JavaScript

พูดคุยแลกเปลี่ยน ปัญหา การเขียน JavaScript เครื่องมือ AJAX Web 2.0 AJAX Framework jQuery และ Node.JS รวมถึง Framework Express ของ Node.JS ทำงานฝั่ง Server

Moderator: mindphp

Jukkrida63
PHP VIP Members
PHP VIP Members
โพสต์: 1037
ลงทะเบียนเมื่อ: 24/06/2024 9:12 am

การสร้าง Object ใน JavaScript

โพสต์ที่ยังไม่ได้อ่าน โดย Jukkrida63 »

สวัสดีครับวันนี้ผมจะขอมาอธิบายในเรื่องของ Object ใน JavaScript ซึ่งถือได้ว่ามีความสำคัญมากๆต่อการเรียนรู้สำหรับผู้ที่กำลังฝึกเขียน JavaScript อยู่ ถึงกับที่หลายๆคนกล่าวว่า "ถ้าคุณเข้าใจObject นั่นเท่ากับว่าคุณเข้าใจ JavaScript"
สำหรับ Object นั้น เปรียบเสมือนกับร่างกายที่ประกอบไปด้วยส่วนต่างๆ
เช่น คนหนึ่งคน มีส่วนสูง น้ำหนัก สีผม เชื้อชาติ และอื่นๆ ซึ่งผมขอยกตัวอย่างข้างต้นหากเขียนเป็นโค้ด

โค้ด: เลือกทั้งหมด

<script>
    const person1 ={
        height : 165,
        weight : 50,
        haircolor : "Black",
        naitonality : "thai"
    }
</script>
จากการยกตัวอย่างข้างต้น จะเห็นได้ว่าการประกาศประกาศ Object นั้น เปรียบเสมือนการประกาศตัวแปรใน JavaScript แต่ Object นั้น อาจจะประกอบไปด้วยค่าภายใน Object หลายค่า
ซึ่งหากเราต้องการจะนำค่าใน Object ที่ประกาศมาใช้นั้น เราจะเรียกใช้ในรูปแบบ object.key
ในที่นี้ Object ของเราก็คือ person1
และ key ก็คือ value ที่เรากำหนดไว้ภายใน Object
เช่น หากเราต้องการ log ค่าส่วนสูงของ person1

โค้ด: เลือกทั้งหมด

console.log(person1.height);
ค่าที่ได้ก็จะเป็นตามรูปด้านล่าง
JavaScript & jQuery Ajax & Node.JS-1.png
JavaScript & jQuery Ajax & Node.JS-1.png (9.13 KiB) Viewed 1410 times
ซึ่งหากเราต้องการน้ำค่าอื่นๆมาใช้ก็ให้เปลี่ยนในส่วนของ key เพียงเท่านี้ครับ

Object นั้นยังสามารถประกาศค่า properties เป็น Array และ function ได้อีกด้วย
ผมจะยกตัวอย่างการประกาศค่าให้ดูกันนะครับ

โค้ด: เลือกทั้งหมด

const data ={
    sum : (a,b) => a+b,
    number : [1,2,3,4,5]
}
เราลองประกาศ Object ตาม Code ด้านบน

ลองดูตัวอย่างการเข้าถึงข้อมูลด้วยการ log

โค้ด: เลือกทั้งหมด

console.log(data.number);
ผลลัพธ์จะออกมาเป็นแบบนี้ครับ
JavaScript & jQuery Ajax & Node.JS-2.png
JavaScript & jQuery Ajax & Node.JS-2.png (12.21 KiB) Viewed 1410 times
และจาก Code

โค้ด: เลือกทั้งหมด

console.log(data.sum(2,3));
จะได้ผลลัพธ์ตามรูปครับ
JavaScript & jQuery Ajax & Node.JS-3.png
JavaScript & jQuery Ajax & Node.JS-3.png (11.62 KiB) Viewed 1410 times

สรุปแล้ว Object ใน JavaScript นั้นเปรียบเสมือนการกำหนด properties หลาย properties ไว้ภายใน Keyword เดียว ซึ่งเป็นจุดPoint ที่จะทำให้ทุกคนนั้นสามารถเรียนและฝึกเขียน JavaScript ได้เข้าใจมากยิ่งขึ้นครับ
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 12