การแปลง CommonJS Modules เป็น ES ใน JavaScript

จนถึงตอนนี้ในเอกสารต่างๆ ยังสามารถพบการนำเข้าในรูปแบบของ CommonJS Modules ได้ คุณจำเป็นต้องเรียนรู้วิธีการแปลง การนำเข้าเหล่านี้ไปเป็น ES Modules มาตรฐาน

ใน CommonJS การนำเข้าจะทำโดยใช้คำสั่ง require โดยระบุพารามิเตอร์เป็น พาธไปยังโมดูล ผลลัพธ์ของคำสั่งจะถูกเก็บ ลงในตัวแปร:

let math = require('./math');

มาแปลงโค้ดนี้เป็นสไตล์ ES กัน เริ่มต้นให้สังเกตว่า ใน CommonJS จะไม่ใส่ส่วนขยาย .js สำหรับไฟล์ แต่ใน ES - ต้องใส่

ต่อจากนี้ทั้งหมดขึ้นอยู่กับว่า โมดูลนั้นมีการส่งออกแบบค่าเริ่มต้น (default export) หรือแบบปกติหรือไม่ ใน CommonJS ไม่มีความแตกต่าง แต่ใน ES Modules - มี โดยทั่วไปแล้ว ความแตกต่างจะเห็นได้จากตัวอย่างโค้ด หรือคุณสามารถลองใช้การนำเข้าทั้งสองรูปแบบดู

ในกรณีของเรา การนำเข้าที่แสดงไว้ จะถูกเขียนใหม่ได้เป็นรูปแบบใดรูปแบบหนึ่งดังนี้:

import math from './math.js';

หรือเป็นรูปแบบนี้:

import * as math from './math.js';

โปรดเขียนโค้ดต่อไปนี้ใหม่ ในสไตล์ ES Modules:

let {square, cube} = require('./math');

โปรดเขียนโค้ดต่อไปนี้ใหม่ ในสไตล์ ES Modules:

let math = require('./math');
let res  = math.square(2) + math.cube(3);

โปรดเขียนโค้ดต่อไปนี้ใหม่ ในสไตล์ ES Modules:

let sum = require('./sum');
let res = sum([1, 2, 3]);