‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫مقرر برمجة الويب ( ‪) 1‬‬

‫الفصل الرابع‪ :‬أساسيات لغة ‪JavaScript‬‬

‫‪-0-‬‬
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫رقم الصفحة‬ ‫العنوان‬

‫‪3‬‬ ‫‪ .1‬أساسيات ‪JavaScript‬‬
‫‪17‬‬ ‫‪ .2‬تعليمات التحكم‬
‫‪23‬‬ ‫‪ .3‬المصفوفات ‪Arrays‬‬
‫‪28‬‬ ‫‪ .4‬الوظائف ‪Functions‬‬
‫‪31‬‬ ‫‪ .5‬مطابقة النماذج‬

‫‪-1-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫الكلمات المفتاحية‬
‫‪،‬‬ ‫المتغيرات‪ ،‬أنم ا اااي التي ا ااان ا ااات‪ ،‬الت‪ ،‬ا ااابير إلال‪،‬م‪،‬ي ا ااات‪ ،‬اكرا ا اااظ إلاكا ار ‪ ،‬ال ا ا ا ا ا ا ااري‪ ،‬الت رار‪ ،‬الو ا ااا‬
‫المصفوفات‪ ،‬مطابقة النماذ ‪.‬‬

‫الملخص‬
‫نست‪،‬رض في هذا الفصل أساسيات لغة الترمجة ‪.JavaScript‬‬

‫األهداف التعليمية‬
‫يت‪،‬رف الطالب في هذا الفصل ع‪،‬ى‬
‫• المتغيرات‬
‫• األنماي‬
‫• ال‪،‬م‪،‬يات‬
‫• الت‪،‬ابير‬
‫• اكرااظ إلاك هار‬
‫• ت‪،،‬يمات التحكم‬
‫• المصفوفات‬
‫• الو ا‬
‫• مطابقة النماذ‬

‫المخطط‬
‫يضم فصل أساسيات لغة ‪ 5 JavaScript‬إلحدات (‪ )Learning Objects‬هي‪:‬‬
‫• أساسيات ‪JavaScript‬‬
‫• ت‪،،‬يمات التحكم‬
‫• المصفوفات‬
‫‪Functions‬‬ ‫• الو ا‬
‫• مطابقة النماذ‬

‫‪-2-‬‬
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫أس اسي ات ‪Jav aS cript‬‬

‫األهداف التعليمية‪:‬‬
‫• أساسيات الترمجة غرضية التوجه إل‪JavaScript‬‬
‫• الخصا ص ال‪،‬امة ل‪ ،‬كل‬
‫• الت‪،،‬يمات‬
‫• األنماي إلال‪،‬م‪،‬يات إلالت‪،‬ابير‬
‫• التصريح عن المتغيرات‬
‫• ال‪،‬م‪،‬يات الرقمية‬
‫• تحويل األنماي الضمني‬
‫• تحويل األنماي الصريح‬
‫• الغرض ‪Date‬‬
‫• اكرااظ إلاك هار‬
‫• الغرض ‪window‬‬

‫‪-3-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫مقدمة‬
‫هرت ال‪،‬غااة الخطااا يااة ‪ JavaScript‬عااا ‪ 1996‬نتيجااة ت‪،‬اااإلم مبمر بين ال ا ا ا ا ا ا اار تين ‪Netscape‬‬
‫إل‪ .Sun‬إلأصبحت اليو معيار عالمي م‪،‬تمد ‪.ISO-16262‬‬
‫لغة ‪ JavaScript‬من ثالثة أجزاء ر يسية‪:‬‬ ‫تتأل‬
‫• ق‪،‬ب ال‪،‬غة ‪ Core‬إلتحوي الت‪،،‬يمات األساسية ل‪،‬غة‪.‬‬
‫• جهة الزبوم ‪ Client Side‬إلتحوي مجموعة األغراض التي تدعم التحكم بالمسا ا ا ا اات‪،‬رض إلالتفاعل‬
‫مع المستخد (إلهو الجزء األكبر استخداماً من قتل مطوري الويب)‪.‬‬
‫• جهاة المخاد ‪ Server Side‬إلتحوي مجموعاة األغراض التي ميمكن أم تت‪،‬اامال مع مخاد الوياب‪،‬‬
‫ك‪،‬م‪،‬يات الوصوظ إلى قواعد التيانات مبالً‪.‬‬

‫البرمجة غرضية التوجه و‪JavaScript‬‬

‫ال تدعم ‪ JavaScript‬الترمجة غرضية التوجه‪ .‬أي أنها ال تحوي صفوف ‪ .classes‬بل ت‪،‬مل أغراضها‬
‫‪ objects‬أغراض إل نموذ لألغراض في آم إلاحد ‪ .models of objects‬ما ال تدعم ‪JavaScript‬‬
‫الوراثة ‪ Inheritance‬إلت‪،‬درية األشكاظ ‪.Polymorphism‬‬
‫يكوم لألغراض في ‪ JavaScript‬مجموعة من الخص ا ا ا ااا ص التي ميمكن أم ت وم إما ااص ا ا ا ااية م‪،‬طيات‬
‫‪ property‬أإل ريقة ‪.method‬‬

‫‪-4-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫الخصائص العامة للشكل‬

‫‪:XHTML‬‬ ‫• ميمكن تضمين الخططات مباشرة في م‪،‬‬
‫>"‪<script type="text/javaScript‬‬
‫– ‪-- JavaScript script‬‬
‫>‪</script‬‬

‫نصي مستقل إلتضمينها باستخدا ‪:‬‬ ‫• أإل (إلهو األفضل) إلضع الخططات في م‪،‬‬
‫"‪<script type="text/javaScript‬‬
‫>"‪src="myScript.js‬‬
‫>‪</script‬‬

‫• ميمكن إلضاع ت‪،،‬يمات ال‪،‬غة ضامن ت‪،،‬يقات ااصاة من ال اكل التالي إلذلك بهدف إافاء الت‪،،‬يمات‬
‫عن المتصفحات التي ال تدعم ‪:JavaScript‬‬
‫‪<!--‬‬
‫– ‪-- JavaScript script‬‬
‫>‪//--‬‬

