ธุรกรรมและ CRUD
เพิ่ม อ่าน อัปเดต และลบบันทึก
ธุรกรรมและ CRUD เป็นบทเรียน JavaScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน JavaScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
ทุกอย่างคือ transaction
ใน IndexedDB การอ่านและการเขียนทั้งหมดเกิดขึ้นภายใน transaction transaction จะรวมการดำเนินการไว้ด้วยกัน เพื่อให้ทั้งหมดสำเร็จหรือย้อนกลับทั้งหมด รักษาความสอดคล้องของข้อมูล
การเริ่ม transaction
สร้าง transaction ด้วย db.transaction(storeNames, mode) mode อาจเป็น 'readonly' (ค่าเริ่มต้น) หรือ 'readwrite' สำหรับการแก้ไขข้อมูล
const tx = db.transaction('notes', 'readwrite');
const store = tx.objectStore('notes');การรับที่เก็บออบเจ็กต์
จาก transaction ให้รับที่เก็บออบเจ็กต์ที่ต้องการใช้งานผ่าน tx.objectStore(name) เมธอดสำหรับการสร้าง อ่าน แก้ไข และลบข้อมูลทั้งหมดอยู่บน store นี้
const tx = db.transaction('notes', 'readwrite');
const store = tx.objectStore('notes');
// store.add / get / put / deleteการเพิ่มระเบียน
store.add(value) แทรกระเบียนใหม่ หากมีระเบียนที่ใช้คีย์เดียวกันอยู่แล้ว การดำเนินการจะล้มเหลว ซึ่งช่วยป้องกันการเขียนทับโดยไม่ตั้งใจ
const store = tx.objectStore('notes');
const req = store.add({ id: 1, text: 'Buy milk' });
req.onsuccess = () => console.log('added with key', req.result);การอ่านระเบียน
store.get(key) ดึงระเบียนหนึ่งรายการด้วยคีย์ของระเบียนนั้น ผลลัพธ์จะมาถึงใน onsuccess ของคำขอในรูป request.result (เป็น undefined หากไม่พบ)
const req = store.get(1);
req.onsuccess = () => {
console.log('record:', req.result);
};การอัปเดตด้วย put
store.put(value) แทรกหรือแทนที่ระเบียน ต่างจาก add ตรงที่สามารถเขียนทับระเบียนเดิมที่มีคีย์เดียวกันได้ จึงเหมาะอย่างยิ่งสำหรับการอัปเดต
store.put({ id: 1, text: 'Buy milk and eggs' });
// Replaces the existing record with id 1.การลบระเบียน
store.delete(key) ลบระเบียนที่มีคีย์ที่กำหนด การดำเนินการจะสำเร็จแม้ไม่มีระเบียนดังกล่าวอยู่
const req = store.delete(1);
req.onsuccess = () => console.log('deleted');การล้างที่เก็บ
store.clear() ลบระเบียนทั้งหมดในที่เก็บออบเจ็กต์พร้อมกัน ใช้เพื่อรีเซ็ตข้อมูลที่แคชไว้
store.clear();
// All records in 'notes' are removed.การเสร็จสิ้นของ transaction
ตัว transaction เองจะส่ง oncomplete เมื่อการดำเนินการทั้งหมดถูกยืนยันแล้ว และส่ง onerror หรือ onabort หากเกิดข้อผิดพลาด ใช้ oncomplete เพื่อยืนยันว่าการเขียนข้อมูลถูกจัดเก็บอย่างถาวรแล้ว
tx.oncomplete = () => console.log('all changes saved');
tx.onerror = () => console.log('transaction failed');พฤติกรรมการยืนยันอัตโนมัติ
transaction จะยืนยันอัตโนมัติเมื่อการควบคุมกลับสู่ลูปเหตุการณ์โดยไม่มีคำขอที่รอดำเนินการ คุณไม่สามารถเปิด transaction ค้างไว้ข้าม await ของงานแบบไม่พร้อมกันที่ไม่เกี่ยวข้องได้ ดังนั้นให้ดำเนินการทั้งหมดกับ store ต่อเนื่องกัน
// Queue operations synchronously within the same tx:
store.add({ id: 2, text: 'A' });
store.add({ id: 3, text: 'B' });
// Both commit together when tx completes.สรุปการสร้าง อ่าน อัปเดต และลบข้อมูล
การดำเนินการหลักทั้งสี่รายการสอดคล้องกันดังนี้:
- สร้าง:
add - อ่าน:
get - อัปเดต:
put - ลบ:
delete
ทั้งหมดอยู่ภายในธุรกรรมที่รับประกันความสอดคล้องของข้อมูล
ตรวจสอบความเข้าใจอย่างรวดเร็ว
ทดสอบความเข้าใจเกี่ยวกับธุรกรรมและการสร้าง อ่าน อัปเดต และลบข้อมูล
ทบทวน
คุณได้เรียนรู้เกี่ยวกับธุรกรรมและการสร้าง อ่าน อัปเดต และลบข้อมูลแล้ว:
- เริ่มต้นด้วย
db.transaction(store, mode) - รับที่เก็บข้อมูลด้วย
tx.objectStore(name) addใช้แทรกข้อมูล,getใช้อ่านข้อมูล,putใช้เพิ่มหรืออัปเดตข้อมูล,deleteใช้ลบข้อมูล- ผลลัพธ์จะมาถึงใน
onsuccessของแต่ละคำขอ tx.oncompleteยืนยันว่าการเปลี่ยนแปลงถูกบันทึกแล้ว
ถัดไปคือดัชนีและการสืบค้น
คำถามที่พบบ่อย
บทเรียน “ธุรกรรมและ CRUD” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “ธุรกรรมและ CRUD” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส JavaScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “ธุรกรรมและ CRUD”
เพิ่ม อ่าน อัปเดต และลบบันทึก คุณปฏิบัติ JavaScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน JavaScript Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน JavaScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน
บทเรียน “ธุรกรรมและ CRUD” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน JavaScript Academy นี้ได้ไหม
ได้ บทเรียน JavaScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