JavaScript ถือเป็นภาษาโปรแกรมมิ่งที่มีบทบาทสำคัญในโลกของการพัฒนาเว็บแอปพลิเคชัน หนึ่งในคุณสมบัติที่ทรงพลังของ JavaScript คือ `Promise` สำหรับการจัดการกับการดำเนินงานแบบ asynchronous. ด้วยความสามารถในการจัดการ workflow ที่มีการทำงานหลายอย่างที่ไม่แน่นอนหรือต้องรอเวลา, `Promise` ได้กลายมาเป็นหัวใจสำคัญในการเขียนโค้ดที่มีการเชื่อมต่อกับสิ่งที่ไม่สามารถคาดเดาได้ อาทิ เช่น การร้องขอข้อมูลจากเซิร์ฟเวอร์, การอ่านไฟล์, หรือการดำเนินงานที่ต้องใช้เวลานาน.
`Promise` ใน JavaScript คือ ตัวแทนของค่าที่จะมีการคำนวณหรือดำเนินการในอนาคต. `Promise` มีสามสถานะหลัก:
1. `pending`: สถานะเริ่มต้น, คำสัญญายังไม่เป็นผล
2. `fulfilled`: การดำเนินการสำเร็จ, `Promise` มีค่า resolved
3. `rejected`: การดำเนินการล้มเหลว, `Promise` มีค่า rejected
การใช้งาน `Promise` ช่วยจัดการกับการเขียนโค้ดที่ต้องการจัดการกับ asynchronous operations อย่างเป็นระเบียบ รวมถึงช่วยให้โค้ดสามารถจัดการกับข้อผิดพลาดได้อย่างง่ายดาย.
ตัวอย่างที่ 1: Basic Promise
let dataLoaded = new Promise((resolve, reject) => {
let data = loadData();
if (data) {
resolve(data);
} else {
reject('Error loading data');
}
});
dataLoaded.then((data) => {
console.log('Data loaded successfully', data);
}).catch((error) => {
console.error(error);
});
ในตัวอย่างแรกนี้เราสร้าง `Promise` ซึ่งทำการโหลดข้อมูล หากการโหลดเสร็จสิ้นสมบูรณ์ ข้อมูลจะถูกส่งไปที่สถานะ `resolve` หากมีข้อผิดพลาดใดๆ ก็จะส่งไปที่ `reject`.
ตัวอย่างที่ 2: การทำงานของ Promise ในปฏิบัติการที่มีการเชื่อมต่อกับเซิร์ฟเวอร์
function getUser(userId) {
return new Promise((resolve, reject) => {
fetch(`/api/users/${userId}`)
.then(response => {
if (response.ok) {
return response.json();
}
throw new Error('Network response was not ok.');
})
.then(userData => resolve(userData))
.catch(error => reject(error));
});
}
getUser(1)
.then(userData => console.log(userData))
.catch(error => console.error(error));
ในตัวอย่างที่สอง การใช้ `Promise` ในการแปลงการเรียกใช้งาน API ซึ่งเป็น asynchronous operation ทำให้โค้ดสามารถอ่านได้ง่ายและจัดการกับข้อผิดพลาดได้อย่างชัดเจน.
หมายเหตุ: ข้อมูลในบทความนี้อาจจะผิด โปรดตรวจสอบความถูกต้องของบทความอีกครั้งหนึ่ง บทความนี้ไม่สามารถนำไปใช้อ้างอิงใด ๆ ได้ ทาง EPT ไม่ขอยืนยันความถูกต้อง และไม่ขอรับผิดชอบต่อความเสียหายใดที่เกิดจากบทความชุดนี้ทั้งทางทรัพย์สิน ร่างกาย หรือจิตใจของผู้อ่านและผู้เกี่ยวข้อง
หากเจอข้อผิดพลาด หรือต้องการพูดคุย ติดต่อได้ที่ https://m.me/expert.Programming.Tutor/
Tag ที่น่าสนใจ: javascript promise asynchronous workflow pending fulfilled rejected error_handling async_operations fetch_api network_response error_handling resolve reject
หากมีข้อผิดพลาด/ต้องการพูดคุยเพิ่มเติมเกี่ยวกับบทความนี้ กรุณาแจ้งที่ http://m.me/Expert.Programming.Tutor
085-350-7540 (DTAC)
084-88-00-255 (AIS)
026-111-618
หรือทาง EMAIL: NTPRINTF@GMAIL.COM
Copyright (c) 2013 expert-programming-tutor.com. All rights reserved. | 085-350-7540 | 084-88-00-255 | ntprintf@gmail.com