انتقل إلى المحتوى الرئيسي

استيراد و تصدير

@serverSerrverlesskiy

لإنشاء كائنات أو وظائف أو فئات أو متغيرات متاح للعالم الخارجي ، ما عليك سوى تصديرها ثم استيرادها إلى ملفات مشاريع أخرى عند الضرورة.

"مرحبا بالعالم!" على Node.js

Node.js® هي بيئة JavaScript مبنية على Chrome V8 محرك.

لنبدأ مع Node.js فقط عن طريق كتابة العقدة في وحدة التحكم:

$ node
>

إذا لم يكن لديك ، إذنdownload وتثبيته على جهاز الكمبيوتر الخاص بك.

الآن دعنا نحاول طباعة شيء ما:

$ node
> console.log('hello from Node.js')
// After hitting Enter, you get this:
hello from Node.js
undefined

Export

لا تتردد في تجربة "Node.js" باستخدام هذه الواجهة: من الشائع اختبار أجزاء صغيرة من التعليمات البرمجية هنا إذا لم يكن عمليًا وضعها مباشرة في ملف.

حان الوقت لإنشاء تطبيق Hello Node.js!

لنبدأ بإنشاء ملف index.js. باستخدام الأمر التالي ، نقوم بإنشاء المجلد "myProject" وأدخله.

mkdir myProject && cd myProject

Now we create the index.js file itself

touch index.js

افتح محرر التعليمات البرمجية الخاص بك أو قم بتنزيله وتثبيته. نوصي VS Code.

افتح محرر الكود وأضف مجلد المشروع الذي أنشأناه إليه.

new prroject

الآن افتح القائمة الجانبية بالنقر فوق هذا الرمز.

new prroject

انسخ الجزء التالي من التعليمات البرمجية فيه:

// index.js
console.log('hello from Node.js')

لتشغيل هذا الملف ، يجب عليك إعادة فتح الجهاز الخاص بك والانتقال إلى الدليل حيث يوجد index.js

في "VS Code" يمكن القيام بذلك عن طريق النقر على هذه الرموز.

new prroject

واختر علامة التبويب "TERMINAL"

new prroject

بمجرد أن تنتقل بنجاح إلى الموقع المطلوب ، قم بتشغيل الملف باستخدام الأمر

node index.js

سترى أن هذا الأمر سينتج نفس الإخراج كما كان من قبل ، وطباعة السلسلة مباشرة إلى المحطة.

new prroject

نمطية التطبيق

Export

حان الوقت للانتقال إلى المستوى التالي! دعونا ننشئ شيئًا أكثر تعقيدًا بقليل من خلال تقسيم شفرة المصدر الخاصة بنا إلى ملفات جافا سكريبت متعددة من أجل سهولة القراءة وقابلية الصيانة.

هيكل المشروع

أنشئ بنية الدليل التالية (بالملفات الفارغة) ، لكن لا تنشئ "package.json" حتى الآن ، فسننشئها تلقائيًا في الخطوة التالية:

├── app
| ├── calc.js
| └── index.js
├── index.js
└── package.json

لإنشاء ملف أو مجلد جديد في "VS Code" ، انقر فوق الرمز المقابل كما هو موضح في الصورة.

new file

package.json

كل Node.js يبدأ المشروع بإنشاء ملف package.json ملف. يمكنك التفكير في الأمر على أنه تمثيل JSON للتطبيق وتبعياته. يحتوي على اسم التطبيق الخاص بك ، والمؤلف (أنت) ، وأي تبعيات مطلوبة لتشغيل التطبيق. هذه خريطة مشروعك

يمكنك إنشاء ملف package.json بشكل تفاعلي باستخدام الأمر

npm init

في المحطة. بعد تشغيل الأمر ، سيُطلب منك إدخال بعض المعلومات ، مثل اسم التطبيق والإصدار والوصف وما إلى ذلك. لا داعي للقلق ، فقط اضغطEnter حتى تحصل على JSON الذي تم إنشاؤه والسؤال هل هو جيد؟. اضغط على Enter للمرة الأخيرة وفويلا: تم إنشاء package.json تلقائيًا ووضعه في مجلد التطبيق الخاص بك. إذا فتحت هذا الملف في IDE الخاص بك ، فإنه يبدو مشابهًا جدًا لمقتطف الشفرة أدناه.