‫عرفات‬
‫الم ّ‬
‫ُ‬
‫• يجب أم تتدأ الم‪،‬رفات ‪ Identifiers‬في ‪ JavaScript‬بحرف أإل تحت السا ا ا ااطر (ا) أإل إشا ا ا ااارة‬
‫الدإلالر ‪ .$‬ب‪،‬دها ميمكن أم يحوي الم‪،‬رف ع‪،‬ى حرف أإل رقم أإل تحت السطر أإل رإلالر‪.‬‬
‫• ال يوجد حد لطوظ الم‪،‬رف‪.‬‬
‫• ت وم ‪ javaScript‬حساسة لحالة األحرف ‪.case sensitive‬‬

‫الكلمات المفتاحية‬
‫تحوي ال‪،‬غة ع‪،‬ى مجموعة من ال ‪،‬مات المفتاحية‪:‬‬
‫‪break, case, catch, continue, default, delete, do, else, finally, for, function, if, in,‬‬
‫‪instanceof, new, return, switch, this, throw, try, typeof, var, void, while, with.‬‬

‫‪-5-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫التعليقات‬
‫ميمكن إلضع الت‪،،‬يقات ع‪،‬ى سطر باستخدا ‪ //‬أإل ع‪،‬ى أكبر من سطر باستخدا ‪./* . . . . */‬‬

‫التعليمات‬
‫ميس ا ا ااتحس ا ا اان إلض ا ا ااع ل ت‪،،‬يمة ع‪،‬ى س ا ا ااطر إل;نها ها بوض ا ا ااع فاص ا ا اا‪،‬ة منقو ة ( )‪ .‬إذ أم مفس ا ا اار ال‪،‬غة‬
‫‪ interpreter‬يض ا ااع فاص ا اا‪،‬ة منقو ة عند ل نهاية س ا ااطر لما ي‪،‬تترم ت‪،،‬يمة‪ .‬مما قد يقور لخطأ ما ميتين‬
‫المباظ التالي‪:‬‬
‫;‪return x‬‬
‫;‪x‬‬
‫(حيث سيقو المفسر بوضع فاص‪،‬ة منقو ة ب‪،‬د ‪ ،return‬مما سيج‪،‬ل إلضع ‪ x‬غير قانوني)‪.‬‬

‫األنماط والعمليات والتعابير‬

‫األنماط األساسية‬
‫يكوم ل‪،‬قيم أحد األنماي األساسية التالية‪:‬‬
‫‪Number, String, Boolean, Undefined, Null.‬‬

‫األرقام والسالسل النصية‬

‫تمخزم األرقا باستخدا الفاص‪،‬ة ال‪،‬ا مة مع رقة مضاعفة‪ .‬تمتين األمب‪،‬ة التالية أشكاظ صحيحة لألرقا ‪:‬‬
‫‪72, 7.2, .72, 72., 7E2, 7e2, .7e2, 7.e2, 7.2E-2‬‬
‫تمحاي الساالسال النصاية إما بإشاارة تنصايص إلاحدة ( ) أإل بإشاارتي تنصايص(‪ .).‬ميمكن أم تحوي الساالسال‬
‫النصية ع‪،‬ى محارف ااصة مبل ‪ \n‬إل‪.\t‬‬
‫ميمكن استخدا المحرف (\) كلغاء‪(') :‬‬
‫'‪'You\'re the most freckly person I\'ve ever met‬‬
‫كما يجب إلضع (\) قتل ل (\) إذا ام من محارف الس‪،‬س‪،‬ة‪:‬‬
‫"‪"d:\\bookfiles‬‬
‫ال يوجد فرق بين الس‪،‬س‪،‬ة المحا ة با ا ا ا ( ) إلالمحا ة ب ا ا ا ا (‪ .).‬ما ميمكن الت‪،‬تير عن الس‪،‬س‪،‬ة الفارغة ب ا ا ا ا‬
‫أإل ‪...‬‬

‫‪-6-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫األنماط األساسية األخرى‬

‫• يكوم في النمط ‪ Boolean‬القيمتين ‪ true‬إل‪ false‬فقط‪ .‬تنتج هذم القيم عارةً عن حس ا اااي ت‪،‬تير‬
‫منطقي‪.‬‬
‫• يكوم في النمط ‪ Null‬قيمة إلحيدة هي ال ‪،‬مة المفتاحية ‪ .null‬إلتم‪،‬امل ا ا ا ا ا ا ‪ 0‬عند م‪،‬ام‪،‬تها رقم‪،‬‬
‫إل ا‪ false‬عند م‪،‬ام‪،‬تها متغير منطقي‪.‬‬
‫• يكوم في النمط ‪ Undefined‬قيمة إلحيدة هي ‪ .undefined‬إلتم‪،‬امل ا ا ا ا ا ا ا ا ا ‪ NaN‬عند م‪،‬ام‪،‬تها‬
‫كرقم‪ ،‬إل ا ‪ false‬عند م‪،‬ام‪،‬تها متحوظ منطقي‪.‬‬
‫• يكوم متغير ‪ undefined‬عندما يكوم م‪،‬رفاً إللم تمسند له قيمة‪.‬‬
‫فمبالً إذا تتنا الت‪،،‬يمات التالية‪:‬‬
‫>"‪<script type="text/javaScript‬‬
‫;‪var a‬‬
‫;‪var b = 10‬‬
‫;‪b = b + a‬‬
‫;)">‪document.write("a: ", a, "<br /‬‬
‫;)">‪document.write("b: ", b, "<br /‬‬
‫>‪</script‬‬

‫ت وم النتيجة‪:‬‬
‫‪a: undefined‬‬
‫‪b: NaN‬‬

