พื้นฐาน CommonJS — require/module.exports และ exports
เรียนรู้ CommonJS: require(), module.exports ทางลัด exports และทำความรู้จักการทำงานร่วมกับ ESM เล็กน้อย
พื้นฐาน CommonJS — require/module.exports และ exports เป็นบทเรียน JavaScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 2 จากทั้งหมด 3 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน JavaScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 3 บทเรียน
ภาพรวม CJS
เป้าหมาย: อ่านและเขียนโมดูล CommonJS ขนาดเล็ก
- require() โหลดโมดูล
- module.exports คืออ็อบเจ็กต์ส่งออก
- exports คือทางลัดไปยังอ็อบเจ็กต์เดียวกัน
- ทำความรู้จักการทำงานร่วมกับ ESM อย่างรวดเร็ว

require() — แนวคิด
require(path) ส่งคืนอ็อบเจ็กต์ที่โมดูลส่งออกใน CommonJS
// CommonJS import uses require()
const cjsExample = [
"const math = require(\\"./math.js\\");",
"console.log(math.sum(2, 3));"
];
console.log("require() example:");
for (const line of cjsExample) console.log(line);
// Emulate a loaded module object
const loaded = { sum: function (a, b) { return a + b; } };
console.log("emulated require sum:", loaded.sum(2, 3));
module.exports
กำหนดค่าให้กับ module.exports เพื่อส่งออกค่านั้น (ฟังก์ชัน อ็อบเจ็กต์ และอื่น ๆ)
// module.exports sets what the module returns
const lines1 = [
"function greet(name) { return \\"Hi \\" + name; }",
"module.exports = greet;"
];
console.log("module.exports example:");
for (const l of lines1) console.log(l);
// Emulate consumption
function greet(name) { return "Hi " + name; }
const api1 = greet; // like module.exports = greet
console.log("use exported fn:", api1("Ayla"));
ทางลัด exports
exports.prop = ... ใช้ได้ แต่อย่ากำหนดค่าใหม่ให้ exports = ... เพราะตัวแปรนี้จะไม่ชี้ไปยัง module.exports อีกต่อไป
// exports is a shortcut to module.exports (same object)
const lines2 = [
"// Good: add properties",
"exports.sum = function (a, b) { return a + b; };",
"",
"// Pitfall: reassigning exports breaks the link",
"exports = function () {}; // WRONG"
];
console.log("exports shortcut:");
for (const l of lines2) console.log(l);
// Emulate good usage
const moduleObj = {};
const exportsRef = moduleObj; // like exports === module.exports initially
exportsRef.sum = function (a, b) { return a + b; };
console.log("sum via exportsRef:", moduleObj.sum(2, 4));
การส่งออกหลายรายการ
คุณสามารถส่งออกอ็อบเจ็กต์ที่เก็บฟังก์ชันไว้หลายรายการ แล้วอ่านฟังก์ชันเหล่านั้นผ่านพร็อพเพอร์ตีได้
// Export an object with multiple members
const lines3 = [
"function add(a, b) { return a + b; }",
"function mul(a, b) { return a * b; }",
"module.exports = { add, mul };"
];
console.log("multiple exports object:");
for (const l of lines3) console.log(l);
// Emulate consumption
const api2 = {
add: function (a, b) { return a + b; },
mul: function (a, b) { return a * b; }
};
console.log("use add/mul:", api2.add(1, 2), api2.mul(2, 3));
ทำความรู้จัก ESM ↔ CJS
การทำงานร่วมกัน (มุมมองเบื้องต้น):
- เมื่อ ESM นำเข้า CJS มักจะได้รับ module.exports ของ CJS เป็นค่าเริ่มต้น
- ตัวอย่าง: import pkg from "./cjs.js" แล้วใช้ pkg.add()
- ควรทำตัวอย่างให้เรียบง่าย และหลีกเลี่ยงการผสมรูปแบบในไฟล์เดียว เว้นแต่จำเป็น

แบบทดสอบไวยากรณ์การส่งออก CJS
ตรวจสอบอย่างรวดเร็ว: การส่งออกใน CommonJS

สรุป
สรุป: โหลดด้วย require() ส่งออกด้วย module.exports เพิ่มพร็อพเพอร์ตีผ่าน exports.prop และหลีกเลี่ยงการกำหนดค่าใหม่ให้ exports การทำงานร่วมกับ ESM มักแมป module.exports ของ CJS เป็นค่าเริ่มต้น

คำถามที่พบบ่อย
บทเรียน “พื้นฐาน CommonJS — require/module.exports และ exports” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “พื้นฐาน CommonJS — require/module.exports และ exports” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส JavaScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 3 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “พื้นฐาน CommonJS — require/module.exports และ exports”
เรียนรู้ CommonJS: require(), module.exports ทางลัด exports และทำความรู้จักการทำงานร่วมกับ ESM เล็กน้อย คุณปฏิบัติ JavaScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน JavaScript Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน JavaScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 2 จากทั้งหมด 3 บทเรียน
บทเรียน “พื้นฐาน CommonJS — require/module.exports และ exports” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน JavaScript Academy นี้ได้ไหม
ได้ บทเรียน JavaScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- พื้นฐาน ESM — import/export, default กับ named
- พื้นฐาน CommonJS — require/module.exports และ exports
- การค้นหาโมดูลใน Node และตัวรวมโค้ดของเบราว์เซอร์