جافاسكربتالحلقات
- مفهوم الحلقات
- أنواع الحلقات
- الحلقة for
- الحلقة while
- الحلقة do while
- الحلقة for in
- الحلقة for of
مفهوم الحلقات
نستخدم الحلقات ( Loops ) بهدف جعل الكود نفسه يعاد تنفيذه عدد محدد من المرات تم التصريح عنه بشكل مباشر أو أنه يتم تحديده نسبةً لعدد العناصر أو الخصائص التي يتم التعامل معها بواسطة الحلقات.
في هذا الدرس ستتعرف على جميع أنواع الحلقات الموجودة في جافاسكربت و كيفية استخدام كل واحدة منها.
أنواع الحلقات
في جافاسكربت يوجد خمس أنواع من الحلقات:
- الحلقة for تستخدم لتنفيذ الكود عدد محدد من المرات.
- الحلقة for in تستخدم للمرور على جميع خصائص الكائن.
- الحلقة for of تستخدم للمرور على جميع العناصر الموجودة في المصفوفة.
- الحلقة while تستخدم للإستمرار بتنفيذ الكود طالما أن الشرط الذي وضعناه في بداية الحلقة لا يزال يتحقق.
- الحلقة do while تستخدم لتنفيذ الكود و من ثم الإستمرار بتنفيذه طالما أن الشرط الذي وضعناه في نهاية الحلقة لا يزال يتحقق.
يمكنك استخدام أي نوع تريده من الحلقات بغض عن النظر عن سبب استخدامك لهم طالما أنك تعرف ما تفعله و لكن معرفة ما هو النوع الأفضل لاستخدامه في كل حالة هو أمر يجعل الكود الذي تكتبه أكثر كفاءة.
الحلقة for
نستخدم الحلقة for لتنفيذ الكود عدد محدد من المرات.
فمثلاً إذا أردنا تنفيذ كود معين 5 مرات، نضعه بداخل حلقة تعيد نفسها 5 دورات.
طريقة استخدامها
فيما يلي الشكل العام لتعريف الحلقة for في جافاسكربت.
// statements
}
- initialization — هي أول خطوة تتنفذ في الحلقة و هي تتنفذ مرة واحدة فقط على عكس جميع الخطوات الموجودة في الحلقة. في هذه الخطوة نقوم بتعريف متغير (يسمى عدّاد) و يجب وضع بعده فاصلة منقوطة.
- condition — هي ثاني خطوة تتنفذ في الحلقة و هي تتنفذ في كل دورة. في هذه الخطوة نقوم بوضع شرط يحدد متى تتوقف الحلقة و نضع بعده فاصلة منقوطة. في كل دورة يتم التأكد أولاً إذا تحقق هذا الشرط أم لا، و طالما أن نتيجة الشرط تساوي true فهذا يعني أنه سيتم تكرار الكود.
- statements — هي ثالث خطوة تتنفذ في الحلقة و هي تتنفذ في كل دورة. هذه الخطوة تعني تنفيذ جميع الأوامر الموجودة في الحلقة بين أقواس البداية و النهاية. بعد أن تتنفذ جميع الأوامر سيصعد المحرر إلى الخطوة الأخيرة التي تحدث في نهاية كل دورة و هي إما زيادة قيمة العداد أو إنقاصها.
- decrement أو increment — هي الخطوة الرابعة و الأخيرة، و هي تتنفذ في كل دورة. هنا نحدد كم تزداد أو تنقص قيمة العداد في نهاية كل دورة. و هنا لا يجب وضع فاصلة منقوطة بعدها.
تذكر أنّ جميع هذه الخطوات تتكرر في كل دورة ما عدا الخطوة الأولى و السبب أننا لا نحتاج إلى تعريف عدّاد جديد في كل دورة، بل نستعمل العدّاد القديم و الذي من خلاله نعرف في أي دورة أصبحنا.
في المثال التالي قمنا بتعريف حلقة تطبع جميع الأرقام من 1 إلى 5.
مثال
النتيجة
2
3
4
5
الحلقة while
نستخدم الحلقة while لإعادة تنفيذ الكود نفسه بشكل مستمر طالما أن الشرط الذي وضعناه في الحلقة لا يزال يتحقق.
فمثلاً إذا أردنا تنفيذ كود معين 5 مرات، نضعه بداخل حلقة تعيد نفسها 5 دورات.
طريقة استخدامها
فيما يلي الشكل العام لتعريف الحلقة while في جافاسكربت.
// statements
}
- condition — هنا نضع الشرط الذي يحدد ما إن كانت الحلقة يجب تتوقف عن تكرار الكود الموجود فيها أم لا. إذاً في كل دورة يتم التأكد أولاً إذا تحقق هذا الشرط أم لا. طالما أنه يتحقق، أي نتيجة الشرط تساوي true فهذا يعني أنه سيتم تكرار الكود.
- statements — هنا نضع جميع الأوامر التي نريدها أن تتنفذ في كل دورة. بعد أن تتنفذ جميع الأوامر سيصعد المحرر إلى الشرط الموضوع في الحلقة ليرى ما إن كان يجب إعادة تنفيذ هذه الأوامر أم لا.
في المثال التالي قمنا بتعريف حلقة تطبع جميع الأرقام من 1 إلى 5.
مثال
النتيجة
2
3
4
5
الحلقة do while
نستخدم الحلقة do while لتنفيذ الكود و من ثم الإستمرار بتنفيذه طالما أن الشرط الذي وضعناه في نهاية الحلقة لا يزال يتحقق.
الفرق الوحيد بينها و بين الحلقة while هو أنها تنفذ الأوامر الموضوعة فيها مرة واحدة على الأقل لأنها تتأكد من الشرط بعد تنفيذ الأوامر و ليس قبلهم.
طريقة استخدامها
فيما يلي الشكل العام لتعريف الحلقة do while في جافاسكربت.
// statements
}
while (condition)
- statements — هنا نضع جميع الأوامر التي نريدها أن تتنفذ في كل دورة. بعد أن تتنفذ جميع الأوامر سيتم التأكد من الشرط الموضوع في الحلقة لمعرفة ما إن كان يجب إعادة تنفيذ هذه الأوامر أم لا.
- condition — هنا نضع الشرط الذي يحدد ما إن كانت الحلقة يجب تتوقف عن تكرار الكود الموجود فيها أم لا. طالما أنه يتحقق، أي نتيجة الشرط تساوي true فهذا يعني أنه سيتم تكرار الكود.
في المثال التالي قمنا بتعريف حلقة تطبع جميع الأرقام من 1 إلى 5.
مثال
النتيجة
2
3
4
5
الحلقة for in
نستخدم الحلقة for in للمرور على جميع الخصائص و القيم الموجودة في الكائن أو للمرور على جميع العناصر الموجودة في المصفوفة بدون الحاجة لتعريف عدّاد و تحديد أين يبدأ و أين ينتهي.
هذه الحلقة لا تضمن أن يتم إرجاع قيم العناصر بنفس الترتيب الموضوعين فيه.
إستخدم الحلقة for العادية إذا كان الترتيب الذي سيتم فيه عرض العناصر مهم.
طريقة استخدامها
فيما يلي الشكل العام لتعريف الحلقة for in في جافاسكربت.
// statements
}
- object — الكائن الذي سيتم المرور على جميع خصائصه أو المصفوفة التي سيتم المرور على جميع عناصرها.
- variable — هو متغير عادي، في كل دورة من دورات الحلقة يتم وضع قيمة عنصر من عناصر الكائن أو المصفوفة فيه بشكل تلقائي.
- statements — هي الأوامر التي سيتم تنفيذها في كل دورة من دورات الحلقات.
في المثال التالي قمنا بتعريف كائن إسمه person وضعنا فيها ثلاث قيم.
بعدها قمنا باستخدام حلقة for in للمرور على جميع أسماء و قيم خصائصه و من ثم طباعتها.
المثال الأول
النتيجة
age = 25
isWorking = true
في المثال التالي قمنا بتعريف مصفوفة إسمها languages وضعنا فيها ثلاث قيم.
بعدها قمنا باستخدام حلقة for in للمرور على جميع قيم عناصرها و من ثم طباعتها.
المثال الثاني
النتيجة
English
French
الحلقة for of
نستخدم الحلقة for of للمرور على جميع عناصر الكائن المتسلسلة ( Iterable Object ).
يمكن استخدام هذه الحلقة مع الكائنات التي هي عبارة عن سلاسل نصية ( Strings )، مصفوفات عادية ( Arrays )، خرائط ( Maps )، سلسلة عناصر موجودة في الصفحة ( NodeLists ).
طريقة استخدامها
فيما يلي الشكل العام لتعريف الحلقة for of في جافاسكربت.
// statements
}
- iterable — الكائن الذي سيتم المرور على جميع عناصره.
- variable — هو متغير عادي، في كل دورة من دورات الحلقة يتم وضع قيمة عنصر من عناصر الكائن فيه بشكل تلقائي.
- statements — هي الأوامر التي سيتم تنفيذها في كل دورة من دورات الحلقات.
لا يمكن عرض أسماء و قيم الخصائص الموجودة في الكائنات بواسطتها فهي ليس كالحلقة for in رغم الشبه الكبير بينهما.
في المثال التالي قمنا بتعريف متغير وضعنا فيه نص (أي سلسلة من الأحرف).
بعدها قمنا باستخدام حلقة for of للمرور على جميع أحرف النص و من ثم طباعتها الواحد تلو الآخر.
المثال الأول
النتيجة
a
r
m
a
s
h
.
c
o
m
في المثال التالي قمنا بتعريف مصفوفة إسمها languages وضعنا فيها ثلاث قيم.
بعدها قمنا باستخدام حلقة for of للمرور على جميع قيم عناصرها و من ثم طباعتها.
المثال الثاني
النتيجة
English
French