‫التصريح عن المتغيرات‬
‫تتميز ‪ JavaScript‬بأنها تقو بتحديد نمط المتغير ب ااكل ريناميكي حس ااب القيمة المس ااندم له‪ .‬ما ميمكن‬
‫إسنار قيمة من أي نمط لنفس المتغير‪.‬‬
‫ميمكن التصريح عن متغير ب كل ضمني إلذلك بإسنار قيمة له‪a= 10; :‬‬
‫أإل ب كل صريح باستخدا ال ‪،‬مة المفتاحية ‪:var‬‬
‫‪var a,‬‬
‫‪sum = 0,‬‬
‫"‪today = "Monday,‬‬
‫;‪flag = false‬‬

‫‪-7-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫العمليات الرقمية‬
‫توفر ‪ JavaScript‬ال‪،‬م‪،‬يات الرقمية‪:‬‬
‫‪++, --, +, -, *, /, %‬‬
‫‪ .-‬إلفي حاظ تسا ا ا اااإلي‬ ‫أع‪،‬ى من‬ ‫تراعي ‪ JavaScript‬أفضا ا ا اا‪،‬ية ال‪،‬م‪،‬يات حيث ت وم أفضا ا ا اا‪،‬ية * ‪/‬‬
‫يتم تطتيق ال‪،‬م‪،‬يات من اليسار ل‪،‬يمين‪.‬‬
‫األفض‪،‬يات في ت‪،‬تير ّ‬
‫مثال‪:‬‬
‫ميتين المباظ التالي يفية تطتيق األفض‪،‬يات إلالتجميع‪:‬‬
‫>"‪<script type="text/javaScript‬‬
‫‪var a = 2,‬‬
‫‪b = 4,‬‬
‫‪c,‬‬
‫;‪d‬‬
‫;‪c = 3 + a * b‬‬
‫)‪// * is first, so c is now 11 (not 24‬‬
‫;‪d = b / a / 2‬‬
‫)‪// / association left, so d is now 1 (not 4‬‬
‫;)">‪document.write("c: ", c, "<br /‬‬
‫;)">‪document.write("d: ", d, "<br /‬‬
‫>‪</script‬‬

‫ميمكن استخدا األقواس لتحديد األفض‪،‬ية المط‪،‬وبة‪.‬‬

‫الغرض ‪Math‬‬
‫يوفر الغرض ‪ Math‬مجموعة من الطرق ع‪،‬ى األرقا مبل‪:‬‬
‫‪floor, round, max, min, cos, sin. . . ,‬‬
‫مثالً‪:‬‬
‫(‪Math.sin(x‬‬

‫‪-8-‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫الغرض ‪Number‬‬
‫• يوفر الغرض ‪ Number‬مجموعة من الخصا ص ذات القيم البابتة الرقمية‪:‬‬
‫‪MAX_VALUE, MIN_VALUE, NaN, POSITIVE_INFINITY, NEGATIVE_INFINITY, PI.‬‬
‫(مبالً‪ ،‬تم‪،‬طي ‪ Number.Min_VALUE‬أصغر قيمة ممكنة)‪.‬‬
‫• تم‪،‬يد عم‪،‬ية جترية مع فيضام ‪ overflow‬القيمة ‪.NaN‬‬
‫• تمستخد الدالة )(‪ isNaN‬الاتبار أم متغير له القيمة ‪.NaN‬‬
‫• ل‪،‬غرض ‪ Number‬الطريقة )(‪ toString‬كرجاع الرقم س‪،‬س‪،‬ة نصية‪:‬‬
‫‪Var‬‬ ‫‪price= 477,‬‬
‫;‪Str_price‬‬
‫‪. . .‬‬
‫;)(‪Str_price = price.toString‬‬

‫جمع السالسل النصية‬

‫لجمع السالسل النصية‪:‬‬ ‫تمستخد إشارة الجمع‬
‫>"‪<script type="text/javaScript‬‬
‫;"‪var x = "Hello‬‬
‫;"‪x = x + " World‬‬
‫‪// x now is Hello World‬‬
‫;)">‪document.write( x, "<br /‬‬
‫>‪</script‬‬

‫تحويل األنماط الضمني‬

‫تقو ‪ JavaScript‬بمجموعة من التحويالت الضمنية بين األنماي إلفق ما ي‪،‬ي‪:‬‬
‫يتم تحويل الرقم إلى س‪،‬س‪،‬ة نصية‪.‬‬
‫• إذا انت ال‪،‬م‪،‬ية عم‪،‬ية جمع بين رقم إلس‪،‬س‪،‬ة نصية ّ‬
‫يتم تحويل الس‪،‬س‪،‬ة النصية إلى رقم‪.‬‬
‫• إذا انت ال‪،‬م‪،‬ية عم‪،‬ية حسابية (غير الجمع) ّ‬
‫• إذا ف ‪،‬ت عم‪،‬ية تحويل الس‪،‬س‪،‬ة النصية إلى رقم تم‪،‬ار القيمة ‪.NaN‬‬

‫‪-9-‬‬
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫مثال‪:‬‬
‫حاالت التحويل الضمني‪:‬‬ ‫ميتين المباظ التالي مخت‪،‬‬
‫>"‪<script type="text/javaScript‬‬
‫;‪var x, y, z, t‬‬
‫;‪x = "August " + 2007‬‬
‫‪// x now is August 2007‬‬
‫;)">‪document.write("x now is ", x, "<br /‬‬
‫;"‪y = 2007 + " August‬‬
‫‪// y now is 2007 August‬‬
‫;)">‪document.write("y now is ", y, "<br /‬‬
‫;"‪z = 7 * "3‬‬
‫‪// z now is 21‬‬
‫;)">‪document.write("z now is ", z, "<br /‬‬
‫;‪t = "lo" * 3‬‬
‫‪// t now is NaN‬‬
‫;)">‪document.write("t now is ", t, "<br /‬‬
‫>‪</script‬‬

‫تحويل األنماط الصريح‬

