เริ่มแรกต้องทำความเข้าใจความหมายของ OOP (Object-Oriented Programming) ก่อน นั่นคือ แนวคิดการเขียนโปรแกรมที่เน้นการสร้าง "วัตถุ" (Object) ที่ประกอบไปด้วยสถานะ (state) และพฤติกรรม (behavior) นั่นคือ การจำลองวัตถุในโลกจริงเข้ามาในโลกโปรแกรม โดยวัตถุในที่นี้สามารถเป็นอะไรก็ได้ ตั้งแต่รถยนต์ไปจนถึงบัญชีธนาคาร
ต่อมาคือ set และ get functions ที่มาพร้อมกับความสามารถในการอ่านและเขียนค่าของ properties ในวัตถุ โดย set function ใช้สำหรับตั้งค่าสำหรับ property ในขณะที่ get function ใช้ในการเข้าถึงหรืออ่านค่าจาก property นั้นๆ
ในภาษา JavaScript, OOP และ set/get functions สามารถเขียนได้ดังนี้:
class User {
constructor(name) {
this._name = name; // property ที่มี underscore เป็นการบ่งบอกว่าควรเป็น private
}
// ใช้ get function เพื่ออ่านค่าจาก property
get name() {
return this._name;
}
// ใช้ set function เพื่อตั้งค่าใหม่ให้กับ property
set name(newName) {
this._name = newName;
}
}
const user1 = new User('Aom');
console.log(user1.name); // อ่านค่าโดยไม่ต้องใช้ function เรียก, ผลลัพธ์: Aom
user1.name = 'Sara'; // ตั้งค่าใหม่โดยไม่ต้องใช้ function ตั้งค่า, แต่จริงๆ แล้วเรียกใช้ set function
console.log(user1.name); // ผลลัพธ์: Sara
1. การจัดการบัญชีผู้ใช้:
เช่น เรามีระบบจัดการบัญชีผู้ใช้ วัตถุ `User` อาจมี properties เช่น อายุ เราไม่อยากให้มีการตั้งค่าอายุให้น้อยกว่า 0 โดยไม่ตั้งใจ เราสามารถใช้ set function เพื่อตรวจสอบค่าก่อนที่จะได้รับการตั้งค่า:
class User {
constructor(age) {
this._age = age;
}
get age() {
return this._age;
}
set age(newAge) {
if(newAge >= 0) {
this._age = newAge;
} else {
console.error('กรุณาใส่อายุที่ถูกต้อง');
}
}
}
ในตัวอย่างนี้ หากมีการพยายามตั้งค่าอายุเป็นค่าที่ไม่ได้ตั้งใจ ระบบจะแสดงข้อผิดพลาดและไม่ได้รับการเปลี่ยนแปลงผ่าน set function.
2. การตรวจสอบสถานะการเชื่อมต่อ:
ในแอพพลิเคชั่นที่ต้องการตรวจสอบสถานะการเชื่อมต่อกับอินเทอร์เน็ต:
class NetworkStatus {
constructor() {
this._online = navigator.onLine;
}
get online() {
return this._online;
}
updateStatus() {
this._online = navigator.onLine;
}
}
const networkStatus = new NetworkStatus();
console.log(networkStatus.online); // ผลลัพธ์: true หรือ false
จากตัวอย่างด้านบน, `NetworkStatus` ใช้ get function เพื่อเรียกดูสถานะการเชื่อมต่อ ซึ่งสามารถสื่อได้ว่าการเขียนโปรแกรมด้วย OOP ใน JavaScript ช่วยให้การจัดการกับออบเจกต์ใด ๆ ในโค้ดของคุณมีความสะดวกสบายและปลอดภัยมากยิ่งขึ้น
หากคุณสนใจการเรียนรู้โปรแกรมมิ่งด้วย JavaScript และการนำเสนอเนื้อหาในวิธีที่มีความยืดหยุ่นและแข็งแกร่ง ภายใต้ความเข้าใจที่ถูกต้องของ OOP ลองสมัครเรียนที่ EPT (Expert-Programming-Tutor) เพื่อศึกษาเพิ่มเติมได้เลย!
หมายเหตุ: ข้อมูลในบทความนี้อาจจะผิด โปรดตรวจสอบความถูกต้องของบทความอีกครั้งหนึ่ง บทความนี้ไม่สามารถนำไปใช้อ้างอิงใด ๆ ได้ ทาง EPT ไม่ขอยืนยันความถูกต้อง และไม่ขอรับผิดชอบต่อความเสียหายใดที่เกิดจากบทความชุดนี้ทั้งทางทรัพย์สิน ร่างกาย หรือจิตใจของผู้อ่านและผู้เกี่ยวข้อง
หากมีข้อผิดพลาด/ต้องการพูดคุยเพิ่มเติมเกี่ยวกับบทความนี้ กรุณาแจ้งที่ http://m.me/Expert.Programming.Tutor
085-350-7540 (DTAC)
084-88-00-255 (AIS)
026-111-618
หรือทาง EMAIL: NTPRINTF@GMAIL.COM