// package.json
{
"name": "myproject",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}

من الممارسات الجيدة إضافة برنامج نصي لبدء التشغيل إلى ملف package.json رزمة. لذا أضف السطر التالي إلى scripts موضوع:

"scripts": {
"start": "node index.js", // this line
"test": "echo \"Error: no test specified\" && exit 1"
}

بمجرد القيام بذلك ، يمكنك بدء التطبيق باستخدام الأمر "npm start".

يستورد

الآن دعنا نعود إلى الملف الأول الذي قمت بإنشائه والمسمىindex.js. يوصى بالحفاظ على هذا الملف مضغوطًا جدًا: قم فقط بتضمين التطبيق نفسه(تم إنشاء ملف index.js من دليل فرعي / app سابقًا). انسخ الكود التالي إلى ملف index.js واحفظه:

// index.js
require('./app/index')

or shorthand for all index.js files

// index.js
require('./app')

إذا لم يتم تحديد ملف معين ، فسيقوم مترجم الشفرة بالبحث عن ملف index.js وإدخاله. هذه هي الطريقة التي قمنا بها ببساطة بتوصيل ملفنا الأول بالمشروع.

Export

يصدر

حان الوقت الآن لبدء إنشاء تطبيق حقيقي. افتح الindex.js ملف من /app لإنشاء مثال بسيط للغاية: إضافة مصفوفة من الأرقام. في هذه الحالة ، فإن ملف index.js سيحتوي الملف فقط على الأرقام التي نريد إضافتها ، ويجب وضع المنطق الذي يتطلب الحسابات في وحدة منفصلة فيcalc.js ملف. الصق هذه الشفرة في ملف index.js في دليل / app.

// app/index.js
const calc = require('./calc')
const numbersToAdd = [3, 4, 10, 2]
const result = calc.sum(numbersToAdd)

console.log(`The result is: ${result}`)

الآن قم بلصق منطق الأعمال الفعلي في ملف calc.js الذي يمكن العثور عليه في نفس المجلد.

// app/calc.js
const sum = arr => {
return arr.reduce((a, b) => a + b, 0)
}

module.exports.sum = sum // export

في هذا الملف ، أنشأنا دالة "sum" وقمنا بتصديرها ، وجعلناها متاحة في ملفات أخرى في المشروع.

للتحقق مما إذا كنت قد فعلت كل شيء بشكل صحيح ، احفظ هذه الملفات ، وافتح Terminal واكتبnpm start أو node index.js. إذا فعلت كل شيء بشكل صحيح ، فستتلقى الإجابة: "19." إذا حدث خطأ ما ، فراجع بعناية السجل في وحدة التحكم وابحث عن المشكلة بناءً عليها.

new file

مجموع

لذلك أكملنا الدورة التحضيرية في JavaScript قبل الدورة mobile development.

مشاكل؟

Problem

اكتب ل Discord محادثة.

أسئلة:

Question

لإنشاء كائنات أو وظائف أو فئات أو متغيرات متاح للعالم الخارجي ، فأنت بحاجة إلى:

  1. تصديرها ثم الاستيراد
  2. استيرادها ثم تصديرها

Node.js® هو:

  1. لغة البرمجة
  2. بيئة JavaScript مبنية على محرك Chrome V8
  3. المتصفح

package.json هو:

  1. بيئة JavaScript مبنية على محرك Chrome V8
  2. تمثيل JSON للتطبيق وتبعياته
  3. لغة برمجة JSON

لفهم مقدار ما تعلمته في هذا الدرس ، قم بإجراء الاختبار فيmobile application من مدرستنا في هذا الموضوع.

EnglishMoji!

الروابط:

  1. MDN web doc. ECMAScript 6 Modules: The Future Is Now
  2. ES6 Modules and How to Use Import and Export in JavaScript
  3. "require vs ES6 import / export"

المساهمون ✨

الشكر يعود إلى هؤلاء الأشخاص الرائعين (emoji key):


Dmitriy K.


Dmitriy Vasilev

💵

Resoner2005

🐛 🎨 🖋

Navernoss

🖋 🐛 🎨

EnglishMoji!