‫ميمكن ‪،‬ب التحويل بين األنماي ب كل صريح ما ي‪،‬ي‪:‬‬
‫• ميستخد الباني ‪ String‬ل‪،‬حصوظ ع‪،‬ى س‪،‬س‪،‬ة نصية‪.‬‬
‫• ميستخد الباني ‪ Number‬ل‪،‬حصوظ ع‪،‬ى رقم‪.‬‬
‫• تمستخد الطريقة )(‪ toString‬ع‪،‬ى رقم لتحوي‪،‬ه إلى س‪،‬س‪،‬ة نصية‪.‬‬
‫• يٌمكن استخدا الدالة ‪ parseInt‬لتحويل س‪،‬س‪،‬ة نصية إلى رقم صحيح‪.‬‬
‫• ميمكن استخدا الدالة ‪ parseFloat‬لتحويل س‪،‬س‪،‬ة نصية إلى رقم ع ري‪.‬‬

‫‪- 10 -‬‬
JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

:‫مثال‬
:‫حاالت التحويل الصريح‬ ،‫ميتين المباظ التالي مخت‬
<script type="text/javaScript">
var str1 = String(33.33);
// str1 now is "33.33"
document.write("str1 now is ", str1, "<br />");
var num1 = 6.6;
var str2 = num1.toString();
//str2 now is "6.6"
document.write("str2 now is ", str2, "<br />");
var num2 = Number(str1);
// num2 now is 33.33
document.write("num2 now is ", num2, "<br />");
var num3 = str1 - 0;
// num3 now is 33.33
document.write("num3 now is ", num3, "<br />");
var num4 = parseInt(str1);
document.write("num4 now is ", num4, "<br />");
// num4 now is 33
var num5 = parseFloat(str1);
// num5 now is 33.33
document.write("num5 now is ", num5, "<br />");
</script>

String ‫خصائص وطرق السالسل‬

.‫ة نصية‬،‫س‬،‫طي عدر األحرف في س‬،‫ إلت‬length ‫ ااصية إلاحدة هي‬String ‫غرض‬،‫• ل‬
:‫ مجموعة من الطرق أهمها‬String ‫غرض‬،‫• ل‬
charAt(number) ▪
indexOf(One-character string) ▪
substring(number1, number2) ▪
toLowerCase() ▪
toUpperCase() ▪

- 11 -
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

:‫ة‬،‫كما تمتين األمب‬

var str="George";
str.length is 6
str.charAt(2) is 'o'
str.indexOf('r') is 3
str.substring(2, 4) is 'or'
str.toLowerCase() is 'george'

typeof ‫الطريقة‬
:‫ة التالية‬،‫ نمط متغير ما تمتين األمب‬typeof ‫يد‬،‫تم‬
typeof("George") is string
typeof(33) is number
typeof(true) is Boolean
var a; typeof(a) is undefined
typeof(b) is undefined (b is a not defined var(

‫اإلسناد‬
:‫تمستخد إشارة المساإلاة لإلسنار‬
a = a + 7;
a += 7;

Date ‫الغرض‬
:‫ميمكن التصريح عن متغير تاريخ يأاذ التاريخ إلالوقت الحالي‬
var today = new Date)(;
:‫ مجموعة من الطرق‬Date ‫يوفر الغرض‬
toLocaleString, getDate, getMonth, getDay, getFullYear, getTime, getHours,
getMinutes, getSeconds, getMilliseonds.

- 12 -
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫اإلدخال واإلظهار‬
‫يقو مفس ا اار ‪ JavaScript‬بتفيذ الت‪،،‬يمات حيبما يجدها ض ا اامن المس ا ااتند ‪ .XHTML‬إلبالتالي فإم ش ا اااش ا ااة‬
‫اك هار الطتيعية لا ‪ JavaScript‬هي نفسها شاشة إ هار مخرجات ‪.XHTML‬‬
‫تمستخد الطريقة ‪ write‬ل‪،‬غرض ‪ document‬ب كل أساسي لخ‪،‬ق اطا ة ار ‪ .‬ما ميتين المباظ التالي‪:‬‬
‫;‪var a = 25‬‬
‫;)">‪document.write("The result is : <b> ", a, "</b> <br /‬‬

‫حيث يكوم الخر ‪:‬‬

‫‪The result is : 25‬‬
‫الحظ أم م‪،‬امل الطريقة ‪ write‬ميمكن أم يحوي أي مؤثر ‪.XHTML‬‬

‫الغرض ‪window‬‬
‫يوفر الغرض ‪ window‬ثالثة رق كن اء صناريق حوار بهدف التفاعل مع المستخد ‪.‬‬
‫• الطريقة ‪ :alert‬تقو الطريقة ‪ alert‬بفتح نافذة حوارية إل; هار محتوى م‪،‬ام‪،‬ها فيها‪.‬‬
‫;‪var a = 25‬‬
‫;)"‪alert("The result is: " + a + "\n‬‬

‫‪- 13 -‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫• الطريقااة ‪ :confirm‬تقو الطريقااة ‪ confirm‬بفتح نااافااذة حواريااة مع ري ‪ OK‬إل‪ .Cancel‬ت وم‬

‫القيمة المرج‪،‬ة ‪ true‬في حاظ نقر المسا ا ا ا ا ا ااتخد ع‪،‬ى الزر ‪ ،OK‬إل‪ false‬في حاظ نقرم ع‪،‬ى الزر‬
‫‪.Cancel‬‬
‫= ‪var question‬‬
‫;)"?‪confirm("Do you want to continue this download‬‬

