JavaScript Switch
قاعدة Switch الشرطية في لغة جافا سكريبت
ستتعلم في هذا الدرس عبارة switch الشرطية وطريقة كتابتها Switch Syntax وما الفرق بينها وبين ال If-else Condation ومتي تستخدمهم switch وستتعلم أيضاً الكُتل البرمجية داخل switch وعلاقتها ب expression في لغة جافا سكريبت.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
الشروحات chevron_left JavaScript Switch chevron_left JavaScript
JavaScript Switch
قاعدة Switch الشرطية في لغة جافا سكريبت
</>
JavaScript Switch
قاعدة Switch الشرطية في لغة جافا سكريبت
- تتكون switch من مجموعة كٌتل Case كل كُتلة تحتوي بداخلها علي أمر برمجي محجوز لحين تحقق شرط معين.
- كل كًتلة برمجية لها قيمة هذة القيمة أما تكون نص ثابت أو رقم ثابت أو متغير.
- قاعدة switch لها expression يتم تمريرة لها في حال تطابقه مع قيمة الكُتلة case سوف يتم تنفيذ الأوامر البرمجية المحجوزة بداخل Case.
- يمكنك تنفيذ الأوامر البرمجية الموجودة في كُتلة واحدة case أو مجموعة كُتل cases في حال تطابقهم مع expression الموجود بداخل switch.
- قاعدة swich تستخدم في تنفيذ أمر برمجي بناء علي اختبار قيمة value وتطابقها مع expression الزي يتم تمريرة الي swich.
- يمكن أن تستبدل قواعد if بقاعدة switch عندما يكون لديك عدة شروط وهي تكون الأفضل لمقارنة متغير أمام مجموعة من القيم.
</>
JavaScript Switch Syntax
طريقة كتابة قاعدة Switch في لغة جافا سكريبت
تكتب switch بهذا الشكل:
- تبدأ بكلمة switch بحروف صغيرة.
- يتبع كلمة switch الأقواس parentheses ( ).
- يتم تمرير بداخل الأقواس parentheses ( ) الأقواس expression وهو قيمة التي سوف يتم مقارنتها مع الكُتله case.
- يتبع الأقواس parentheses ( ) أقواس مُجعدة curly braces.
- يتم أضافة أي عدد من الشروط بداخل الأقواس
- يبدأ الشرط بكلمة case بحروف صغيرة.
- يتبع case قيمة هذة القيمة أما تكون متغير أو نص أو اي نوع من أنواع البيانات.
- ينتهي الشرط بعبارة break بحروف صغيرة.
إذا تطابق expression مع القيمة التي تتبع case فأن محرك جافا سكريبت سوف يقوم بتنفيذ الأمر البرمجي الموجود بداخل هذه الكُتله البرمجية بدأ من case وينتهي عند عبارة break;
وفي حالة عدم تطابق expression مع القيم الموجودة بعد كل case سوف يقوم بتنفيذ الأمر البرمجي الزي يتبع عباة default.
JavaScript Switch Syntax
طريقة كتابة Switch في لغة جافا سكريبت
switch(expression) {
case x:
/* code block - code executed when the result of expression matches x */
break;
case y:
/* code block - code executed when the result of expression matches y */
break;
default:
/* code block - code executed when the result of expression not equal or matches y */
}
body background
قم بتغيير قيمة expression بداخل switch إلي أي لون متطابق مع الحلات وفي هذة الحالة سيتم تنفيذ الأوامر الموجوده بداخل case وإذا قمت بكتابة لون غير موجود في الحلات سوف يتم تنفيذ أوامر default.
switch ("blue") {
case "red":
document.write("Color Selected is : red");
break;
case "green":
document.write("Color Selected is : green");
break;
case "blue":
document.write("Color Selected is : blue");
break;
default:
document.write("This color is not found");
}
expression as variable
يمكن تمرير expression كمتغير variable.
let expression = "red";
switch (expression) {
case "red":
document.write("Color Selected is : red");
break;
case "green":
document.write("Color Selected is : green");
break;
case "blue":
document.write("Color Selected is : blue");
break;
default:
document.write("This color is not found");
}
cases as variable
يمكن تمرير أسماء case كمتغيرات variables.
switch (expression) {
case red:
document.write("Color Selected is : red");
break;
case green:
document.write("Color Selected is : green");
break;
case blue:
document.write("Color Selected is : blue");
break;
default:
document.write("This color is not found");
}
</>
JavaScript Switch multiple cases
اكثر من case داخل عبارة Switch في لغة جافا سكريبت
- يمكن تنفيذ مجموعة أوامر في حالة تطابق expression مع قيمتين عن طريق اضافة عدد 2 case لهذة الأوامر.
- يمكن أضافة اكتر من قيمة معاً لنفس الكُتلة البرمجية وهي كتابة اكثر من case لنفس الأوامر كل case تتبع case سابقة.
Switch multiple cases
سيتم تنفيذ الأوامر البرمجية الموجودة بداخل اول case في حالتين red أو gray.
switch (expression) {
case red:
case gray:
document.write("Color Selected is : red and gray");
break;
case green:
document.write("Color Selected is : green");
break;
case blue:
document.write("Color Selected is : blue");
break;
default:
document.write("This color is not found");
}
ملاحظات هامة
- في حالة وجود اكثر من case داخل switch وبنفس القيمة سوف تنفذ اول حالة فقط first case.
- في حال عدم تطابق case مع expression سوف يتم تنفيذ الأوامر البرمجية المحجوزة بداخل كُتلة default.
- في حال عدم كتابة default أو case متطابقة مع expression فأن البرنامج لا يعطي أي نتيجة وسوف يقوم بتنفيذ الأوامر التي تتبع Switch.
</>
JavaScript switch vs if-else
لماذا تتفوق switch عن if-else في جافا سكريبت
تعتمد النظرية السائدة حول استخدام if-else مقابل switch عدد الشروط كلما كان عدد الشروط أكبر يفضل أستخدام switch لأنها منظمة اكثر ومقروءة اكثر ولكن ليس مشكلة أن نستخدم if-else.
لماذا نستخدم ال swich وليس if , else ؟
- Expression هو يميز switch في كتابة قيمة فقط للتحقق بينما if و else تعتمد علي شرط كامل وليس قيمة.
- تتميز Switch بسرعة التنقل بين كل حالة case وحالة case بينما العكس في if و else ستقوم لغة البرمجة بفحص جميع الشروط اما في ال swich تذهب مباشرة علي ال case التي تساوي ال Expression.
- الوضوح وسهولة القراءة Clarity and readability تتفوق swich منظمة في طريقة كتابتها تسهل عملية القراءة والتعديل علي الحالات بخلاف ال if وال else لها اقواس كثيرة.
- في عملية الأصلاح والتعديل تتفوق قاعدة switch عن قاعدة if لأن switch سوف تعدل Expression مره واحدة بينما في if سوف نقوم بتعديل جميع الحالات علي حسب عدد if.
- في جملة if يمكن ان يكون expression من النوع (integer او character او pointer او float ) بينما في ال switch يمكن expression ان يكون اي نوع من هذى الأنواع.
unclarity and unreadability
غير واضحة وغير مقروءة لقاعدة if في لغة جافا سكريبت
if (color == "red"){
/* do something */
} else if (color == "blue"){
/* do something */
} else if (color == "brown"){
/* do something */
} else if (color == "black"){
/* do something */
} else {
/* do something */
}
Clarity and readability
الوضوح وسهولة القراءة لقاعدة switch في لغة جافا سكريبت
switch (color){
case "red":
/* do something */
break;
case "blue":
/* do something */
break;
case "brown":
/* do something */
break;
case "black":
/* do something */
break;
default:
/* do something */
}
</>
switch without break statement in JavaScript
switch بدون عبارة break في لغة جافا سكريبت
إذا نسيت كتابة عبارة break فسوف يتم تنفيذ جميع الاكواد التي تلي case يعني ذلك عدم عمل switch بشكل طبيعي يحدث خطأ برمجي عند التشغيل.
Execute All blocks
سيتم تنفيذ جميع الأوامر البرمجية داخل جميع الحالات أو الكُتل البرمجية إذا نسيت عبارة break في لغة جافا سكريبت
var course = 1;
switch (course) {
case 1:
document.write("HTML <br>");
case 2:
document.write("CSS <br>");
case 3:
document.write("JavaScript <br>");
default :
document.write("Selected Course Not found <br>");
}
</>
switch default statement in JavaScript
عبارة default مع قاعدة switch في لغة جافا سكريبت
إذا لم تتطابق expression مع أي case ففي هذة الحالة سوف يتم تنفيذ الأوامر البرمجية الموجودة داخل كُتلة default statement.
default statement
في حالة عدم تطابق expression مع أي case في switch سوف يتم تنفيذ الأوامر البرمجية التي تلي default statment في لغة جافا سكريبت
var course = 4;
switch (course) {
case 1:
document.write("HTML");
break;
case 2:
document.write("CSS");
break;
case 3:
document.write("JavaScript");
default :
document.write("Selected Course Not found");
}
</>
switch strict comparison in JavaScript
قاعدة switch تستخدم الوضع الصارم في المقارنة بين expression و case في لغة جافا سكريبت
تطبق لغة جافا سكريبت الوضع الصارم مع switch فيجب عند عملية التطابق أو المقارنة أن تساوي قيمة expression قيمة case المساواه في النوع وفي القيمة.
var course = "1";
switch (course) {
case 1:
document.write("HTML");
break;
case 2:
document.write("CSS");
break;
case 3:
document.write("JavaScript");
default :
document.write("Selected Course Not found");
}
CLOSETAG
منصة كلوز تاج التعليمية المتخصصة في تعليم البرمجة. نسعى لتقديم تجربة تعلم فريدة من خلال معسكراتنا العملية والمنظمة والمتسلسلة كما نهدف إلى تقليص الفجوة بين النظرية والتطبيق العملي؛ لذا فإننا نركز على التعليم القائم على المشاريع والتطبيقات الحقيقية. ننقل لك سنوات من الخبرة في أقل وقت ممكن تحت إشراف مهندسين عباقرة عملوا في أكبر الشركات العربية والعالمية في مجال البرمجة. مهمتنا ليست فقط تعليم البرمجة، بل نسعى أيضًا لتزويدك بمجموعة من المهارات التي تتوافق مع احتياجات سوق العمل.
