อยากเข้าใจ JavaScript จงเข้าใจเรื่องของ object

การเข้าใจ JavaScript Object เป็นหนึ่งในสิ่งที่สำคัญมาก เนื่องจาก object เป็นองค์ประกอบพื้นฐานของภาษานี้ เพื่อช่วยให้เข้าใจ object ได้ดีขึ้น นี่คือตัวอย่างพื้นฐานและรายละเอียดที่ควรรู้ครับ

1. พื้นฐานของ Object

ใน JavaScript, object คือชุดของคู่คีย์และค่า (key-value pairs) ที่ใช้เก็บข้อมูลหรือวิธีการ (methods)

ซึ่งในการสร้าง object เราจะใช้ {} หรือ ปีกกา สำหรับสร้าง object จะมีชื่อเรียกอีกชื่อว่า object literal

let person = {
  firstName: "John",
  lastName: "Doe",
  age: 30,
  isAdult: true,
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

ในตัวอย่าง code ด้านบน:

firstName, lastName, age, และ isAdult คือ properties ของ object person

fullName คือ method ที่เป็นฟังก์ชันภายใน object person

2. การเข้าถึงค่าภายใน Object

เราสามารถเข้าถึง properties ของ object ได้สองวิธี

วิธีแรกคือการใช้ dot notation หรือ จุด

console.log(person.firstName); // John

วิธีที่สองคือการใช้ bracket notation หรือ []

console.log(person['lastName']); // Doe

3. การเพิ่มและแก้ไข properties

เราสามารถเพิ่มหรือแก้ไข properties ของ object ได้ง่ายๆ โดยการใช้ dot notation เพื่อเข้าถึงค่าและเปลี่ยนแปลงค่า

person.age = 31; // แก้ไข property
person.country = "USA"; // เพิ่ม property ใหม่

4. การเรียกใช้ method หรือ function ใน object

เราสามารถเรียกใช้ method โดยการเข้าถึงชื่อของ method และเรียกใช้มันตามตัวอย่างด้านล่าง

console.log(person.fullName()); // John Doe

การสร้าง Object โดยการใช้ Function Constructor

จากนั้นมาดูวิธีการสร้าง object อีกรูปแบบหนึ่ง นั่นก็คือ object constructor ถ้าเราต้องการสร้าง object หลายๆ ตัวที่มีโครงสร้างเดียวกัน เราสามารถใช้เป็น function constructor ได้แบบนี้

function Person(firstName, lastName, age) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.age = age;
}

let person1 = new Person("John", "Doe", 30);
let person2 = new Person("Jane", "Smith", 25);

console.log(person1.firstName); // John
console.log(person2.age); // 25

การใช้ Object Prototypes

นอกจากนี้เรายังสามารถใช้ Object prototypes เพื่อทำให้ object สามารถสืบทอด property หรือ method จาก object อื่นได้

Person.prototype.greet = function() {
  return "Hello, " + this.firstName;
};

console.log(person1.greet()); // Hello, John
console.log(person2.greet()); // Hello, Jane

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

สำหรับบทความนี้หวังว่าจะทำให้ทุกคนเข้าใจเรื่องของ object ในภาษา Javascript กันมากยิ่งขึ้นนะครับ การเข้าใจเรื่องของ object ใน JavaScript จะช่วยให้เราสามารถจัดการข้อมูลได้อย่างมีประสิทธิภาพ และสามารถสร้างโครงสร้างข้อมูลที่ซับซ้อนยิ่งขึ้นได้ ขอบคุณสำหรับการอ่านครับ Happy coding & enjoy learning


Leave a Reply

Your email address will not be published. Required fields are marked *