‫• الطريقة ‪ :prompt‬تقو الطريقة ‪ prompt‬بإ هار نافذة حوارية تحوي ص ا ااندإلق نص ل‪ ،‬تابة فيه‪.‬‬
‫إلت وم القيمة المرج‪،‬ة هي محتوى هذا النص إذا نقر المسا ا ا ا ااتخد ع‪،‬ى الزر ‪ ،OK‬إل‪ null‬إذا نقر‬
‫المستخد ع‪،‬ى الزر ‪.Cancel‬‬
‫;)"" ‪a = prompt("What is your name ?",‬‬

‫‪- 14 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

:‫مثال‬
: ‫ب حدإلرها من المستخد‬، ‫د‬،‫ارلة من الدرجة البانية ب‬،‫يقو المباظ التالي بحل م‬
<!DOCTYPE html >

<!-- roots.html
Compute the real roots of a given quadratic
equation. If the roots are imaginary, this script
displays NaN, because that is what results from
taking the square root of a negative number
-->
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title> Real roots of a quadratic equation </title>
</head>
<body>
<script type = "text/javascript">
<!--
var question=true;
var a, b, c, root_part, denom, root1, root2;
while (question)
{
// Get the coefficients of the equation from the user
a = prompt("What is the value of 'a'? \n", "1");
b = prompt("What is the value of 'b'? \n", "");
c = prompt("What is the value of 'c'? \n", "");
// Compute the square root and denominator of the result
root_part = Math.sqrt(b * b - 4.0 * a * c);
denom = 2.0 * a;
// Compute and display the two roots
root1 = (-b + root_part) / denom;
root2 = (-b - root_part) / denom;
if (isNaN(root1))
{
alert("No real roots !");
question=confirm("Try another equation?");
}
else
{
document.write("The first root is: ", root1, "<br />");

- 15 -
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

document.write("The second root is: ", root2, "<br />");

question=false;
}
}
// -->
</script>
</body>
</html>

- 16 -
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫تعليم ات التحكم‬

‫األهداف التعليمية‬
‫• الت‪،‬رف ع‪،‬ى ت‪،،‬يمات التحكم‬

‫‪- 17 -‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫تعليمات التحكم‬
‫تم اابه ت‪،،‬يمات ‪ JavaScript‬ت‪،،‬يمات لغة ‪ C++‬إل‪ .Java‬ت وم الت‪،،‬يمات المر بة تسا‪،‬سال من الت‪،،‬يمات‬
‫المحا ة با { }‪.‬‬

‫التعابير المنطقية‬
‫ت وم نتيجة تقويم ت‪،‬تير منطقي القيمة ‪ true‬أإل القيمة ‪ .false‬يوجد ثالثة أنواع من الت‪،‬ابير المنطقية‪:‬‬
‫• القيم األساسية ‪Primitive values‬‬
‫▪ إذا انت القيمة رقمية فهي تم‪،‬تتر ‪ true‬مالم ت ن مساإلية ل‪،‬صفر‬
‫▪ إذا انت القيمة نصية تم‪،‬تتر ‪ true‬مالم ت ن فارغة ‪ ..‬أإل ‪.0.‬‬
‫• الت‪،‬ابير ال‪،‬ال قية ‪Relational Expressions‬‬
‫▪ تستخد ال‪،‬القات الم‪،‬رإلفة == =! < > => =<‬

‫▪ في حاظ وم الم‪،‬امالت من أنماي مخت‪،‬فة ّ‬

‫يتم إجراء التحويل الضمني‬
‫• الت‪،‬ابير المر بة ‪Compound Expressions‬‬
‫▪ ميمكن إن اء ت‪،‬ابير مر بة من الت‪،‬ابير السابقة باستخدا ال‪،‬م‪،‬يات المنطقية‪:‬‬
‫)‪&&(And), ||(Or), !(Not‬‬

‫تعليمات االختيار ‪Selection Statements‬‬

‫التعليمة الشرطية ‪if‬‬
‫يكوم ل‪،‬ت‪،،‬يمة ال ر ية ‪ if‬في ‪ JavaScript‬نفس ال كل في ‪ .C‬ما ميتين المباظ التالي‪:‬‬
‫)‪if (a > b‬‬
‫;)">‪document.write("a is greater than b <br /‬‬
‫{ ‪else‬‬
‫;‪a = b‬‬
‫‪document.write(" a was not greater than b <br />",‬‬
‫};)" >‪"Now they are equal <br /‬‬

‫‪- 18 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

