9.2 KiB

Raw Permalink Blame History

أساسيات JavaScript: المصفوفات والحلقات

رسم توضيحي بواسطة Tomomi Imura

اختبار ما قبل المحاضرة

تغطي هذه الدرس أساسيات JavaScript، اللغة التي تضيف التفاعلية إلى الويب. في هذا الدرس، ستتعلم عن المصفوفات والحلقات، والتي تُستخدم لمعالجة البيانات.

🎥 انقر على الصور أعلاه لمشاهدة فيديوهات عن المصفوفات والحلقات.

يمكنك متابعة هذا الدرس على Microsoft Learn!

المصفوفات

التعامل مع البيانات هو مهمة شائعة في أي لغة برمجة، وتصبح هذه المهمة أسهل عندما يتم تنظيم البيانات في هيكل مثل المصفوفات. باستخدام المصفوفات، يتم تخزين البيانات في هيكل يشبه القائمة. واحدة من الفوائد الرئيسية للمصفوفات هي أنه يمكنك تخزين أنواع مختلفة من البيانات في مصفوفة واحدة.

✅ المصفوفات موجودة في كل مكان حولنا! هل يمكنك التفكير في مثال من الحياة الواقعية لمصفوفة، مثل مصفوفة ألواح شمسية؟

صيغة كتابة المصفوفة هي زوج من الأقواس المربعة.

let myArray = [];

هذه مصفوفة فارغة، ولكن يمكن تعريف المصفوفات وهي تحتوي بالفعل على بيانات. يتم فصل القيم المتعددة في المصفوفة بفاصلة.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];

يتم تعيين قيم المصفوفة قيمة فريدة تُسمى الفهرس، وهو رقم صحيح يتم تعيينه بناءً على المسافة من بداية المصفوفة. في المثال أعلاه، القيمة النصية "Chocolate" لها فهرس 0، وفهرس "Rocky Road" هو 4. يمكنك استخدام الفهرس مع الأقواس المربعة لاسترجاع أو تغيير أو إدخال قيم المصفوفة.

✅ هل يفاجئك أن المصفوفات تبدأ بالفهرس صفر؟ في بعض لغات البرمجة، تبدأ الفهارس من 1. هناك تاريخ مثير للاهتمام حول هذا الموضوع، يمكنك قراءته على ويكيبيديا.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
iceCreamFlavors[2]; //"Vanilla"

يمكنك استخدام الفهرس لتغيير قيمة، مثل هذا:

iceCreamFlavors[4] = "Butter Pecan"; //Changed "Rocky Road" to "Butter Pecan"

ويمكنك إدخال قيمة جديدة في فهرس معين مثل هذا:

iceCreamFlavors[5] = "Cookie Dough"; //Added "Cookie Dough"

✅ الطريقة الأكثر شيوعًا لإضافة قيم إلى مصفوفة هي باستخدام العمليات مثل array.push()

لمعرفة عدد العناصر الموجودة في المصفوفة، استخدم خاصية length.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];
iceCreamFlavors.length; //5

✅ جرب بنفسك! استخدم وحدة التحكم في متصفحك لإنشاء ومعالجة مصفوفة من إنشائك.

الحلقات

تسمح لنا الحلقات بتنفيذ مهام متكررة أو تكرارية، ويمكن أن توفر الكثير من الوقت والشفرة. يمكن أن تختلف كل تكرار في متغيراتها وقيمها وشروطها. هناك أنواع مختلفة من الحلقات في JavaScript، وكلها لها اختلافات صغيرة، لكنها تقوم في الأساس بنفس الشيء: التكرار على البيانات.

حلقة For

تتطلب حلقة for ثلاثة أجزاء للتكرار:

counter متغير يتم تهيئته عادةً برقم يعد عدد التكرارات
condition تعبير يستخدم عوامل المقارنة لإيقاف الحلقة عندما تكون النتيجة false
iteration-expression يتم تشغيله في نهاية كل تكرار، ويُستخدم عادةً لتغيير قيمة العداد

// Counting up to 10
for (let i = 0; i < 10; i++) {
  console.log(i);
}

✅ قم بتشغيل هذا الكود في وحدة التحكم في المتصفح. ماذا يحدث عندما تقوم بإجراء تغييرات صغيرة على العداد أو الشرط أو تعبير التكرار؟ هل يمكنك جعله يعمل بالعكس، لإنشاء عد تنازلي؟

حلقة While

على عكس صيغة حلقة for، تتطلب حلقات while فقط شرطًا لإيقاف الحلقة عندما تصبح النتيجة false. تعتمد الشروط في الحلقات عادةً على قيم أخرى مثل العدادات، ويجب إدارتها أثناء الحلقة. يجب إنشاء القيم الابتدائية للعدادات خارج الحلقة، وأي تعبيرات لتحقيق شرط، بما في ذلك تغيير العداد، يجب أن تتم داخل الحلقة.

//Counting up to 10
let i = 0;
while (i < 10) {
 console.log(i);
 i++;
}

✅ لماذا قد تختار استخدام حلقة for بدلاً من while؟ 17 ألف مشاهد كان لديهم نفس السؤال على StackOverflow، وبعض الآراء قد تكون مثيرة للاهتمام بالنسبة لك.

الحلقات والمصفوفات

تُستخدم المصفوفات غالبًا مع الحلقات لأن معظم الشروط تتطلب طول المصفوفة لإيقاف الحلقة، ويمكن أن يكون الفهرس أيضًا قيمة العداد.

let iceCreamFlavors = ["Chocolate", "Strawberry", "Vanilla", "Pistachio", "Rocky Road"];

for (let i = 0; i < iceCreamFlavors.length; i++) {
  console.log(iceCreamFlavors[i]);
} //Ends when all flavors are printed

✅ جرب التكرار على مصفوفة من إنشائك في وحدة التحكم في المتصفح.

🚀 التحدي

هناك طرق أخرى للتكرار على المصفوفات غير الحلقات for وwhile. هناك forEach، for-of، وmap. أعد كتابة حلقة المصفوفة الخاصة بك باستخدام واحدة من هذه التقنيات.

اختبار ما بعد المحاضرة

المراجعة والدراسة الذاتية

تحتوي المصفوفات في JavaScript على العديد من الطرق المرتبطة بها، والتي تكون مفيدة للغاية لمعالجة البيانات. اقرأ عن هذه الطرق وجرب بعضها (مثل push، pop، slice وsplice) على مصفوفة من إنشائك.

الواجب

تكرار مصفوفة

إخلاء المسؤولية:
تم ترجمة هذا المستند باستخدام خدمة الترجمة بالذكاء الاصطناعي Co-op Translator. بينما نسعى لتحقيق الدقة، يرجى العلم أن الترجمات الآلية قد تحتوي على أخطاء أو معلومات غير دقيقة. يجب اعتبار المستند الأصلي بلغته الأصلية المصدر الرسمي. للحصول على معلومات حاسمة، يُوصى بالاستعانة بترجمة بشرية احترافية. نحن غير مسؤولين عن أي سوء فهم أو تفسيرات خاطئة تنشأ عن استخدام هذه الترجمة.

9.2 KiB Raw Permalink Blame History