Skip to content

10. وحدات ES6

Image

تتيح لك وحدات ES6 إنشاء تطبيقات JavaScript منظمة في شكل وحدات مستقلة وقابلة لإعادة الاستخدام.

10.1. نصوص برمجية [import-01، export-01]

سيستخدم البرنامج النصي [import-01] الوحدة [export-01]. ويتم تعريف ذلك على النحو التالي:


// export par défaut d'un objet non nommé
export default {
  data: 2,
  do() {
    console.log(this.data);
  }
};

تعليقات

  • تحدد الأسطر [2–7] كائنًا غير مسمى بخصائص [data, do]؛
  • السطر 2: تقوم عبارة [export default] بتصدير هذا الكائن. وبالتالي يمكن استيراده؛

يتم استخدام الوحدة النمطية [export-01] بواسطة البرنامج النصي [import-01] على النحو التالي:


'use strict';
// import d'un objet exporté par défaut
import export01 from './export-01';
// utilisation de cet objet
export01.do();
// on peut importer un export par défaut sous n'importe quel nom
import data from './export-01';
console.log(data.data);

تعليقات

  • تستورد السطران 3 و7 الكائن المُصدَّر الافتراضي من الوحدة النمطية [export-01] تحت اسمين مختلفين؛
  • بمجرد استيراد الكائن، يمكن استخدامه كما لو كان قد تم تعريفه محليًا في البرنامج النصي؛

التنفيذ


[Running] C:\myprograms\laragon-lite\bin\nodejs\node-v10\node.exe -r esm "c:\Data\st-2019\dev\es6\javascript\modules\import-01.js"
2
2

10.2. نصوص برمجية [import-02، export-02]

توضح هذه البرامج النصية تصدير كائن مسمى.

النص البرمجي [export-02] هو كما يلي:


// export par défaut d'un objet nommé
const data = {
  data: 2,
  do() {
    console.log(this.data);
  }
};
// export
export default data;
  • السطر 9: نقوم بتصدير كائن [data]؛

لا يؤثر تسمية الكائن المصدر أو عدم تسميته على عملية الاستيراد. النص البرمجي [import-02] هو كما يلي:


'use strict';
// import d'un objet exporté par défaut
import module1 from './export-02';
// utilisation de cet objet
module1.do();
// on peut importer un export par défaut sous n'importe quel nom
import module2 from './export-02';
console.log(module2.data);

التنفيذ


[Running] C:\myprograms\laragon-lite\bin\nodejs\node-v10\node.exe -r esm "c:\Data\st-2019\dev\es6\javascript\modules\import-02.js"
2
2

10.3. نصوص برمجية [import-03، export-03]

يمكن للوحدة النمطية تصدير عناصر متعددة.

النص البرمجي [export-03] هو كما يلي:


// multi-exports
// object export
const data = {
  data: 2,
  do() {
    console.log(this.data);
  }
};
// export function
export { data };
function doSomething() {
  console.log("doSomething");
}
export { doSomething };

تعليقات

  • السطران 10 و 14: تصدير عنصرين. يتم تصدير العنصر باستخدام الصيغة [export {element}];

يستخدم البرنامج النصي [import-03] الوحدة النمطية [export-03] على النحو التالي:


'use strict';
// import d'un module [export03]
import {data, doSomething} from './export-03';
// utilisation des imports
data.do();
doSomething();
// autre écriture
import * as module from './export-03';
// utilisation de l'import
console.log(module.data);
module.doSomething();
  • السطر 3: تتم عمليات [الاستيراد] باستخدام الأسماء الدقيقة للكائنات المصدرة؛
  • السطر 8: يمكنك استيراد جميع الكائنات المصدرة إلى كائن مسمى (هنا [module]

التنفيذ


[Running] C:\myprograms\laragon-lite\bin\nodejs\node-v10\node.exe -r esm "c:\Data\st-2019\dev\es6\javascript\modules\import-03.js"
2
doSomething
{ data: 2, do: [Function: do] }
doSomething