switch ‫التعليمة‬
:‫ ال كل‬switch ‫يمة‬،،‫تأاذ الت‬
switch (expression) {
case value_1:
// value_1 statements
case value_2:
// value_2 statements
…
[default:
// default statements]
}

:‫مثال‬
‫وي‬،‫اب من المسا ا ا ا ا ا ااتخاد إراااظ عرض اك اار المط‬،‫يتم الط‬
ّ ‫ حياث‬switch ‫ميتين المبااظ التاالي اسا ا ا ا ا ا ااتخادا‬
:‫لجدإلظ‬
<html xmlns = "http://www.w3.org/1999/xhtml">
<head> <title> A switch statement </title>
</head>
<body>
<script type = "text/javascript">
<!--
var bordersize;
bordersize = prompt("Select a table border size \n" +
"0 , 1, 2, 4, 8 \n","1" );
switch (bordersize) {
case "0": document.write("<table>");
break;
case "1": document.write("<table border = '1'>");
break;
case "4": document.write("<table border = '4'>");
break;
case "8": document.write("<table border = '8'>");
break;
default: document.write("Error - invalid choice: ",
bordersize, "<br />");
}

- 19 -
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

document.write("<caption> 2003 NFL Divisional",

" Winners </caption>");
document.write("<tr>",
"<th />",
"<th> American Conference </th>",
"<th> National Conference </th>",
"</tr>",
"<tr>",
"<th> East </th>",
"<td> New England Patriots </td>",
"<td> Philadelphia Eagles </td>",
"</tr>",
"<tr>",
"<th> North </th>",
"<td> Baltimore Ravens </td>",
"<td> Green Bay Packers </td>",
"</tr>",
"<tr>",
"<th> West </th>",
"<td> Kansas City Chiefs </td>",
"<td> St. Louis Rams </td>",
"</tr>",
"<tr>",
"<th> South </th>",
"<td> Indianapolis Colts </td>",
"<td> Carolina Panthers </td>",
"</tr>",
"</table>");
// -->
</script>
</body>
</html>

- 20 -
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫يتدأ التنفيذ بالط‪،‬ب من المستخد إرااظ عرض الحدإلر المط‪،‬وي‪:‬‬

‫يتم إ هار الجدإلظ بال‪،‬رض المحدر‪:‬‬

‫إلمن ثم ّ‬

‫تعليمات التكرار‬
‫توفر لغة ‪ JavaScript‬الت‪،،‬يمتين األساسيتين ل‪،‬ت رار ‪ while‬إل‪ .for‬يكوم ل‪،‬ت‪،،‬يمة ‪ while‬ال كل‪:‬‬
‫)‪while ( control expression‬‬
‫{‬
‫‪Statements‬‬
‫}‬

‫أإل ال كل‪:‬‬
‫‪do‬‬
‫{‬
‫‪statements‬‬
‫}‬
‫)‪while ( control expression‬‬

‫‪- 21 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

:‫ ال كل‬for ‫يمة‬،،‫ت‬،‫يكوم ل‬
for (initial expression; control expression; increment expression)
{
statements
}

- 22 -
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫الم صفوف ات ‪Array s‬‬

‫األهداف التعليمية‬
‫• المصفوفات‬

‫‪- 23 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

Arrays ‫المصفوفات‬
‫ أإل بإسا ا اانار عناصا ا اار المصا ا اافوفة‬new ‫يمة‬،،‫ إما باسا ا ااتخدا الت‬JavaScript ‫ريف المصا ا اافوفات في‬،‫يتم ت‬
ّ
:‫ة التالية‬،‫ ما تمتين األمب‬.‫مباشرة‬

var myList1 = new Array(24);

var myList2 = ["bread", 99, true];

.1 ‫ هو فهرس آار عنصر فيها ا د‬length ‫• يكوم وظ المصفوفة‬

myList.length = 150; :length ‫• ميمكن تغيير وظ المصفوفة بإسنار قيمة إلى الخاصية‬

:‫مثال‬
‫م األس ااماء مرتبة‬،‫ نص اارل في التداية عن مص اافوفة تحوي ب‬.‫يوض ااح المباظ التالي اس ااتخدا المص اافوفات‬
‫ى الترتيب‬،‫ب من المس ا ااتخد إرااظ اس ا اام جديد إلنقو بإرراجه في المص ا اافوفة إلبحيث نحافظ ع‬،‫ نط‬.ً‫أبجديا‬
.‫األبجدي‬
<!DOCTYPE html >
<html xmlns = "http://www.w3.org/1999/xhtml">
<head> <title> Name list </title>
</head>
<body>
<script type = "text/javascript">
<!--
// The original list of names
var name_list= new Array("Al", "Betty", "Kasper",
"Michael", "Roberto", "Zimbo");
var new_name, index, last;
// Loop to get a new name and insert it
while (new_name = prompt("Please type a new name", "")) {
// Loop to find the place for the new name
last = name_list.length - 1;
while (last >= 0 && name_list[last] > new_name) {
name_list[last + 1] = name_list[last];
last--;
}
// Insert the new name into its spot in the array
name_list[last + 1] = new_name;

- 24 -
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

// Display the new array

document.write("<p><b>The new name list is:</b> ",
"<br />");
for (index = 0; index < name_list.length; index++)
document.write(name_list[index], "<br />");
document.write("</p>");
} //** end of the outer while loop
// -->
</script>
</body>
</html>

: ‫ب اسم جديد من المستخد‬،‫يتدأ الترنامج بط‬

Mozart
:‫د إضافة االسم الجديد في مكانه الصحيح‬،‫ثم يظهر المصفوفة الجديدة ب‬

- 25 -
JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

:‫امل مع المصفوفات‬،‫ت‬،‫يوجد مجموعة من الطرق ل‬

‫ لوصل مصفوفة مع أارى‬concat •
‫ها بفاصل محدر‬،‫ة نصية من عناصر المصفوفة مع فص‬،‫س‬،‫ لت كيل س‬join •
‫كس عناصر المصفوفة‬،‫ ل‬reverse •
‫ى جزء من المصفوفة‬،‫حصوظ ع‬،‫ ل‬slice •

:‫مثال‬
:‫امل مع المصفوفات‬،‫م رق الت‬،‫ميتين المباظ التالي ب‬
<script type="text/javaScript">
a = new Array("a", "b", "c", "d");
n = new Array(1, 2, 3);
an = a.concat(n);
document.write("a concat n= ", an, "<br />");
document.write("a.join(',') = ", a.join(","), "<br />");
document.write("a.slice(1,3) =", a.slice(1, 3), "<br />");
document.write("a.reverse() =", a.reverse(), "<br />");
<script>;

- 26 -
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

: ‫حيث يكوم الخر‬

a concat n= a,b,c,d,1,2,3
a.join(',') = a,b,c,d
a.slice(1,3) =b,c
a.reverse() =d,c,b,a

- 27 -
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫الوظ ائف ‪Functions‬‬

‫األهداف التعليمية‬
‫• الو ا‬

‫‪- 28 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

Functions ‫الوظائف‬
.C ‫في لغة‬ ‫ شكل الو ا‬JavaScript ‫في‬ ‫• مي به شكل الو ا‬
.<head> ‫ضمن المؤثر‬ ‫يتم التصريح عن الو ا‬
ّ •
‫ حيث يتم تجاهل‬.‫امالت الممرة إلال من عدرها‬،‫يتم التحقق عند اسا ا ا ااتدعاء الو يفة من نمط الم‬ّ ‫• ال‬
.undefined ‫تتر‬،‫امالت الناقصة فتم‬،‫ أما الم‬.‫امالت ال از دة‬،‫الم‬
‫ى ولها من الخاصا ا ااية‬،‫ ميمكن الحصا ا ااوظ ع‬arguments ‫امالت عتر مصا ا اافوفة‬،‫يتم إرسا ا اااظ الم‬
ّ •
.length

:‫مثال‬
:arguments ‫ميتين المباظ التالي استخدا المصفوفة‬
<html xmlns = "http://www.w3.org/1999/xhtml">
<head> <title> Parameters </title>
<script type = "text/javascript">
<!--
// Function params
// Parameters: two named parameters and one unnamed
// parameter, all numbers
// Returns: nothing
function params(a, b) {
document.write("Function params was passed ",
arguments.length, " parameter(s) <br />");
document.write("Parameter values are: <br />");
for (var arg = 0; arg < arguments.length; arg++)
document.write(arguments[arg], "<br />");
document.write("<br />");
}
// -->
</script>
</head>
<body>
<script type = "text/javascript">
params("Mozart");
params("Mozart", "Beethoven");
params("Mozart", "Beethoven", "Tchaikowsky");
</script>
</body>

- 29 -
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫>‪</html‬‬

‫حيث يكوم الخر ‪:‬‬

‫‪- 30 -‬‬
‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫مط ابقة النم اذج‬

‫األهداف التعليمية‬
‫• مطابقة النماذ‬

‫‪- 31 -‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫مطابقة النماذج ‪Pattern Matching‬‬

‫رق قويا ااة لمطا ااابقا ا ة النما اااذ اعتما اااراً ع‪،‬ى الت‪،‬ا ااابير المنتظما ااة ‪Regular‬‬ ‫توفر لغا ااة ‪JavaScript‬‬
‫‪.Expressions‬‬

‫المحارف والمحارف المترفعة‬

‫يوجد نوعين من المحارف في النموذ ‪:‬‬
‫• المحارف ال‪،‬ارية إلهي المحارف التي تتطابق مع نفسها‪.‬‬
‫• المحارف المترف‪،‬ة إلهي المحارف التي لها م‪،‬نى ااص إلال تتطابق مع نفسها‪:‬‬
‫‪\|()[]{}^$*+?.‬‬
‫(ميمكن ج‪،‬ل محرف مترفع مي‪،‬امل محرف عاري بسبقه با \ )‬
‫تم‪،‬تتر الطريقة ‪ search‬ع‪،‬ى الغرض ‪ String‬من أبس ا ا ا ا ااط الطرق لمطابقة النماذ ‪ .‬يكوم النموذ م‪،‬امل‬
‫الدال لهذم الطريقة‪ ،‬إلتم‪،‬يد موقع بداية النموذ في الس ا اا‪،‬س ا اا‪،‬ة في حاظ إلجورم (تمفهرس األحرف اعتبا اًر من‬
‫الصفر)‪ ،‬أإل ‪ 1-‬في حاظ عد إلجورم‪ .‬ما ميتين المباظ التالي‪:‬‬
‫;"‪var str = "Rabbits are furry‬‬
‫;)‪var position = str.search(/bits/‬‬
‫)‪if (position >= 0‬‬
‫‪document.write("'bits' appears in position",‬‬
‫" ‪position,‬‬ ‫;)">‪<br /‬‬
‫‪else‬‬
‫;)">‪document.write(" 'bits' does not appear in str <br /‬‬

‫‪'bits' appears in position 3‬‬ ‫الجواي‪:‬‬

‫‪- 32 -‬‬
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫• ميطابق المحرف المترفع (‪ ).‬أي محرف عدا الساطر الجديد‪ .‬فمبالً‪ ،‬ميطابق النموذ ‪ /snow./‬ل‬
‫من ‪( .snowy, snowe, snowd‬ل مطابقة نقطة في سا ا ا اا‪،‬سا ا ا اا‪،‬ة نصا ا ا ااية يجب سا ا ا ااتق النقطة في‬
‫النموذ با \‪ ،‬فمبالً‪ ،‬ميطابق النموذ \‪ \3\.4‬الس‪،‬س‪،‬ة النصية ‪ 3.4‬إلال يطابق ‪.374‬‬
‫• عند إلض ا ا ا ااع مجموعة من األحرف ض ا ا ا اامن ‪ .‬فه ذا ي‪،‬ني أم المطابقة يجب أم تتم مع أحد هذم‬
‫الحرإلف‪ .‬فمبالً ميطابق النموذ ‪ /[oi]n/‬ل من ‪ on‬إل‪.in‬‬
‫• ميمكن اسا ا ا ا ا ا ااتخادا المحرف (‪ )-‬لت‪،‬يين مجااظ من القيم‪ .‬فمبالً‪ / a-h / ،‬ت‪،‬ني أي محرف بين ‪a‬‬
‫إل‪.h‬‬
‫• ميمكن اسا ا ا ا ااتخدا المحرف (م) ل‪،‬كس المحارف الم‪،‬ينة‪ .‬فمبالً ‪ / ^abc /‬ت‪،‬ني أي محرف ما عدا‬
‫األحرف ‪.a, b, c‬‬

‫يوجد ب‪،‬م الصفوف الم‪،‬رفة مسبقاً لب‪،‬م النماذ األكبر استخداماً‪:‬‬

‫‪Name‬‬ ‫‪Equivalent Pattern‬‬ ‫‪Matches‬‬
‫‪\d‬‬ ‫]‪[0-9‬‬ ‫‪a digit‬‬
‫‪\D‬‬ ‫]‪[^0-9‬‬ ‫‪not a digit‬‬
‫‪\w‬‬ ‫]‪[A-Za-z_0-9‬‬ ‫‪a word character‬‬
‫‪\W‬‬ ‫]‪[^A-Za-z_0-9‬‬ ‫‪not a word character‬‬
‫‪\s‬‬ ‫]‪[ \r\t\n\f‬‬ ‫‪a whitespace character‬‬
‫‪\S‬‬ ‫]‪[^ \r\t\n\f‬‬ ‫‪not a whitespace character‬‬

‫فمبالً‪:‬‬
‫• ميطابق النموذ ‪ /\d\.\d\d/‬أي رقم ت‪،‬يه نقطة ي‪،‬يها رقمين‪.‬‬
‫• ميطابق النموذ ‪ /\D\d\D/‬رقم إلاحد‪.‬‬
‫• ميمكن في ال‪،‬ديد من الحاالت تحديد ت رار م‪،‬ين‪:‬‬

‫‪Quantifier‬‬ ‫‪Meaning‬‬
‫}‪{n‬‬ ‫‪exactly n repetitions‬‬
‫}‪{m,‬‬ ‫‪at least m repetitions‬‬
‫}‪{m, n‬‬ ‫‪at least m but not more than n repetitions‬‬

‫‪- 33 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

.xyyyyz ‫ة‬،‫س‬،‫ الس‬/xy{4}z/ ‫فمبالً ميطابق النموذ‬

.‫• ميستخد المحرف (*) لتحديد صفر أإل أي عدر من الت اررات‬
.‫• ميستخد المحرف ( ) لتحديد ت رار إلاحد أإل أكبر‬
.‫• ميستخد المحرف (?) لتحديد صفر أإل ت رار إلاحد‬
،y ‫يها ت رار أإل أكبر لا ا ا ا ا ا ا‬،‫) ي‬x ‫ (أإل إلال‬x ‫در من‬،‫ة محرفية تتدأ ب‬،‫س‬،‫ س‬/?x*y+z/ ‫ ميطابق النموذ‬،ً‫فمبال‬
.)z ‫ إلاحدة (أإل إلال‬z ‫يها‬،‫ي‬
.)‫يها عدر من األرقا (أإل إلال رقم‬،‫يه نقطة ي‬،‫ رقم أإل أكبر ي‬/d+\.\d*/ ‫ميطابق النموذ‬

:‫ة نصية‬،‫س‬،‫ميتين المباظ التالي استخدا مطابقة النماذ الاتبار شكل س‬

<!DOCTYPE html >
<!-- forms_check.html
A function tst_phone_num is defined and tested.
This function checks the validity of phone
number input from a form
-->
<html xmlns = "http://www.w3.org/1999/xhtml">
<head> <title> Phone number tester </title>
<script type = "text/javascript">
<!--
/* Function tst_phone_num
Parameter: A string
Result: Returns true if the parameter has the form of a legal
seven-digit phone number (3 digits, a dash, 4 digits)
*/
function tst_phone_num(num) {
var ok = num.search(/\d{3}-\d{4}/);
if (ok == 0)
return true;
else
return false;
} // end of function tst_phone_num
// -->
</script>
</head>
<body>
<script type = "text/javascript">
<!--

- 34 -
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

var tst = tst_phone_num("444-5432");

if (tst)
document.write("444-5432 is a legal phone number <br />");
else
document.write("Error in tst_phone_num <br />");
tst = tst_phone_num("444-r432");
if (tst)
document.write("Error in tst_phone_num <br />");
else
document.write("444-r432 is not a legal phone number <br />");
tst = tst_phone_num("44-1234");
if (tst)
document.write("Error in tst_phone_num <br />");
else
document.write("44-1234 is not a legal phone number <br /");
// -->
</script>
</body>
</html>

: ‫حيث يكوم الخر‬

- 35 -
 ‫الفصل‪ :4‬أساسيات لغة ‪JavaScript‬‬ ‫مقرر برمجة الويب (‪)1‬‬

‫تحديد الموقع‬
‫ميمكن اسا ا ا ااتخدا المحرف (م) لتحديد أم موقع النموذ يجب أم يكوم بداية السا ا ا اا‪،‬سا ا ا اا‪،‬ة‪ .‬أإل المحرف (‪)$‬‬
‫لتحديد أم النموذ يجب أم يكوم نهاية السا ا اا‪،‬سا ا اا‪،‬ة‪ .‬فمبالً‪ ،‬ميطابق النموذ ‪ /gold$/‬السا ا اا‪،‬سا ا اا‪،‬ة ‪I like‬‬
‫‪ ”gold‬بينما ال ميطابق ‪ .”golden‬ذلك ميطابق النموذ ‪ /^pearl/‬الس ا ا ا اا‪،‬س ا ا ا اا‪،‬ة ‪”pearls are pretty‬‬
‫اليطابق "‪."My pearls are pretty‬‬
‫إل م‬

‫تعديل النماذج‬
‫ميمكن اسا ا ا ا ا ا ااتخادا المحرف (‪ )i‬لط‪،‬اب تجااهال حاالاة األحرف‪ .‬فمبالً‪ ،‬ميطاابق النموذ ‪ /ok/i‬ال من ‪OK,‬‬
‫‪.Ok, ok, oK‬‬

‫الطريقة ‪replace‬‬
‫ميمكن اساتخدا الطريقة ‪ replace‬الساتتداظ سا ‪،‬سا‪،‬ة جز ية بأارى‪ .‬ما ميمكن اساتخدا المحرف (‪ )g‬لط‪،‬ب‬
‫االستتداظ ل ل هور ل‪،‬س‪،‬س‪،‬ة الجز ية‪.‬‬

‫مثال‪:‬‬
‫;"‪var str = "Some rabbits are rabid‬‬
‫;)"‪str = str.replace(/rab/g, "tim‬‬
‫;)">‪document.write("str is ",str ,"<br /‬‬

‫تصبح ‪ str‬مساإلية إلى ‪..Some timbits are timid.‬‬

‫الطريقة ‪match‬‬
‫تمستخد الطريقة ‪ match‬كرجاع مصفوفة من السالسل الجز ية المطابقة ل‪،‬نموذ ‪.‬‬

‫مثال‪:‬‬
‫;"‪var str = "My 3 kings beat your 2 aces‬‬
‫;)‪var matches = str.match(/[ab]/g‬‬
‫;)">‪document.write("matches is ", matches ,"<br /‬‬
‫تصبح قيمة ‪ matches‬مساإلية إلى ‪.b,a,a‬‬

‫‪- 36 -‬‬
 JavaScript ‫ أساسيات لغة‬:4‫الفصل‬ )1( ‫مقرر برمجة الويب‬

split ‫الطريقة‬
.‫ة إلى سالسل جز ية‬،‫س‬،‫ بتجز ة الس‬split ‫تقو الطريقة‬

:‫مثال‬
var str = "red,green,blue";
var colors = str.split(",");
document.write("colors is ", colors,"<br />");
. red, green , blue ‫ مساإلية إلى‬colors ‫تصبح قيمة‬

- 37 -