الاثنين، 5 يوليو 2010

شكر خاص للاستاذ/ سعد الغامدي
مع تحيات مصمم هذه المدونة.
الطالب/ علي سعيد سعد الحارثي.
السجل الاكاديمي/ 1813101310.
وتقبلوا خالص تحياتي.

تصميم صفحات انترنت1

بسم الله الرحمن الرحيم
سبحانك لا علم لنا إلا ما علمتنا إنك أنت العليم الحكيم
المقدمة :
الحمد لله ماحمده الحامدون وغفل عن حمده الغافلون والصلاة والسلام على عبده ورسوله محمد صلاة بعدد ذرات
الخلائق وما يكون . ورضاك اللھم عن آله الطیبین وصحبه المكرمین المبجلین أجمعین وبعد ،
يقدم ھذا الجزء من الكتاب طريقة إستخدام لغة الجافا سكربت في برمجة الويب
في حالة وجود أي أخطاء أرجو اعلامي عن الخطأ علي العنوان التالي
a_elhussein@hotmail.com
وأرجو من كل من أستفاد من ھذا الكتاب أن يدعوا لي بالتوفیق في الدنیا والأخرة
إھداء :
أھدي ھذا الكتاب إلي الجیل القادم الذي يعز الله به الإسلام
وإنا مادامت فیا الحیاة باذل جھدي وعقلي ومستفرغ طاقتي في العلم وذلك لثلاثة أمور
- إفادة من يطلب العلم في حیاتي وبعد مماتي
- ذخیرة لي في قبري ويوم حسابي
- رفعة لسلطان المسلمین
تألیف : الحسین محمد علي
البرمجة بالجافا سكربت الجزء الثاني
2
المحتويات
٣ ...............................................................................................Arrays الفصل الأول : المصفوفات
١٧ ........................................Multidimensional Arrays الفصل الثاني : المصفوفات ذات الأبعاد المتعددة
الفصل الثالث : التعامل مع النصوص................................................................................................ ٣٧
الفصل الرابع : كائن النصوص....................................................................................................... ٤٧
٦٣ ...............................................Regular Expressions الفصل الخامس : التعامل مع التعبیرات المنتظمة
الفصل السادس : التعامل مع التاریخ.................................................................................................. ٧٨
البرمجة بالجافا سكربت الجزء الثاني
3
الفصل الأول
المصفوفات
Arrays
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
الكائنات في الجافا سكربت ·
ما ھي المصفوفات ·
إنشاء مصفوفة ·
المصفوفات بشكل عام ·
تمثیل المصفوفة ·
ملء المصفوفة بالقیم ·
Associative Arrays المصفوفات المجمعة ·
حذف عنصر من مصفوفة ·
البرمجة بالجافا سكربت الجزء الثاني
4
الكائنات في الجافا سكربت
تطور أسلوب البرمجیات علي مدي ٥٠ عام وقد أثمر ھذا التطور علي ظھور طرق واستراتیجیات مختلفة بھدف تكوين
برمجیات عالیة الجودة ولتقلیل الوقت والجھد المستھلك في تطويرھا إلى اقل حد ممكن .
Object وطريقة تطوير البرمجیات الأكثر نجاحا و شیوعا في الاستخدام الیوم ھي الطريقة الموجھة للكائنات
. Oriented Programming
تعرف خواصه وطرقه وبعد ذلك يمكن Object فھذه الطريقة تشكل عناصر البرمجة أو التطبیق على صوره كائن
استخدامه لأداء مھام خاصة كما سنري إن شاء الله بالجزء الثالث من ھذا الكتاب .
لكننا للأسف لا نستطیع القول بأن لغة الجافا سكربت تدعم برمجة الكائنات الموجھة كما ھو الحال بلغة السي بلس
بلس أو الجافا كما سوف يتضح بالجزء الثالث من ھذا الكتاب ، ولكننا يمكننا القول بأن لغة الجافا سكربت تدعم
أي إعتمادنا علي إستخدام كائنات مبنیة داخل لغة Object Base برمجة الكائنات الأساسیة او الإعتمادية
. document و الكائن window مثل الكائن built-in Objects الجافا سكربت
كما نعلم أن لغة الجافا سكربت تم تصمیمھا لبرمجة صفحات الويب ، لذلك تم بناء الكائنات الأساسیة للغة الجافا
document و window سكربت حتي توافق ممیزات متصفحات الأنترنت ( مثل متصفح أنترنت أكسبلورار ) مثل الكائن
. String و Array و Date ، بالإضافة إلي أن لغة الجافا سكربت توفر بعض الكائنات الأخري المفیدة مثل الكائن
Object ولكن ما هو الكائن
بشكل مختصر:
ھذا القالب يحدد الخواص والطرق الممیزة للكائنات الناشئة منه . class الكائن ھو متغیر مركب ينشأ من قالب
ويتكون الكائن من
خصائص ·
طرق أو وظائف ·
أحداث ·
علي سبیل المثال نفترض أن ھناك كائن يمثل سیارة "عربة" ھذه السیارة لھا التالي :
Properties خصائص ·
مثل لونھا ، موديلھا
Methods طرق أو وظائف ·
ولھا عدة وظائف تؤديھا مثل أنھا تمشي وتقف و تستدير
البرمجة بالجافا سكربت الجزء الثاني
5
ما ھي المصفوفات
قبل أن نذھب لتعريف ما ھي المصفوفات ، ھب أننا نريد عمل التالي :
نريد طباعة الرسائل التالیة
"مرحبا بك"
"نحن الأن نتعلم المصفوفات"
"الحمد لله"
فعلي حسب ما تعلمناه في فصل المتغیرات
فسوف نقوم بتعريف ثلاث متغیرات حتي نحفظ فیھا الرسائل السابقة ، كما يلي
var Msg ;"مرحبا بك" = 1
var Msg ;"نحن الأن نتعلم المصفوفات" = 2
var Msg ;"الحمد لله" = 3
ثم نقوم بطباعة ھذه الرسائل كما يلي
alert( Msg1 );
alert( Msg2 );
alert( Msg3 );
تخیل أنك تريد عمل المثال السابق ولكن لیس علي ثلاث متغیرات بل علي ١٠٠ متغیر نصي أو قل عدد غیر محدد
من المتغیرات ،ربما يسبب لك ھذا إحساس بالضیق لكثرة الأكواد التي سوف تكتب لإتمام ھذه المھمة
Arrays من ھنا أتت الحاجة لعمل نوع جديد من المتغیرات وھو ما يطلق علیه المصفوفات
Arrays ولكن ما ھي المصفوفات
المصفوفات ھي من إحدي أنواع المتغیرات ولكن يمكنك أن تخزن بھذا المتغیر قیمة واحدة أو أكثر .
البرمجة بالجافا سكربت الجزء الثاني
6
إنشاء مصفوفة
يمكننا إنشاء المصفوفة بعدة طرق كما يلي
١- إنشاء مصفوفة فارغة ( لا تحتوي علي عناصر )
var myArray = new Array();
تمثل عدد صحیح موجب ) n حیث ) n ٢- إنشاء مصفوفة مكونة من عناصر عددھا
var myArray = new Array(n);
إي يمكنك تعريف مصفوفة مكونة من خمس عناصر كما يلي
var myArray = new Array(5);
٣- إنشاء مصفوفة وملء عناصرھا في نفس الوقت
لإنشاء مصفوفة وملء عناصرھا في نفس الوقت يوجد عدة طرق لإتمام ذلك :
أ -
var myArray = new Array("item1"," item2"," item3");
إي يمكنك تعريف مصفوفة وإعطاء قیم لعناصرھا بشكل مبدئي كما بالمثال التالي
تحتوي علي اسماء ثلاث موظفین empArray سوف نقوم بإنشاء مصفوفة تسمي
var empArray = new Array(" ;("أحمد محسن","حمدي غانم","محمد عبد الله
ب -
var myArray = new Array["item1"," item2"," item3"];
كما يلي new Array أو بدون إستخدام كلمة
var myArray = ["item1"," item2"," item3"];
إي يمكنك تعريف مصفوفة وإعطاء قیم لعناصرھا بشكل مبدئي كما بالمثال التالي
تحتوي علي اسماء ثلاث موظفین empArray سوف نقوم بإنشاء مصفوفة تسمي
var empArray = new Array[" ;["أحمد محسن","حمدي غانم","محمد عبد الله
أو
var empArray = [" ;["أحمد محسن","حمدي غانم","محمد عبد الله
البرمجة بالجافا سكربت الجزء الثاني
7
المصفوفات بشكل عام
المصفوفة نستطیع تشبیھھا بعمارة . العمارة يحتوي كل طابق منھا على شقة واحدة .
لنفرض أن العمارة تتكون من أربعة طوابق
فكان الطابق الأول يسكن به الحسین والطابق الثاني يسكن به إسماعیل والطابق الثالث يسكن به إبراھیم والطابق
الرابع يسكن به يوسف .
إذا ھنا لدينا عمارة تتكون من أربعة طوابق كل طابق يحتوي على شخص فھذا ھو الحال بالنسبة
للمصفوفة فالعمارة ھي أسم المصفوفة . وعدد الطوابق الأربعة ھو عدد عناصر المصفوفة والتى ھي أربعة
والاشخاص الذي كان كل شخص منھم يسكن بطابق ھم قیمة كل عنصر في المصفوفة .
دعنا نطبق ھذا المثال بشكل برمجي
arr كلمة عمارة لنختصرھا ونسمیھا
var arr = new Array(" ;("یوسف","إبراهیم","إسماعیل","الحسین
إذا ھنا الموقع الأول في المصفوفة يساوي الحسین والموقع الثاني يساوي إسماعیل والموقع الثالث يساوي
إبراھیم والموقع الرابع يساوي يوسف .
ولكن عادة في المصفوفات نبدأ من الصفر ولیس من الواحد أي نقول موقع الصفر يساوي الحسین و الموقع
الاول يساوي إسماعیل والموقع الثاني يساوي إبراھیم والموقع الثالث يساوي يوسف .
لعلك إنزعجت من ذلك ، لا داعي لھذا الإنزعاج أعتبر العمارة تتكون من طابق أرضي وطابق أول وطابق ثاني وطابق
ثالث ، إذا الحسین سوف يسكن في الطابق الارضي وھو الصفر أي موقع رقم صفر في المصفوفة ، وإسماعیل في
الطابق الأول أي الموقع الاول في المصفوفة وھكذا .
تمثیل المصفوفة
نقصد بتمثیل المصفوفة اي كیفیة تمثیل المصفوفة بداخل ذاكرة الجھاز
فعلي سبیل المثال كیف يتم تمثیل المصفوفة التالیة بذاكرة الجھاز
var a = new Array(50,90,20,45);
يوضح الشكل التالي كیفیة تمثیل المصفوفة السابقة
البرمجة بالجافا سكربت الجزء الثاني
8
ملء المصفوفة بالقیم
كما تعلمنا سابقا كیفیة إنشاء مصفوفة وملء عناصرھا في نفس الوقت ، يمكننا أيضا إنشاء مصفوفة ثم ملء
عناصرھا بعد ذلك كما يلي
var arr = new Array(3);
نقوم بملء المصفوفة //
arr[0] = 100;
arr[1] = 30;
arr[2] = 230;
كما بالمثال السابق تم تحديد مصفوفة مكونة من ثلاث عناصر كما يلي
var arr = new Array(3);
ثم قمنا بتحديد القیم المخزنة بكل عنصر من عناصر المصفوفة إيتداء من العنصر الموجود بالموقع صفر كما يلي
نقوم بملء المصفوفة //
arr[0] = 100;
arr[1] = 30;
arr[2] = 230;
البرمجة بالجافا سكربت الجزء الثاني
9
ولتقلیل حجم البرنامج يمكننا إستخدام حلقات التكرار لملء المصفوفات كما بالمثال التالي
var arr = new Array(100);
نقوم بملء المصفوفة //
for( var i = 0; i<3; i++ ){ arr[i] = 30; } for( i = 3; i<6; i++ ){ arr[i] = 13; } for( i = 6; i<100; i++ ){ arr[i] = 40; } كما يلي arr وبھذه الطريقة سوف يتم تحديد ١٠٠ عنصر للمصفوفة var arr = new Array(100); ثم يتم تخزين القیمة ٣٠ بداخل الثلاث عناصر الأولي للمصفوفة كما يلي for( var i = 0; i<3; i++ ){ arr[i] = 30; } ثم يتم تخزين القیمة ١٣ بالعناصر الثلاث التالیة كما يلي for( i = 3; i<6; i++ ){ arr[i] = 13; } ثم يتم تخزين القیمة ٤٠ بالعناصر التالیة للمصفوفة كما يلي for( i = 6; i<100; i++ ){ arr[i] = 40; } البرمجة بالجافا سكربت الجزء الثاني 10 تمرین كتابة محتویات المصفوفة





ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
11
التكرارية for in إستخدام جملة
تستخدم لعمل تكرار للمتغیرات من النوع الكائني for in كما قد كنا أشرنا بالجزء الأول من ھذا الكتاب أن جملة
Arrays مثل المصفوفات objects
فقد إحتجنا لتحديد عدد مرات التكرر بمقدار يساوي طول ، for لاحظ بالمثال السابق عندما قمنا بإستخدام جملة
المصفوفة ( اي بعدد عناصر المصفوفة ) كما يلي
var empNameArray = new Array(" ;("أحمد محسن","حمدي غانم","محمد عبد الله","الحسین محمد
for( var i=0; i<4; i++){ document.write(empNameArray[i] ); document.write( "
" );
}
لا نحتاج لتحديد عدد مرات التكرار ، لأنھا بشكل تلقائي سوف يتم التكرار بعدد for in ولكننا عند إستخدامنا لجملة
عناصر المصفوفة .
الصیغة العامة
for ( المتغیر in } (الكائن
الأكواد //
}
مثال توضیحي
لحساب مجموع قیم المصفوفة






البرمجة بالجافا سكربت الجزء الثاني
12
ويكون الناتج كما يلي :
مثال
نريد عمل دالة يمرر لھا اي عدد من المعاملات ثم تقوم بإرجاع القیمة الأكبر لھذه القیم
وقد تم الإشارة لھذا المثال سابقا بالجزء الأول من الكتاب كما يلي






getMax ولذلك قمنا بتعريف الدالة
function getMax () {
var args = getMax.arguments;
var max = args[0];
for( var i=1; i





ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
16
حذف عنصر من مصفوفة
delete يمكننا حذف عنصر من عناصر المصفوفة بإستخدام المعامل
وھو أحد المعاملات الخاصة للغة الجافا سكربت .
نقوم بعمل التالي oceans لذلك إذا أردنا حذف العنصر الثالث بالمصفوفة
var oceans = new Array("Atlantic","Pacific"," Indian"," Arctic");
delete oceans[ لحذف العنصر الثالث بالمصفوفة // ;[ 2
ما ھي التغیرات التي حدثت بالمصفوفة
- أولا تم حذف العنصر الثالث بالمصفوفة .
كما يلي undefined فإذا قمنا بتعین قیمة العنصر الثالث للمصفوفة سوف يعطینا القیمة
var oceans = new Array("Atlantic","Pacific"," Indian"," Arctic");
delete oceans[ لحذف العنصر الثالث بالمصفوفة // ;[ 2
alert( " oceans[2] = " + oceans[2] );
- لكن لاحظ أن طول المصفوفة لم يتغیر فمازال طول المصفوفة يساوي ٤
وتكون المصفوفة كما بالشكل التالي
oceans[0] = "Atlantic";
oceans[1] = "Pacific";
oceans[3] = " Arctic";
البرمجة بالجافا سكربت الجزء الثاني
17
الفصل الثاني
المصفوفات ذات الأبعاد المتعددة
Multidimensional Arrays
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Multidimensional Arrays المصفوفات ذات الأبعاد المتعددة ·
Array of Array مصفوفة المصفوفة ·
Array Object كائن المصفوفة ·
Array Object Properties خصائص كائن المصفوفة o
Array Object Methods دوال كائن المصفوفة o
البرمجة بالجافا سكربت الجزء الثاني
18
Multidimensional Arrays المصفوفات ذات الأبعاد المتعددة
دعنا نقول أنه يوجد نوعین من المصفوفات أحدھما :
- ذات بعد واحد وھو ما كنا أشرنا إلیه سابقا كما بالمثال التالي
oceans[0] = "Atlantic";
oceans[1] = "Pacific";
oceans[2] = "Indian";
oceans[3] = " Arctic";
تمثل مصفوفة ذات بعد واحد oceans فالمصفوفة
أي أنه يمكن تمثیل عناصر المصفوفة علي شكل خطي كما بالشكل التالي
Atlantic Pacific Indian Arctic
- والأخري ذات أبعاد متعددة وھو ما سوف نتحدث عنه
أولا المصفوفة ذات الأبعاد المتعددة مثالا علي ذلك المصفوفة ثنائیة الأبعاد ، أي أنه يمكن تمثیل عناصر المصفوفة
علي شكل مستطیلي ، وأيضا المصفوفات ثلاثیة الأبعاد يمكن تمثیلھا في شكل مكعبي
ولن أطیل في ھذا الحديث لأنه للأسف لا توفر لنا لغة الجافا سكربت امكانیة عمل مصفوفة متعددة الأبعاد
ولكن أنتظر قلیلا فإنه يمكن التحايل علي ھذا الموضوع بعمل ما يسمي مصفوفة المصفوفة
Array of Array مصفوفة المصفوفة
وھي طريقة للتحايل لعمل مصفوفة Jagged Array مصفوفة المصفوفة أو ما تسمي أحیانا بمصفوفة الجاجد
متعددة الأبعاد .
وتكون فكرة عمل تلك المصفوفة معتمد علي أننا نقوم بعمل التالي :
- نقوم بإنشاء مصفوفة ذات بعد واحد كما تعلمنا سابقا
- ثم نقوم بملء عناصر تلك المصفوفة ، ولكن أنتظر قلیلا فأننا لن نقوم بملء عناصر المصفوفة بقیم من نوع
نصي أو رقمي كما كان بالسابق ، ولكننا سوف نجعل كل عنصر من عناصر تلك المصفوفة يشیر إلي
مصفوفة أخري ، وربما تكون المصفوفة المشارة إلیھا ذات بعد واحد أو مصفوفة من نوع مصفوفة المصفوفة
البرمجة بالجافا سكربت الجزء الثاني
19
دعنا نأخذ مثال عملي علي ذلك
ھب أننا نريد تمثیل مصفوفة لشركة لھا عدة فروع وكل فرع له الخصائص التالیة "الاسم" و "العنوان" و "نشاطه"
كما نري ھنا أننا نملك مصفوفة من الفروع ( لأن الشركة ربما يكون لھا أكثر من فرع ) ، إذا نقوم بعمل مصفوفة ذات
ولكن يأتي بعد ذلك كیفیة ملء عناصر تلك المصفوفة ، فكما تم ، CompBranches بعد واحد ونطلق علیھا مثلا
الأشارة سابقا أن كل فرع ( وھو ما يمثل عنصر بمصفوفة الفروع ) تمثل قیمته من خلال اسم الفرع وعنوانه ونشاطه
إذا نحتاج لعمل مصفوفة جديد تحمل بیانات الفرع ويكون طولھا ٣ كما يلي
var CompBranches = new Array(2);
CompBranches[0] = new Array(" ;("التجارة" , "القاهرة","الفرع الرئیسي
CompBranches[1] = new Array(" ;("المراجعة" , "الأسكندریة","فرع المنیرة
التي تعبر عن فروع الشركة كما يلي CompBranches كما نري فقد قمنا بتعريف المصفوفة
var CompBranches = new Array(2);
ثم قمنا بملء بیانات كل فرع علي حدي كما يلي
CompBranches[0] = new Array(" ;("التجارة" , "القاهرة","الفرع الرئیسي
CompBranches[1] = new Array(" ;("المراجعة" , "الأسكندریة","فرع المنیرة
كما يمكننا عمل المثال السابق بعدة طرق كما يلي
var CompBranches = new Array(2);
var branch1 = new Array(" ;("التجارة" , "القاهرة","الفرع الرئیسي
CompBranches[0] = branch1;
var branch2 = new Array(" ;("المراجعة" , "الأسكندریة","فرع المنیرة
CompBranches[1] = branch2;
أو كما يلي
var CompBranches = [ [" [ ["المراجعة" , "الأسكندریة","فرع المنیرة"] , ["التجارة" , "القاهرة","الفرع الرئیسي
أو كما يلي
var CompBranches = new Array(2);
var branch1 = new Array(3);
branch1[ ;"الفرع الرئیسي" = [ 0
branch1[ ;"القاهرة" = [ 1
branch1[ ;"التجارة" = [ 2
CompBranches[0] = branch1;
var branch2 = new Array(3);
البرمجة بالجافا سكربت الجزء الثاني
20
branch2[ ;"فرع المنیرة" = [ 0
branch2[ ;"الأسكندریة" = [ 1
branch2[ ;"المراجعة" = [ 2
CompBranches[1] = branch2;
أو كما يلي
var CompBranches = new Array(2);
CompBranches[0] = new Array(3);
CompBranches[0][ ;"الفرع الرئیسي" = [ 0
CompBranches[0][ ;"القاهرة" = [ 1
CompBranches[0][ ;"التجارة" = [ 2
CompBranches[1] = new Array(3);
CompBranches[1][ ;"فرع المنیرة" = [ 0
CompBranches[1][ ;"الأسكندریة" = [ 1
CompBranches[1][ ;"المراجعة" = [ 2
كما يلي Associative Array يمكننا إستخدام المصفوفة المجمعة
var CompBranches = new Array(2);
CompBranches[0] = new Array(3);
CompBranches[0]["name"] = " ;"الفرع الرئیسي
CompBranches[0]["address"] = " ;"القاهرة
CompBranches[0]["activity"] = " ;"التجارة
CompBranches[1] = new Array(3);
CompBranches[1]["name"] = " ;"فرع المنیرة
CompBranches[1]["address"] = " ;"الأسكندریة
CompBranches[1]["activity"] = " ;"المراجعة
for مثال لطباعة بیانات مصفوفة الفروع السابقة بإستخدام جملة






ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
22
for in مثال أخر لطباعة بیانات مصفوفة الفروع السابقة بإستخدام جملة






ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
23
Array Object كائن المصفوفة
دعنا نتحدث الأن عن الخصائص و الدوال الخاصة بكائن المصفوفة
Array Object Properties خصائص كائن المصفوفة
constructor الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة constructor سوف نتحدث عن الخاصیة
prototype الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة prototype سوف نتحدث عن الخاصیة
Inheritance والوراثة
البرمجة بالجافا سكربت الجزء الثاني
24
length الخاصیة
لحساب طول المصفوفة اي عدد عناصر المصفوفة length تستخدم الخاصیة
مثال
var arr = new Array("100","12","44");
alert( arr.length );
ويكون الناتج كما يلي
مثال






البرمجة بالجافا سكربت الجزء الثاني
25
ويكون الناتج كما يلي :
مثال
var arr = new Array("100","12","44");
alert( arr.length ); // طول المصفوفة یساوي ٣
إضافة عنصر جدید للمصفوفة //
arr[ arr.length ] = "200";
alert( arr.length ); // طول المصفوفة یساوي ٤
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
26
Array Object Methods دوال كائن المصفوفة
concat الدالة
تستخدم لدمج مصفوفتین في مصفوفة جديدة
الصیغة العامة
Array.concat( arrayObject );
مثال
var array1 = new Array(1,2,3);
var array2 = new Array("a","b","c");
var array3 = array1.concat( array2 );
alert( array3.length );
ويكون الناتج كما يلي
مثال




البرمجة بالجافا سكربت الجزء الثاني
27


ويكون الناتج كما يلي :
join الدالة
تستخدم لدمج قیم عناصر المصفوفة ، ويتم الدمج بین عناصر المصفوفة مع وضع فاصل بین قیم العناصر ويتم تحديد
ھذا الفاصل .
الصیغة العامة
Array.join( ;( الجملة الفاصلة
مثال
var arr = new Array("a","b","c");
var str = arr.join(",");
alert( str );
str = arr.join(" ");
alert( str );
str = arr.join("");
alert( str );
البرمجة بالجافا سكربت الجزء الثاني
28
بوضع العلامة الفاصلة "،" arr كما نلاحظ فقد تم دمج عناصر المصفوفة
ويكون الناتج كما يلي
unshift و shift و push و pop الدوال
تستخدم لإضافة عنصر جديد في أخر المصفوفة : push الدالة
تستخدم لحذف أخر عنصر من المصفوفة : pop الدالة
تستخدم لإضافة عنصر في أول المصفوفة : unshift الدالة
تستخدم لحذف أول عنصر من المصفوفة : shift الدالة
الصیغة العامة
Array.push( ;( قیمة العنصر الجدید
Array.pop();
Array.unshift( ;( قیمة العنصر الجدید
Array.shift();
البرمجة بالجافا سكربت الجزء الثاني
29
تستخدم لإضافة عنصر جديد في أخر المصفوفة : push الدالة
مثال
var arr = new Array("a","b","c");
arr.push( "d" );
alert( arr.length );
alert( arr[3] );
ويكون الناتج كما يلي
تستخدم لحذف أخر عنصر من المصفوفة : pop الدالة
مثال
var arr = new Array("a","b","c");
arr.pop();
alert( arr.length );
alert( arr[arr.length- عرض أخر عنصر بالمصفوفة // ;( [ 1
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
30
تستخدم لحذف أول عنصر من المصفوفة : shift الدالة
مثال
var arr = new Array("a","b","c");
arr.shift();
alert( arr.length );
alert( arr[ عرض أول عنصر بالمصفوفة // ;( [ 0
ويكون الناتج كما يلي
تستخدم لإضافة عنصر في أول المصفوفة : unshift الدالة
مثال
var arr = new Array("a","b","c");
arr.unshift( "x" );
alert( arr.length );
alert( arr[ عرض أول عنصر بالمصفوفة // ;( [ 0
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
31
مثال






ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
32
reverse الدالة
تستخدم لعكس مواقع عناصر المصفوفة .
الصیغة العامة
Array.reverse();
مثال
var arr = new Array("a","b","c");
var arrReverse = arr.reverse();
alert( arrReverse.join(",") );
ويكون الناتج كما يلي
splice و slice الدالة
تستخدم كلتا الدالتان لإختزال عناصر المصفوفة .
slice الصیغة العامة للدالة
Array.slice( ;( موقع البدایة
أو
Array.slice( ;( موقع أخر عنصر – ١ , موقع البدایة
splice الصیغة العامة للدالة
Array.splice( ;( عدد العناصر , موقع البدایة
مثال
var arr1 = new Array("a" ,"b" ,"c" ,"d" ,"e" ,"f");
var arr2 = arr1.slice(2);
alert( arr2.join(",") );
البرمجة بالجافا سكربت الجزء الثاني
33
ويكون الناتج كما يلي
مثال
var arr1 = new Array("a" ,"b" ,"c" ,"d" ,"e" ,"f");
var arr2 = arr1.slice(2,4);
alert( arr2.join(",") );
var arr3 = arr1.splice(2,2);
alert( arr3.join(",") );
ويكون الناتج كما يلي
sort الدالة
تستخدم لترتیب عناصر المصفوفة .
الصیغة العامة
Array.sort();
أو
Array.sort( ;( الدالة الخاصة بالترتیب
البرمجة بالجافا سكربت الجزء الثاني
34
مثال
var arr1 = new Array("c", "a", "b");
var arr2 = arr1.sort();
alert( arr2.join(",") );
ويكون الناتج كما يلي
لاحظ المثال التالي
var arr1 = new Array(12, 5, 200, 80);
var arr2 = arr1.sort();
alert( arr2.join(",") );
ويكون الناتج كما يلي
كما تري لم يتم الترتیب بشكل صحیح ، لأنه تم ترتیب عناصر قیم المصفوفة علي أساس أنھا قیم نصیة
ولحل ھذة المشكلة يتم عمل دالة خاصة للترتیب كما يلي
مثال






ويكون الناتج كما يلي
toString و toLocaleString الدالة
تقوم كلتا الدالتین بدمج قیم عناصر المصفوفة في متغیر نصي بوضع فاصل بین القیم
يكون الفاصل المستخدم ھو "،" toString فعند إستخدام الدالة
كما يلي join وبذلك فإنھا تكافئ عمل الدالة
Array.join(",");
يكون الفاصل المستخدم ھو ";" toLocaleString أما عند إستخدام الدالة
كما يلي join وبذلك فإنھا تكافئ عمل الدالة
Array.join(";");
البرمجة بالجافا سكربت الجزء الثاني
36
الصیغة العامة
Array.toLocaleString();
Array.toString();
مثال
var arr1 = new Array("a", "b", "c");
var str = arr1.toLocaleString();
alert( str );
str = arr1.toString();
alert( str );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
37
الفصل الثالث
التعامل مع النصوص
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Simple String النصوص البسیطة ·
Concatenation دمج النصوص ·
parseInt الدالة ·
isNaN الدالة ·
parseFloat الدالة ·
علاج تداخل علامات التنصیص ·
Escaping Characters علامات الھروب أو العلامات الخاصة للكتابة ·
URL String Encoding and Decoding دوال تشفیر وفك تشفیر عناوين الأنترنت ·
escape الدالة o
unescape الدالة o
البرمجة بالجافا سكربت الجزء الثاني
38
كما كنا قد أشرنا سابقا بالجزء الأول من الكتاب في فصل المتغیرات أن لغة الجافا سكربت لیست من اللغات التي
يجعلھا تمیز بین المتغیرات "not strongly typed language" تمیز أنواع البیانات المخزنة بالمتغیرات يشكل قوي
الحرفیة والمتغیرات النصیة بشكل جید ، كما سنري ظھور بعض المشاكل عند إستخدام المتغیرات النصیة البسیطة
لذلك ظھرت الحاجة لإنشاء كائن نصي يكون مبني داخل لغة الجافا سكربت يوفر أسلوب تعامل صحیح مع المتغیرات
النصیة
Simple String النصوص البسیطة
ما ھو النص البسیط : يتكون النص من حرف أو أكثر وربما من رقم أو أكثر أو ربما يكون خلیط من حروف مع أرقام لكن
بشرط أن يتم وضع ھذه الحروف بین علامتین تنصیص كما يلي
var str = " ;"مرحبا بكم
أو بین علامتین تنصیص فردي كما يلي
var str = ' ;'مرحبا بكم
Empty لاحظ أيضا أن المتغیر النصي ربما لا يحتوي علي اي حروف أو أرقام وھو ما يسمي بالمتغیر النصي الفارغ
كما يلي String
var str = "";
Concatenation دمج النصوص
تعتبر عملیة دمج النصوص من العملیات الھامة عند القیام بإنشاء صفحات للويب
ويتم دمج النصوص بإستخدام المعامل + أو المعامل =+ كما يلي
var str = "";
str += "";
str += "";
str += "";
مثال
var str ;"أنت هنا معنا" = 1
var str ;"بالجزء الثاني" = 2
var str3 = str1 + " " + str2;
alert( str3 );
البرمجة بالجافا سكربت الجزء الثاني
39
ويكون الناتج كما يلي
مثال
var str1 = "2";
var str2 = 3;
var str3 = str1 + str2;
alert( str3 );
ويكون الناتج كما يلي
قیمة نصیة بالرغم من أنھا لم يتم وضعھا بین علامتین تنصیص وكان str لاحظ معي أنه تم إعتبار قیمة المتغیر 2
. المتوقع أن يكون ناتج الجمع ھو ٥
كما بالمثال التالي parseFloat أو الدالة parseInt ولعلاج ھذة المشكلة يتم إستخدام الدالة
مثال
في ھذا المثال نطلب من المستخدم إدخال رقمین ، ثم نقوم بإظھار حاصل جمعھم






ويكون الناتج عند إدخال الرقم الأول بالقیمة ٤ والرقم الثاني بالقیمة ٨ ، فیكون ناتج الجمع ھو ١٢ كما يلي
parseInt الدالة
تستخدم لتحويل القیم النصیة إلي قیم عددية صحیحة ( اي أنھا تتعامل مع الأعداد الصحیحة ولیست مع الأعداد
النسبیة ) .
إلي قیمة عددية يمكننا prompt كما رأينا بالمثال السابق أننا قمنا بتحويل القیمة النصیة الراجعة من الدالة
إستخدامھا في العملیات الحسابیة بشكل صحیح
الصیغة العامة
parseInt( ;( القیمة النصیة المراد تحویلها
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة عددية صحیحة
مثال
var num = parseInt( "23" );
alert( num );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
41
مثال
var num = parseInt( "23.43" );
alert( num );
ويكون الناتج كما يلي
integer Number تقوم بالتحويل القیم النصیة إلي قیم عددية صحیحة parseInt لاحظ أن الدالة
لاحظ معي ھذه الحالة
إذا قمنا بتمرير قیمة نصیة للدالة ولكن ھذه القیمة لا تمثل عدد كما يلي
parseInt( "h23" );
ويكون الناتج كما يلي
اي أن القیمة الممرة لھا لیست Not a Numeric وھي إختصار للجملة التالیة NaN فقد قامت الدالة بإرجاع القیمة
. isNaN قیمة عددية ولتفادي ھذه الحالة يمكننا إستخدام الدالة
isNaN الدالة
تستخدم للتأكد من حالة القیمة الممررة لھا ھل ھي قیمة عددية أم لا
اي ھل القیمة الممررة لیست قیمة عددية is Not a Number ھي إختصار للجملة التالیة isNaN وكلمة
الصیغة العامة
isNaN( ;( القیمة
البرمجة بالجافا سكربت الجزء الثاني
42
false أو true القیمة الراجعة من ھذه الدالة : تقوم بإرجاع قیمة من النوع البولیني اي إحدي القیمتین
مثال
alert( isNaN("1.3") );
ويكون الناتج كما يلي
parseFloat الدالة
تستخدم لتحويل القیم النصیة إلي قیم عددية نسبیة ( اي أنھا تتعامل مع الأعداد الصحیحة و الأعداد النسبیة ) .
الصیغة العامة
parseFloat( ;( القیمة النصیة المراد تحویلها
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة عددية نسبیة
مثال
var num = parseFloat( "23.32" );
alert( num );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
43
علاج تداخل علامات التنصیص
كما ذكرنا سابقا أن النص ھو عبارات وجمل يتم كتابتھا بین علامتین تنصیص ""
علي سبیل المثال نريد عمل نص به عبارة أنا من محبي لغة الجافا سكربت سوف نقوم بوضعھا بین علامتین
التنصیص كما يلي " أنا من محبي لغة الجافا سكربت " وبذلك يستطیع مفسر اللغة تمیز أن ھذه الكلمات تابعة
لنص واحد .
إذا إين المشكلة ومتي تظھر نعم أنت علي حق لا توجد مشكلة ھنا إلا إذا حدث التالي
تخیل معي أن نص الجملة يحتوي علامة تنصیص أو أكثر
علي سبیل المثال أنك تريد كتابة الجملة التالیة (ھل ھناك "مشكلة" يا رجل ؟) كما تري أننا الأن في مأزق لأننا
لو وضعنا ھذة الجملة بین علامتیین تنصیص سوف يحدث تداخل في علامات التنصیص وسوف يؤدي ھذا إلي إرتباك
. syntax error لمفسر اللغة مما ينتج عنه خطأ لغوي
الأن ما الحل ؟
ربما يتبادر إلي ذھنك الھرب من المشكلة وتقول أنا لست في حاجة لإظھار علامات التنصیص في الجملة وسوف
أجعل الجملة بدونھما كما ھو حالنا نحن العرب ولكن دائما تأتي الحلول لتفادي الأخطاء وتجنبھا ولیس الھرب
منھا ، أعتقد أنه تبادر إلیك الأن أن ھذه المشكلة لھا حل ابشرك بقولي نعم
. Escaping Characters حیث توفر لنا لغة الجافا سكربت علامات الھروب
Escaping Characters علامات الھروب أو العلامات الخاصة للكتابة
تمكنك من تضمین بعض الحروف التي يصعب كتابتھا في محتوي النصوص ومنھا التالي :
'\ تمكنك من إضافة علامه التنصیص الفردیة بداخل النص
"\ تمكنك من إضافة علامه التنصیص بداخل النص
Carriage تمكنك من إدخال حرف خاص لعمل ما یسمي \r
اي تراجع موشر الكتابه إلي بدایة السطر مما return
ینتج عنه في بعض الأحیان عمل سطر جدید
تمكنك من عمل سطر جدید داخل النص \n
Tab تمكنك من إدخال الحرف \t
بعد التعرف السريع لعلامات الھروب كیف يمكننا حل مشكلة كتابة النص السابق (ھل ھناك "مشكلة" يا رجل ؟ )
بكل يسر يتم إستبدال اي علامة تنصیص (") بعلامة الھروب ("\) ويكون النص كالتالي
(هل هناك \"مشكلة\" یا رجل ؟ )
البرمجة بالجافا سكربت الجزء الثاني
44
مثال تطبیقي لكتابة الرسالة التالیة :
نتمنا لك یا قارئنا "العزیز" أن تكون قد
تعلمت ما سبق من قول وان تحرص علي ما هو أت






ويكون الناتج كالتالي
البرمجة بالجافا سكربت الجزء الثاني
45
URL String Encoding and Decoding دوال تشفیر وفك تشفیر عناوين الأنترنت
أحیانا عندما نقوم بإرسال عنوان لاحدي المواقع ، بأن نقوم علي سبیل المثال بكتابة العنوان التالي
فعند Address Bar في شريط العنوان بالمتصفح "http://www.islamway.com/index.php?action=all news"
تلقائیا اي يتم تحويل العلامات الخاصة إلي ما يقابلھا في url يتم تشفیر عنوان الموقع go الضغط علي زرار ذھاب
ويكون العنوان الناتج كما يلي ASCII النظام الستعشري بنظام التشفیر الأسكي
و all لاحظ أن حرف المسافة بین الكلمتین " http://www.islamway.com/index.php?action=all%20news"
تم إستبدالھا بالرمز التالي " 20 %" والرقم ٢٠ ھو الرقم الستعشري في نظام التشفیر الأسكي news الكلمة
المقابل لحرف المسافة .
لكن أحیانا نقوم نحن بإستخدام أحدي الدوال لعمل إرسال لعنوان موقع من خلال كود الجافا سكربت وبذلك فنحن
. unescape و escape في عرضة لعدم تشفیر بیانات عنوان الموقع المرسل لذلك نحتاج إلي كلتا الدالتین
escape الدالة
أو اي نص ( لیس بالضرورة أن يكون عنوان لموقع ) url تستخدم لتشفیر العلامات الخاصة الموجودة بعنوان الموقع
مضافا إلیة العلامة % . ASCII إلي ما يقابلھا في النظام الستعشري بنظام التشفیر الأسكي
الصیغة العامة
escape( ;( عنوان الموقع المراد تشفیره
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة نصیة
مثال
var siteURL = "http://www.islamway.com/index.php?action=all news";
var codedSiteURL = escape( siteURL );
alert( codedSiteURL );
ويكون الناتج كالتالي
وكما تري فقد تغیر عنوان الموقع إلي عنوان خطأ لأنه تم تشفیر كل العنوان ، ولكننا دائما ما نحتاج إلي تشفیر
البیانات المرسلة فقط كما يلي
البرمجة بالجافا سكربت الجزء الثاني
46
مثال
var siteURL = "http://www.islamway.com/index.php?action=";
var codedSiteURL = siteURL + escape( "all news" );
alert( codedSiteURL );
ويكون الناتج كالتالي
unescape الدالة
أو اي نص ( لیس بالضرورة أن يكون عنوان لموقع url تستخدم لفك تشفیر العلامات الخاصة الموجودة بعنوان الموقع
. escape ) إي عكس ما تقوم به الدالة
الصیغة العامة
unescape( ;( عنوان الموقع المراد فك تشفیره
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة نصیة
مثال
تشفیر النص //
var siteURL = "http://www.islamway.com/index.php?action=";
var codedSiteURL = siteURL + escape( "all news" );
فك تشفیر النص //
var UnCodedSiteURL = unescape(codedSiteURL);
alert( UnCodedSiteURL );
ويكون الناتج كالتالي
البرمجة بالجافا سكربت الجزء الثاني
47
الفصل الرابع
كائن النصوص
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
String Object كائن النصوص ·
إنشاء كائن نصي ·
String Object Properties خصائص كائن النصوص ·
String Object Methods دوال كائن النصوص ·
parsing Methods الدوال الخاصة بالتعامل مع النصوص o
Formatting Methods الدوال الخاصة بتنسیق النص o
البرمجة بالجافا سكربت الجزء الثاني
48
String Object كائن النصوص
إنشاء كائن نصي
يمكننا إنشاء الكائن النصي بعدة طرق كما يلي
String ١- إنشاء كائن نصي بإستخدام الكائن
var str = new String();
أو
var str = new String(" ;("النص
String ٢- لاحظ أن النص البسیط يمكن إستخدامه مثل المتغیر الناشئ من الكائن
var literalStr = " ;"مرحبا بالنصوص
يوفر لنا الكائن النصي العديد من الخصائص والدوال المھمة ، لذلك دعنا نتحدث الأن عن الخصائص و الدوال الخاصة
بكائن النصوص
String Object Properties خصائص كائن النصوص
constructor الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة constructor سوف نتحدث عن الخاصیة
prototype الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة prototype سوف نتحدث عن الخاصیة
Inheritance والوراثة
length الخاصیة
لحساب طول النص اي عدد الحروف المكونة لھذا النص length تستخدم الخاصیة
مثال
var strObject = new String(" ;("الكائن النصي
alert( strObject.length );
البرمجة بالجافا سكربت الجزء الثاني
49
أو كما يلي
var strObject = new String();
strObject = " ;"الكائن النصي
alert( strObject.length );
ويكون الناتج كما يلي
مثال
var str = " ;"المتغیر النصي البسیط
alert( str.length );
أو كما يلي
alert( " المتغیر النصي البسیط ".length );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
50
String Object Methods دوال كائن النصوص
سوف نقسم دوال الكائن النصي إلي قسمین أحدھما للتعامل مع تقطیع النصوص والأخر لتغیر نسق النص من لون
وسمك ألخ عند كتابة تلك النص في المتصفح
parsing Methods الدوال الخاصة بالتعامل مع النصوص
charAt الدالة
تستخدم لقراءة حرف واحد في موقع معین من النص
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.charAt( ;( موقع الحرف
مثال
var str = new String();
str = " ;"لا اله إلا الله محمد رسول الله
alert( " : الحرف الذي یقع عند الموقع الثاني " + str.charAt(1) );
var char = str.charAt(7);
alert( " : الحرف الذي یقع عند الموقع الثامن " + char );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
51
تمرين
نريد عكس نص يتم إستقباله من المستخدم






كما يلي olleh ھو hello ويكون الناتج عند إدخال القیمة
البرمجة بالجافا سكربت الجزء الثاني
52
fromCharCode و charCodeAt الدوال
charCodeAt الدالة
تستخدم لقراءة حرف واحد في موقع معین من النص ولكن تقوم بإرجاع القیمة العددية بنظام التشفیر الأسكي
لھذا الحرف ASCII
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
String.charCodeAt( ;( موقع الحرف
أو
String.charCodeAt();
مثال
"abc".charCodeAt(); // 97 : ینتج عنه القیمة
"abc".charCodeAt( 97 : ینتج عنه القیمة // ;( 0
"abc".charCodeAt( 98 : ینتج عنه القیمة // ;( 1
fromCharCode الدالة
إلي ما يقابلھا من حروف ASCII تستخدم لتحويل قیمة عددية أو أكثر بنظام الأسكي
charCodeAt اي أنھا تقوم بعكس وظیفة الدالة
القیمة الراجعة : تقوم بإرجاع قیمة نصیة مكونة من حرف أو أكثر
الصیغة العامة
String.fromCharCode ( ;( القیمة العددیة
أو
String.fromCharCode( ;( أكثر من قیمة عددیة
مثال
String.fromCharCode( ینتج عنه القیمة // ;( 97 : a
String.fromCharCode(97, 98 , ینتج عنه القیمة // ;( 99 : abc
البرمجة بالجافا سكربت الجزء الثاني
53
concat الدالة
تستخدم لدمج قیمة نصیة بقیمة نصیة أخري
القیمة الراجعة : تقوم بإرجاع قیمة نصیة مكونة ناتج دمج نصین
الصیغة العامة
String.concat( ;( القیمة النصیة
مثال
"abc".concat("def"); // ینتج عنه القیمة : abcdef
lastIndexOf و indexOf الدوال
indexOf الدالة
تستخدم للبحث عن موقع نص داخل نص أخر ، ويبدأ البحث من أول حرف بالنص الذي يتم البحث فیه
القیمة الراجعة : تقوم بإرجاع قیمة عددية تعبر عن موقع النص الذي يتم البحث عنه داخل النص المبحوث فبه
الصیغة العامة
String.indexOf( ;( القیمة النصیة المراد البحث عنها
أو
String.indexOf( ;(موقع بدایة البحث , القیمة النصیة المراد البحث عنها
مثال
"abc".indexOf("b"); // 1 : ینتج عنه القیمة
"abc".indexOf("c"); // 2 : ینتج عنه القیمة
"abc".indexOf("bd"); // -1 : ینتج عنه القیمة
"abc".indexOf("g"); // -1 : ینتج عنه القیمة
"abc".indexOf("b" , 1 : ینتج عنه القیمة // ;( 1
"abc".indexOf("b" , -1 : ینتج عنه القیمة // ;( 2
كما نري إذا لم يتم العثور علي النص يتم إرجاع القیمة - ١
البرمجة بالجافا سكربت الجزء الثاني
54
تمرين
نريد التأكد من صحة قیمة بريد إلیكتروني يتم إستقباله من المستخدم
مع العلم أن البريد الألیكتروني يتمیز بوجود الرمز @






وسوف نري بالفصل القادم "التعامل مع التعبیرات المنتظمة" كیف يتم التأكد من البريد الإلیكتروني بشكل أكثر دقة
lastIndexOf الدالة
تستخدم للبحث عن موقع نص داخل نص أخر ، ويبدأ البحث من أخر حرف بالنص الذي يتم البحث فیه ، وھي
. indexOf بذلك تتشابه إلي حد ما مع الدالة
القیمة الراجعة : تقوم بإرجاع قیمة عددية تعبر عن موقع النص الذي يتم البحث عنه داخل النص المبحوث فبه
الصیغة العامة
String.lastIndexOf( ;( القیمة النصیة المراد البحث عنها
أو
String.lastIndexOf( ;(موقع بدایة البحث , القیمة النصیة المراد البحث عنها
البرمجة بالجافا سكربت الجزء الثاني
55
مثال
"abcdef".lastIndexOf("b"); // 1 : ینتج عنه القیمة
"abcdef".lastIndexOf("c"); // 2 : ینتج عنه القیمة
"abcdef".lastIndexOf("bd"); // -1 : ینتج عنه القیمة
"abcdef".lastIndexOf("g"); // -1 : ینتج عنه القیمة
"abcdef".lastIndexOf("b" , 1 : ینتج عنه القیمة // ;( 1
"abcdef".lastIndexOf("b" , 1 : ینتج عنه القیمة // ;( 2
search و replace و match الدوال
سوف يتم مناقشتھم في الفصل القادم "التعامل مع التعبیرات المنتظمة"
substring و substr و slice الدوال
substring و slice الدالة
تستخدم لإستخلاص جزء من النص بدون أن تؤثر علي النص الأساسي
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.slice( ;( موقع البدایة
String.substring( ;( موقع البدایة
أو
String.slice( ;(موقع النهایة , موقع البدایة
String.substring ( ;(موقع النهایة , موقع البدایة
مثال
"abcdef".substring( ینتج عنه القیمة // ;( 1 : bcdef
"abcdef".substring( ینتج عنه القیمة // ;( 1,3 : bc
البرمجة بالجافا سكربت الجزء الثاني
56
لاجظ التالي
مثال
"abcdef".substring(2, - ینتج عنه القیمة // ;( 1 : ab
قیمة سالبة يتم البحث من نھاية موقع البداية فكما slice أو substring لأنه عندما يكون موقع النھاية الممرر للدالة
ثم تم البحث لقیمة موقع النھاية بقیمة سالبة تساوي c بالمثال السابق كان موقع البداية ھو ٢ اي ما يكافئ الحرف
. b ١ اي أنه ستتم عملیة إختزال النص في أتجاه الیسار إبتدأ من الحرف موقع الحرف –
substr الدالة
مع وجود فارق substring تستخدم لإستخلاص جزء من النص بدون أن تؤثر علي النص الأساسي ، كما تفعل الدالة
يعبر عن عدد الحروف المختزلة أو طول النص الناتج ، بینما يعبر عن موقع substr أن المعامل الثاني الممرر للدالة
. substring النھاية بالنسبة للدالة
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.substr( ;( موقع البدایة
أو
String.substr ( ;( طول النص , موقع البدایة
مثال
"abcdef".substr( ینتج عنه القیمة // ;( 1 : bcdef
"abcdef".substr( ینتج عنه القیمة // ;( 1,3 : bcd
تمرين
نريد إستخلاص اسم المستخدم وسم مزود خدمة البريد الإلیكتروني لقیمة بريد إلیكتروني يتم إستقباله من
المستخدم
مع العلم أن اسم المستخدم يسبق موقع الرمز @ و اسم مزود الخدمة يلي الرمز @ فعلي سبیل المثال
a_elhussein@hotmail.com إذا كان البريد الإلیكتروني المدخل ھو
a_elhussein يكون اسم المستخدم
hotmail ويكون اسم المزود
البرمجة بالجافا سكربت الجزء الثاني
57






split الدالة
تستخدم لتقطیع النص إستنادا علي جملة التقطیع الممررة لھا ، ثم تقوم بوضع الجمل المقطعة في مصفوفة ذات
بعد واحد .
القیمة الراجعة : تقوم بإرجاع مصفوفة تحمل الجمل المقطعة
الصیغة العامة
String.split( ;( الجملة المراد التقطیع بها
أو
String.split( ;(طول المصفوفة الناتج , الجملة المراد التقطیع بها
البرمجة بالجافا سكربت الجزء الثاني
58
مثال
"abcdef".split("cd");
ينتج عنھا المصفوفة التالیة
Arr[0] ----------à ab
Arr[1] ----------à ef
مثال
var arr = "abcdef".split("cd");
alert( arr.toString() );
ويكون الناتج كما يلي
مثال
var arr = "abcdef".split("cd", 1);
alert( arr.toString() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
59
toUpperCase و toLowerCase الدالة
small letters لتحويل حالة الحروف بالنص إلي حروف صغیرة toLowerCase تستخدم الدالة
. capital letters لتحويل حالة الحروف بالنص إلي حروف كبیرة toUpperCase وعلي العكس تستخدم الدالة
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.toLowerCase();
String.toUpperCase();
مثال
"abcdef".toUpperCase(); // ینتج عنه القیمة : ABCDEF
"AbcDef".toLowerCase(); // ینتج عنه القیمة : abcdef
valueOf و toString الدالة
تستخدم لعرض قیمة النص
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.toString);
String.valueOf();
مثال
"abcdef".toString(); // ینتج عنه القیمة : abcdef
"abcdef".valueOf(); // ینتج عنه القیمة : abcdef
البرمجة بالجافا سكربت الجزء الثاني
60
Formatting Methods الدوال الخاصة بتنسیق النص
تستخدم لتغیر نسق النص
الدالة الوصف
تعمل التالي anchor( name)

blink()
تعمل التالي
<>…
تعمل التالي bold()
<>…
تعمل التالي fixed()

تعمل التالي Fontcolor(colorValue)

تعمل التالي Fontsize(size)

تعمل التالي Italics()

تعمل التالي link( url)

تعمل التالي big()

تعمل التالي small()

strike()
تعمل التالي

sub()
تعمل التالي

sup()
تعمل التالي

تمرين
نريد إستخلاص الكلمات التالیة "محمد" و "صحبه" و "عن" من النص التالي
"الحمد لله ماحمده الحامدون وغفل عن حمده الغافلون والصلاة والسلام على عبد ه ورسوله محمد صلاة بعدد ذرات
الخلائق وما يكون . ورضاك اللھم عن آله الطیبین وصحبه المكرمین المبجلین أجمعین وبعد" وتلوينھا باللون
البرمجة بالجافا سكربت الجزء الثاني
61
الأحمر






البرمجة بالجافا سكربت الجزء الثاني
62
البرمجة بالجافا سكربت الجزء الثاني
63
الفصل الخامس
التعامل مع التعبيرات المنتظمة
Regular Expressions
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Regular Expressions ما ھي التعبیرات المنتظمة ·
طريقة كتابة التعبیرات المنتظمة ·
patterns الأنماط o
Grouping المجموعات o
إستخدام كائن النصوص مع الأنماط ·
RegExp كائن التعبیرات المنتظمة ·
البرمجة بالجافا سكربت الجزء الثاني
64
Regular Expressions ما ھي التعبیرات المنتظمة
يمكننا القول بأن التعبیرات المنتظمة ھو أسلوب متقدم للتعامل مع النصوص ، لتوفیر الوقت والمجھود المبذول عند
التعامل مع النصوص كما رأينا بالفصل الثاني الخاص بالتعامل مع النصوص من تقطیع و معاينة موقع جملة معینة بنص
ما .
البیرل ، فلن يجد إختلاف في طريقة إستخدام التعبیرات الخاصة بلغة الجافا سكربت perl ولمن يبرمج بلغة مثل لغة
عما تعلمه بلغة البیرل .
توفر أيضا التعبیرات الخاصة أسلوب قوي للتعامل مع النصوص ، مع القدرة العالیة لتقطیع النصوص وإستبدال نص بنص
أخر وكثیر من المھام الأخري .
Regular Expressions طريقة كتابة التعبیرات المنتظمة
وسوف نتحدث grouping و عمل المجموعات patterns يمكننا كتابة التعبیرات المنتظمة بناء علي ما يسمي بالأنماط
عن كل عنصر علي حدي
patterns الأنماط
تنقسم الأنماط إلي نوعین أنماط بسیطة و أخري مركبة
الأنماط البسیطة
أمثلة علي الأنماط البسیطة
var pattern = / /;
فھذا النمط يعبر عن الحرف "مسافة" وفیما بعد سوف نري كیفیة إستخدام ھذا النمط لإجراء عملیات البحث و
الإستبدال
var pattern = /hello/;
"hello" فھذا النمط يعبر عن الكلمة
var pattern = /hello patterns/;
"hello patterns" فھذا النمط يعبر عن الجملة
var pattern = /web/i;
الذي يجعل عملیات البحث والإستبدال القائمة علي ھذا النمط لا تتأثر بحالة الحروف كبیرة أم i لاحظ وجود الحرف
Case Insensitive ھو إختصار لي i صغیرة ، وحرف
وھكذا . "weB" أو "Web" أو "web" أو "WEB" لذلك ھذا النمط يعبر عن كلمة
البرمجة بالجافا سكربت الجزء الثاني
65
var pattern = /web/g;
الذي يجعل عملیات البحث والإستبدال القائمة علي ھذا النمط تتم علي كل النص ولا تتوقف g لاحظ وجود الحرف
global ھو إختصار لي g بمجرد أن يتم توافق النمط مع جزء من النص ، وحرف
فقط ولكن يتم البحث عنھا في كل النص بدون توقف . "web" لذلك ھذا النمط يعبر عن كلمة
كما يلي g و i ويمكننا دمج الرمزين
var pattern = /web/gi;
الأنماط المركبة
تمكننا الأنماط المركبة من إجراء تعبیرات أكثر قوة ، ومثل علي ذلك تمكننا الأنماط المركبة من عمل التالي
إستخدام الرموز الخاصة بالتكرار
الرمز الوصف
. تعبر عن حرف واحد
? تعبر عن وجود حرف واحد علي الأكثر ، اي ربما تعبر عن
عدم وجود اي حرف
* تعبر عن وجود حرف أو أكثر أو لا شئ
+ تعبر عن وجود حرف أو أكثر
مثال
var pattern = /w.eb/;
وھكذا "Wbeb" أو "waeb" لاحظ وجود الحرف "." داخل نص النمط ، لذلك ھذا النمط يعبر عن كلمة
لأن الحرف "." يعبر عن وجود حرف واحد بدون تحديد لھذا الحرف. "web" ولا يعبر عن
مثال
var pattern = /c.t/;
"category" ولا عن "ct" وھكذا ولا يعبر عن "cut" أو "cat" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /w?eb/;
وھكذا "Wbeb" أو "waeb" لاحظ وجود الحرف "?" داخل نص النمط ، لذلك ھذا النمط يعبر عن كلمة
لأن الحرف "?" يعبر عن وجود حرف واحد بدون تحديد لھذا الحرف وربما يعبر عن لا شئ. "web" و أيضا يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
66
مثال
var pattern = /c*t/;
"category" ولا يعبر عن "coot" و "ct" و "cut" و "cat" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c*t*/;
"category" و "coot" و "ct" و "cut" و "cat" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c+t/;
"category" أو "ct" ولا يعبر عن "coot" و "cut" و "cat" ھذا النمط يمكن أن يعبر عن
إستخدام رموز البداية والنھاية الخاصة
الرمز الوصف
^ تعبر عن أن عند إجراء عملیة تماثل النص مع النمط يجب
أن يتكافئ النمط مع بداية النص
$ تعبر عن أن عند إجراء عملیة تماثل النص مع النمط يجب
أن يتكافئ النمط مع نھاية النص
مثال
var pattern = /^web/;
لأننا "this is a web" ولا يعبر عن "web" لاحظ وجود الحرف "^" بالنمط ، لذلك ھذا النمط يمكن أن يعبر عن
في أول النص . web أشترطنا في ھذا النمط أن تأتي كلمة
مثال
var pattern = /web$/;
لأننا أشترطنا في ھذا "this is a web" أو "web" لاحظ وجود الحرف "$" بالنمط ، لذلك ھذا النمط يمكن أن يعبر عن
."is web , good" في أخر النص ، لذلك ھذا النمط لا يعبر عن web النمط أن تأتي كلمة
البرمجة بالجافا سكربت الجزء الثاني
67
مثال
var pattern = /^web$/;
فقط . "web" لاحظ وجود الحرفین "^" و "$" بالنمط ، لذلك ھذا النمط يمكن أن يعبر عن
إستخدام رموز التكرار العددية
الرمز الوصف
تعبر عن أن يجب تكرار الحرف السابق له عدد من المرات {n}
n يساوي
تعبر عن أن يجب تكرار الحرف السابق له عدد من المرات {n,m}
m إلي القیمة n يساوي من القیمة
تعبر عن أن يجب تكرار الحرف السابق له عدد من المرات {n,}
إلي مالانھاية n يساوي من القیمة
مثال
var pattern = /c{2}t/;
"ct" ولا عن "cat" ولا يعبر عن "cct" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c{1,2}t/;
"cat" ولا يعبر عن "ct" أو "cct" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c{2,}t/;
"ct" ولا عن "cat" ولا يعبر عن "ccccct" أو "cct" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c.t{2}.{2}/;
"cutter" أو "cotton" ھذا النمط يمكن أن يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
68
لاحظ الحالات التالیة
الحالة الأولي
var pattern = /a?/;
يكافئ
var pattern = /a{0,1}/;
الحالة الثانیة
var pattern = /a./;
يكافئ
var pattern = /a{1}/;
الحالة الثالثة
var pattern = /a*/;
يكافئ
var pattern = /a{0,}/;
الحالة الرابعة
var pattern = /a+/;
يكافئ
var pattern = /a{1,}/;
range إستخدام رموز المدي
الرمز الوصف
[ ] تعبر عن أنه يتم البحث في المدي المحدد
[ ^] تعبر عن أنه يتم البحث في عكس المدي المحدد
مثال
var pattern = /[a-z]/;
z و a يقع بین الحرفین small letter ھذا النمط يمكن أن يعبر عن اي حرف صغیر
مثال
var pattern = /[a-z]+/;
"HELLO" ولا يعبر عن "hello" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /[^a-z]+/;
"hello" ولا يعبر عن "HELLO" ھذا النمط يمكن أن يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
69
بعض الأنماط المفیدة
النمط التالي يعبر عن جمیع الحروف التي يمكن كتابتھا بجمیع الحالات (صغیرة أو كبیرة)
var pattern = /[a-zA-Z]/;
النمط التالي لا يعبر عن جمیع الحروف التي يمكن كتابتھا بجمیع الحالات (صغیرة أو كبیرة)
var pattern = /[^a-zA-Z]/;
النمط التالي يعبر عن جمیع الأعداد من صفر إلي ٩
var pattern = /[0-9]/;
النمط التالي لا يعبر عن جمیع الأعداد من صفر إلي ٩
var pattern = /[^0-9]/;
النمط التالي يعبر عن جمیع الأعداد من صفر إلي ٩ وجمیع الحروف المكتوبة
var pattern = /[a-zA-Z0-9]/;
مثال
var pattern = /^[0-9]web/;
"2web" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /^[^0-9]web/;
"2web" ولا يعبر عن "aweb" ھذا النمط يمكن أن يعبر عن
إستخدام الرموز الخاصة
الرمز الوصف
تعبر عن الأرقام من صفر إلي ٩ \d
[0- اي أنھا تكافئ النمط التالي [ 9
لا تعبر عن الأرقام من صفر إلي ٩ \D
[^0- اي أنھا تكافئ النمط التالي [ 9
تعبر عن جمیع الرموز التي يمكن كتابتھا كالأرقام من \w
أو عن الحرف _ أو z إلي a صفر إلي ٩ أو عن الحروف من
underscore ما يسمي بالأندرسكور
[a-zA-Z0- اي أنھا تكافئ النمط التالي [_ 9
لا تعبر عن جمیع الرموز التي يمكن كتابتھا كالأرقام من \W
أو عن الحرف _ أو z إلي a صفر إلي ٩ أو عن الحروف من
underscore ما يسمي بالأندرسكور
البرمجة بالجافا سكربت الجزء الثاني
70
[^a-zA-Z0- اي أنھا تكافئ النمط التالي [_ 9
تعبر عن جمیع الرموز الخاصة التي يصعب كتابه بعضھا \s
\n والسطر الجديد tab مثل حرف المسافة والتاب
\f و \r والرموز التالیة
لا تعبر عن جمیع الرموز الخاصة التي يصعب كتابه بعضھا \S
\n والسطر الجديد tab مثل حرف المسافة والتاب
\f و \r والرموز التالیة
تعبر عن أن النمط يجب أن يتواجد في أول الكلمة فقط \b
ولا organ يعبر عن /\bor/ علي سبیل المثال النمط
normal يعبر عن
perform ولا يعبر عن traitor يعبر عن /or\b/ والنمط
لا تعبر عن أن النمط يجب أن يتواجد في أول الكلمة فقط \B
organ لا يعبر عن /\Bor/ علي سبیل المثال النمط
normal ولكن يعبر عن
الرمز الوصف
\\ تعبر عن الحرف \
tab تعبر عن الحرف \t
.\ تعبر عن الحرف .
?\ تعبر عن الحرف ?
+\ تعبر عن الحرف +
*\ تعبر عن الحرف *
^\ تعبر عن الحرف ^
$\ تعبر عن الحرف $
Grouping المجموعات
$ تستخدم لتجمیع نواتج البحث في مجموعات يتم تخزينھا في مصفوفة أو في متغیرات تبدأ بالرمز $ كالمتغیر 1$ و 2
ولعمل مجموعات يتم إستخدام الرمز الأقواس التالیة () أو العلامة التالیة كما يلي
مثال
var pattern = /^([0-9])(web)/;
web 0] والأخري للنمط - سوف يتم وضع نتائج البحث علي ھذا النمط في مجموعات أحدھما للنمط [ 9
مثال
var pattern = /webcat/;
وھذا النمط ، web والأخري للنمط cat سوف يتم وضع نتائج البحث علي ھذا النمط في مجموعات أحدھما للنمط
"web" أو "cat" يمكن أن يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
71
إستخدام كائن النصوص مع الأنماط
بعدما تعلمنا طريقة كتابة الأنماط ، حان الوقت لمعرفة طريقة تطبیقھا
لذلك سوف نعتمد علي بعض دوال الكائن النصي لتطبیق الأنماط وھي كما يلي
match الدالة
تستخدم للبحث عن نمط معین بداخل النص ، ثم تقوم بإرجاع مصفوفة بھا نواتج البحث
القیمة الراجعة : تقوم بإرجاع مصفوفة
الصیغة العامة
String.match( ;( النمط
مثال
var str = new String();
str = "hello mr hello";
var arrResult = new Array();
var pattern = /hello/;
arrResult = str.match( pattern );
alert( " عدد مرات التواجد : " + arrResult.length );
ويكون الناتج كما يلي
مرتین لكن ناتج البحث كان مرة واحدة ، وھذا صحیح لأن النمط المستخدم hello مع أنا النص يحتوي علي كلمة
يتوقف بعد حدوث تماثل له مع النص الذي يتم البحث فیه ، لذلك لإجراء البحث علي جمیع النص يتم إستبدال النمط
السابق بالنمط التالي كما يلي
البرمجة بالجافا سكربت الجزء الثاني
72
مثال
var str = new String();
str = "hello mr hello";
var arrResult = new Array();
var pattern = /hello/g;
arrResult = str.match( pattern );
alert( " عدد مرات التواجد : " + arrResult.length );
ويكون الناتج كما يلي
تمرين
نريد التأكد من صحة البريد الإلیكتروني الذي يتم إستقباله من المستخدم






البرمجة بالجافا سكربت الجزء الثاني
73
تمرين
نريد إستخلاص اسم المستخدم واسم مزود خدمة البريد الإلیكتروني لقیمة بريد إلیكتروني يتم إستقباله من
المستخدم
مع العلم أن اسم المستخدم يسبق موقع الرمز @ و اسم مزود الخدمة يلي الرمز @ فعلي سبیل المثال
a_elhussein@hotmail.com إذا كان البريد الإلیكتروني المدخل ھو
a_elhussein يكون اسم المستخدم
hotmail ويكون اسم المزود
لاحظ أن النمط المستخدم ھو نفس النمط السابق مع إضافة المجموعات بإستخدام الأقواس .






replace الدالة
تستخدم للبحث عن نمط معین بداخل النص ثم تقوم بإستبداله بنص أخر
القیمة الراجعة : تقوم بإرجاع النص الجديد
الصیغة العامة
String.replace ( ;( نص الإستبدال , نمط البحث
البرمجة بالجافا سكربت الجزء الثاني
74
مثال
var str = new String();
str = "hello mr hello";
var pattern = /hello/g;
var newStr = str.replace( pattern, "me" );
alert( " : النص الجدید : " + newStr );
ويكون الناتج كما يلي
search الدالة
التابعة للكائن النصي indexOf تستخدم للبحث عن نمط معین بداخل النص ثم تقوم بإرجاع مكان تواجدة مثل الدالة
القیمة الراجعة : تقوم بإرجاع موقع النص علي ھیئة قیمة عددية
الصیغة العامة
String.search( ;( نمط البحث
مثال
var str = new String();
str = "hello mr hello";
var pattern = /mr/;
var index = str.search( pattern );
alert( " موقع جملة mr : " + index );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
75
RegExp كائن التعبیرات المنتظمة
RegExp إنشاء كائن التعبیرات المنتظمة
يمكننا إنشائه كما يلي
var regexpObject = new RegExp();
RegExp خصائص الكائن
constructor الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة constructor سوف نتحدث عن الخاصیة
global الخاصیة
به g وتعبر ھل النمط المستخدم تم إستخدام المعامل ، read only ھذه الخاصیة للقرأة فقط
فعلي سبیل المثال
true تساوي global تكون الخاصیة /hello/g النمط التالي
false تساوي global تكون الخاصیة /hello/ أما النمط التالي
ignoreCase الخاصیة
به i وتعبر ھل النمط المستخدم تم إستخدام المعامل ، read only ھذه الخاصیة للقرأة فقط
فعلي سبیل المثال
true تساوي ignoreCase تكون الخاصیة /hello/i النمط التالي
false تساوي ignoreCase تكون الخاصیة /hello/ أما النمط التالي
multiline الخاصیة
وتعبر ھل النمط المستخدم سوف لا يتجاھل السطور العديدة به ، read only ھذه الخاصیة للقرأة فقط
source الخاصیة
. RegExp وتعبر عن صیغة النمط المستخدم بالكائن ، read only ھذه الخاصیة للقرأة فقط
البرمجة بالجافا سكربت الجزء الثاني
76
RegExp دوال الكائن
compile الدالة
تمكننا من إنشاء كائن للتعبیرات المنتظمة به نمط معین
الصیغة العامة
RegExp.compile( ;( النمط
أو
RegExp.compile( النمط , ["g" "i" "m"]);
يحدد المعامل الثاني طريقة البحث بإستخدام النمط
multiline وھي يعبر عن البحث في جمیع السطور m وھنا سوف نشیر إلي الرمز
مثال
var regexpObject = new RegExp();
var regexpObject2 = regexpObject.compile("/me/");
var regexpObject2 = regexpObject.compile("/me/", "i");
test الدالة
تستخدم للتأكد من توافق النمط مع النص الممرر لھا
false وفي حالة عدم التوافق ترجع true القیمة الراجعة : في حالة توافق النمط مع النص ترجع الدالة القیمة
الصیغة العامة
RegExp.test( ;( النص
مثال
var RegExp = /me/;
alert( regExp.test("hello me hello") );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
77
exec الدالة
تستخدم لتنفیذ النمط علي النص الممرر لھا
Match القیمة الراجعة : مصفوفة من كائنات من النوع
الصیغة العامة
RegExp.exec( ;( النص
مثال
var RegExp = /me/;
var matchArray = RegExp.exec("hello me hello");
if( matchArray == null )
alert(" لم یتم العثور علي جملة me");
else
alert( " : تم العثور علي جملة " + matchArray[0] );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
78
الفصل السادس
التعامل مع التاريخ
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Date الكائن ·
إنشاء كائن التاريخ ·
دوال كائن التاريخ ·
البرمجة بالجافا سكربت الجزء الثاني
79
Date Object كائن التاريخ
الجافا سكربت لیس بھا نوع بیانات أولي للتاريخ ، لكنك تستطیع أن تستخدم كائن التاريخ ودوالة أو وظائفه للتعامل
مع التاريخ والوقت في تطبیقاتك
منذ تاريخ ١ يناير ١٩٧٠ milliseconds يتم تخزين التاريخ بالملي سكند
لاحظ أن كائن التاريخ لیس به أي خصائص
إنشاء كائن التاريخ
الصیغة العامة
var dateObject = new Date();
أو
var dateObject = new Date( ;( تاریخ
مثال
var dateObject = new Date();
alert( dateObject );
ويكون الناتج كما يلي
ويمكننا تحديد التاريخ كما يلي
مثال
var dateObject = new Date("6/15/2004");
alert( dateObject );
البرمجة بالجافا سكربت الجزء الثاني
80
ويكون الناتج كما يلي
دوال كائن التاريخ
تنقسم دوال كائن التاريخ إلي ثلاث أقسام أحدھما دوال لإرجاع القیم من التاريخ والأخري لوضع قیم بالتاريخ
والأخري لتحويل التاريخ كما يلي
getDate الدالة
تستخدم لإرجاع الأيام الموجودة بالتاريخ من ١ إلي ٣١
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getDate();
مثال
var dateObject = new Date();
alert( dateObject.getDate() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
81
getDay الدالة
تستخدم لإرجاع رقم يوم الأسبوع الموجود بالتاريخ وتكون ممثلة لأيام الأسبوع من ٠ إلي ٦ ، حیث صفر يعبر عن يوم
الأحد
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getDay();
مثال
var dateObject = new Date();
alert( dateObject.getDay() );
ويكون الناتج كما يلي
والرقم ٣ يعبر عن يوم الأربعاء
getMonth الدالة
تستخدم لإرجاع رقم الأشھر من ٠ إلي ١١ ، حیث يعبر الرقم صفر عن شھر يناير
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getMonth();
البرمجة بالجافا سكربت الجزء الثاني
82
مثال
var dateObject = new Date();
alert( dateObject.getMonth() );
ويكون الناتج كما يلي
والرقم ٥ يعبر عن شھر يونیو
getYear الدالة
تستخدم لإرجاع السنة
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getYear();
مثال
var dateObject = new Date();
alert( dateObject.getYear() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
83
getHours الدالة
تستخدم لإرجاع قیمة عدد الساعات من ٠ إلي ٢٣
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getHours();
مثال
var dateObject = new Date();
alert( dateObject.getHours() );
ويكون الناتج كما يلي
والساعة ١٦ تعادل الساعة الراعة صباحا
getMinutes الدالة
تستخدم لإرجاع قیمة عدد الدقائق من ٠ إلي ٥٩
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getMinutes();
مثال
var dateObject = new Date();
alert( dateObject.getMinutes() );
البرمجة بالجافا سكربت الجزء الثاني
84
getSeconds الدالة
تستخدم لإرجاع قیمة عدد الدقائق من ٠ إلي ٥٩
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getSeconds();
مثال
var dateObject = new Date();
alert( dateObject.getSeconds() );
getTime الدالة
تستخدم بحساب التاريخ بالملي سكند الذي مر علي ھذا التاريخ منذ تاريخ منتصف لیل يوم ١ يناير ١٩٧٠
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getTime();
مثال
var dateObject = new Date();
alert( dateObject.getTime() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
85
setDate الدالة
تستخدم لوضع عدد الأيام بالتاريخ وتكون القیمة المضافة من ١ إلي ٣١
الصیغة العامة
Date.setDate( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setDate("2");
setMonth الدالة
تستخدم لوضععدد الشھور بالتاريخ وتكون القیمة المضافة من ٠ إلي ١١
الصیغة العامة
Date.setMonth( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setMonth("2");
setYear الدالة
تستخدم لتحديد قیمة السنوات بالتاريخ
الصیغة العامة
Date.setYear( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setYear("2006");
البرمجة بالجافا سكربت الجزء الثاني
86
setHours الدالة
تستخدم لتحديد قیمة الساعات بالتاريخ
الصیغة العامة
Date.setHours( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setHours("2");
setMinutes الدالة
تستخدم لتحديد قیمة الدقائق بالتاريخ
الصیغة العامة
Date.setMinutes( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setMinutes("20");
setSeconds الدالة
تستخدم لتحديد قیمة الثواني بالتاريخ
الصیغة العامة
Date.setSeconds( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setSeconds("2");
toGMTString الدالة
تستخدم لتحويل التاريخ إلي ما يعادلة بتوقیت جرينتش
الصیغة العامة
Date.toGMTString();
البرمجة بالجافا سكربت الجزء الثاني
87
مثال
var dateObject = new Date();
alert( dateObject.toGMTString() );
ويكون الناتج كما يلي
toLocaleString الدالة
تستخدم لتحويل التاريخ إلي ما نص علي حسب نظام التشغیل الذي يعمل به الجھاز
الصیغة العامة
Date.toLocaleString();
مثال
var dateObject = new Date();
alert( dateObject.toLocaleString() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
88
parse الدالة
تستخدم لتحويل القیمة النصیة إلي متغیر من نوع تاريخ
الصیغة العامة
Date.parse( " ;( "نص التاریخ
مثال
var dateObject = new Date( Date.parse("Wed Jun 16 17:31:01 PDT 2004") );
alert( dateObject.getYear() );
ويكون الناتج كما يلي
تمرين




بسم الله الرحمن الرحيم
سبحانك لا علم لنا إلا ما علمتنا إنك أنت العليم الحكيم
المقدمة :
الحمد لله ماحمده الحامدون وغفل عن حمده الغافلون والصلاة والسلام على عبده ورسوله محمد صلاة بعدد ذرات
الخلائق وما يكون . ورضاك اللھم عن آله الطیبین وصحبه المكرمین المبجلین أجمعین وبعد ،
يقدم ھذا الجزء من الكتاب طريقة إستخدام لغة الجافا سكربت في برمجة الويب
في حالة وجود أي أخطاء أرجو اعلامي عن الخطأ علي العنوان التالي
a_elhussein@hotmail.com
وأرجو من كل من أستفاد من ھذا الكتاب أن يدعوا لي بالتوفیق في الدنیا والأخرة
إھداء :
أھدي ھذا الكتاب إلي الجیل القادم الذي يعز الله به الإسلام
وإنا مادامت فیا الحیاة باذل جھدي وعقلي ومستفرغ طاقتي في العلم وذلك لثلاثة أمور
- إفادة من يطلب العلم في حیاتي وبعد مماتي
- ذخیرة لي في قبري ويوم حسابي
- رفعة لسلطان المسلمین
تألیف : الحسین محمد علي
البرمجة بالجافا سكربت الجزء الثاني
2
المحتويات
٣ ...............................................................................................Arrays الفصل الأول : المصفوفات
١٧ ........................................Multidimensional Arrays الفصل الثاني : المصفوفات ذات الأبعاد المتعددة
الفصل الثالث : التعامل مع النصوص................................................................................................ ٣٧
الفصل الرابع : كائن النصوص....................................................................................................... ٤٧
٦٣ ...............................................Regular Expressions الفصل الخامس : التعامل مع التعبیرات المنتظمة
الفصل السادس : التعامل مع التاریخ.................................................................................................. ٧٨
البرمجة بالجافا سكربت الجزء الثاني
3
الفصل الأول
المصفوفات
Arrays
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
الكائنات في الجافا سكربت ·
ما ھي المصفوفات ·
إنشاء مصفوفة ·
المصفوفات بشكل عام ·
تمثیل المصفوفة ·
ملء المصفوفة بالقیم ·
Associative Arrays المصفوفات المجمعة ·
حذف عنصر من مصفوفة ·
البرمجة بالجافا سكربت الجزء الثاني
4
الكائنات في الجافا سكربت
تطور أسلوب البرمجیات علي مدي ٥٠ عام وقد أثمر ھذا التطور علي ظھور طرق واستراتیجیات مختلفة بھدف تكوين
برمجیات عالیة الجودة ولتقلیل الوقت والجھد المستھلك في تطويرھا إلى اقل حد ممكن .
Object وطريقة تطوير البرمجیات الأكثر نجاحا و شیوعا في الاستخدام الیوم ھي الطريقة الموجھة للكائنات
. Oriented Programming
تعرف خواصه وطرقه وبعد ذلك يمكن Object فھذه الطريقة تشكل عناصر البرمجة أو التطبیق على صوره كائن
استخدامه لأداء مھام خاصة كما سنري إن شاء الله بالجزء الثالث من ھذا الكتاب .
لكننا للأسف لا نستطیع القول بأن لغة الجافا سكربت تدعم برمجة الكائنات الموجھة كما ھو الحال بلغة السي بلس
بلس أو الجافا كما سوف يتضح بالجزء الثالث من ھذا الكتاب ، ولكننا يمكننا القول بأن لغة الجافا سكربت تدعم
أي إعتمادنا علي إستخدام كائنات مبنیة داخل لغة Object Base برمجة الكائنات الأساسیة او الإعتمادية
. document و الكائن window مثل الكائن built-in Objects الجافا سكربت
كما نعلم أن لغة الجافا سكربت تم تصمیمھا لبرمجة صفحات الويب ، لذلك تم بناء الكائنات الأساسیة للغة الجافا
document و window سكربت حتي توافق ممیزات متصفحات الأنترنت ( مثل متصفح أنترنت أكسبلورار ) مثل الكائن
. String و Array و Date ، بالإضافة إلي أن لغة الجافا سكربت توفر بعض الكائنات الأخري المفیدة مثل الكائن
Object ولكن ما هو الكائن
بشكل مختصر:
ھذا القالب يحدد الخواص والطرق الممیزة للكائنات الناشئة منه . class الكائن ھو متغیر مركب ينشأ من قالب
ويتكون الكائن من
خصائص ·
طرق أو وظائف ·
أحداث ·
علي سبیل المثال نفترض أن ھناك كائن يمثل سیارة "عربة" ھذه السیارة لھا التالي :
Properties خصائص ·
مثل لونھا ، موديلھا
Methods طرق أو وظائف ·
ولھا عدة وظائف تؤديھا مثل أنھا تمشي وتقف و تستدير
البرمجة بالجافا سكربت الجزء الثاني
5
ما ھي المصفوفات
قبل أن نذھب لتعريف ما ھي المصفوفات ، ھب أننا نريد عمل التالي :
نريد طباعة الرسائل التالیة
"مرحبا بك"
"نحن الأن نتعلم المصفوفات"
"الحمد لله"
فعلي حسب ما تعلمناه في فصل المتغیرات
فسوف نقوم بتعريف ثلاث متغیرات حتي نحفظ فیھا الرسائل السابقة ، كما يلي
var Msg ;"مرحبا بك" = 1
var Msg ;"نحن الأن نتعلم المصفوفات" = 2
var Msg ;"الحمد لله" = 3
ثم نقوم بطباعة ھذه الرسائل كما يلي
alert( Msg1 );
alert( Msg2 );
alert( Msg3 );
تخیل أنك تريد عمل المثال السابق ولكن لیس علي ثلاث متغیرات بل علي ١٠٠ متغیر نصي أو قل عدد غیر محدد
من المتغیرات ،ربما يسبب لك ھذا إحساس بالضیق لكثرة الأكواد التي سوف تكتب لإتمام ھذه المھمة
Arrays من ھنا أتت الحاجة لعمل نوع جديد من المتغیرات وھو ما يطلق علیه المصفوفات
Arrays ولكن ما ھي المصفوفات
المصفوفات ھي من إحدي أنواع المتغیرات ولكن يمكنك أن تخزن بھذا المتغیر قیمة واحدة أو أكثر .
البرمجة بالجافا سكربت الجزء الثاني
6
إنشاء مصفوفة
يمكننا إنشاء المصفوفة بعدة طرق كما يلي
١- إنشاء مصفوفة فارغة ( لا تحتوي علي عناصر )
var myArray = new Array();
تمثل عدد صحیح موجب ) n حیث ) n ٢- إنشاء مصفوفة مكونة من عناصر عددھا
var myArray = new Array(n);
إي يمكنك تعريف مصفوفة مكونة من خمس عناصر كما يلي
var myArray = new Array(5);
٣- إنشاء مصفوفة وملء عناصرھا في نفس الوقت
لإنشاء مصفوفة وملء عناصرھا في نفس الوقت يوجد عدة طرق لإتمام ذلك :
أ -
var myArray = new Array("item1"," item2"," item3");
إي يمكنك تعريف مصفوفة وإعطاء قیم لعناصرھا بشكل مبدئي كما بالمثال التالي
تحتوي علي اسماء ثلاث موظفین empArray سوف نقوم بإنشاء مصفوفة تسمي
var empArray = new Array(" ;("أحمد محسن","حمدي غانم","محمد عبد الله
ب -
var myArray = new Array["item1"," item2"," item3"];
كما يلي new Array أو بدون إستخدام كلمة
var myArray = ["item1"," item2"," item3"];
إي يمكنك تعريف مصفوفة وإعطاء قیم لعناصرھا بشكل مبدئي كما بالمثال التالي
تحتوي علي اسماء ثلاث موظفین empArray سوف نقوم بإنشاء مصفوفة تسمي
var empArray = new Array[" ;["أحمد محسن","حمدي غانم","محمد عبد الله
أو
var empArray = [" ;["أحمد محسن","حمدي غانم","محمد عبد الله
البرمجة بالجافا سكربت الجزء الثاني
7
المصفوفات بشكل عام
المصفوفة نستطیع تشبیھھا بعمارة . العمارة يحتوي كل طابق منھا على شقة واحدة .
لنفرض أن العمارة تتكون من أربعة طوابق
فكان الطابق الأول يسكن به الحسین والطابق الثاني يسكن به إسماعیل والطابق الثالث يسكن به إبراھیم والطابق
الرابع يسكن به يوسف .
إذا ھنا لدينا عمارة تتكون من أربعة طوابق كل طابق يحتوي على شخص فھذا ھو الحال بالنسبة
للمصفوفة فالعمارة ھي أسم المصفوفة . وعدد الطوابق الأربعة ھو عدد عناصر المصفوفة والتى ھي أربعة
والاشخاص الذي كان كل شخص منھم يسكن بطابق ھم قیمة كل عنصر في المصفوفة .
دعنا نطبق ھذا المثال بشكل برمجي
arr كلمة عمارة لنختصرھا ونسمیھا
var arr = new Array(" ;("یوسف","إبراهیم","إسماعیل","الحسین
إذا ھنا الموقع الأول في المصفوفة يساوي الحسین والموقع الثاني يساوي إسماعیل والموقع الثالث يساوي
إبراھیم والموقع الرابع يساوي يوسف .
ولكن عادة في المصفوفات نبدأ من الصفر ولیس من الواحد أي نقول موقع الصفر يساوي الحسین و الموقع
الاول يساوي إسماعیل والموقع الثاني يساوي إبراھیم والموقع الثالث يساوي يوسف .
لعلك إنزعجت من ذلك ، لا داعي لھذا الإنزعاج أعتبر العمارة تتكون من طابق أرضي وطابق أول وطابق ثاني وطابق
ثالث ، إذا الحسین سوف يسكن في الطابق الارضي وھو الصفر أي موقع رقم صفر في المصفوفة ، وإسماعیل في
الطابق الأول أي الموقع الاول في المصفوفة وھكذا .
تمثیل المصفوفة
نقصد بتمثیل المصفوفة اي كیفیة تمثیل المصفوفة بداخل ذاكرة الجھاز
فعلي سبیل المثال كیف يتم تمثیل المصفوفة التالیة بذاكرة الجھاز
var a = new Array(50,90,20,45);
يوضح الشكل التالي كیفیة تمثیل المصفوفة السابقة
البرمجة بالجافا سكربت الجزء الثاني
8
ملء المصفوفة بالقیم
كما تعلمنا سابقا كیفیة إنشاء مصفوفة وملء عناصرھا في نفس الوقت ، يمكننا أيضا إنشاء مصفوفة ثم ملء
عناصرھا بعد ذلك كما يلي
var arr = new Array(3);
نقوم بملء المصفوفة //
arr[0] = 100;
arr[1] = 30;
arr[2] = 230;
كما بالمثال السابق تم تحديد مصفوفة مكونة من ثلاث عناصر كما يلي
var arr = new Array(3);
ثم قمنا بتحديد القیم المخزنة بكل عنصر من عناصر المصفوفة إيتداء من العنصر الموجود بالموقع صفر كما يلي
نقوم بملء المصفوفة //
arr[0] = 100;
arr[1] = 30;
arr[2] = 230;
البرمجة بالجافا سكربت الجزء الثاني
9
ولتقلیل حجم البرنامج يمكننا إستخدام حلقات التكرار لملء المصفوفات كما بالمثال التالي
var arr = new Array(100);
نقوم بملء المصفوفة //
for( var i = 0; i<3; i++ ){ arr[i] = 30; } for( i = 3; i<6; i++ ){ arr[i] = 13; } for( i = 6; i<100; i++ ){ arr[i] = 40; } كما يلي arr وبھذه الطريقة سوف يتم تحديد ١٠٠ عنصر للمصفوفة var arr = new Array(100); ثم يتم تخزين القیمة ٣٠ بداخل الثلاث عناصر الأولي للمصفوفة كما يلي for( var i = 0; i<3; i++ ){ arr[i] = 30; } ثم يتم تخزين القیمة ١٣ بالعناصر الثلاث التالیة كما يلي for( i = 3; i<6; i++ ){ arr[i] = 13; } ثم يتم تخزين القیمة ٤٠ بالعناصر التالیة للمصفوفة كما يلي for( i = 6; i<100; i++ ){ arr[i] = 40; } البرمجة بالجافا سكربت الجزء الثاني 10 تمرین كتابة محتویات المصفوفة





ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
11
التكرارية for in إستخدام جملة
تستخدم لعمل تكرار للمتغیرات من النوع الكائني for in كما قد كنا أشرنا بالجزء الأول من ھذا الكتاب أن جملة
Arrays مثل المصفوفات objects
فقد إحتجنا لتحديد عدد مرات التكرر بمقدار يساوي طول ، for لاحظ بالمثال السابق عندما قمنا بإستخدام جملة
المصفوفة ( اي بعدد عناصر المصفوفة ) كما يلي
var empNameArray = new Array(" ;("أحمد محسن","حمدي غانم","محمد عبد الله","الحسین محمد
for( var i=0; i<4; i++){ document.write(empNameArray[i] ); document.write( "
" );
}
لا نحتاج لتحديد عدد مرات التكرار ، لأنھا بشكل تلقائي سوف يتم التكرار بعدد for in ولكننا عند إستخدامنا لجملة
عناصر المصفوفة .
الصیغة العامة
for ( المتغیر in } (الكائن
الأكواد //
}
مثال توضیحي
لحساب مجموع قیم المصفوفة






البرمجة بالجافا سكربت الجزء الثاني
12
ويكون الناتج كما يلي :
مثال
نريد عمل دالة يمرر لھا اي عدد من المعاملات ثم تقوم بإرجاع القیمة الأكبر لھذه القیم
وقد تم الإشارة لھذا المثال سابقا بالجزء الأول من الكتاب كما يلي






getMax ولذلك قمنا بتعريف الدالة
function getMax () {
var args = getMax.arguments;
var max = args[0];
for( var i=1; i





ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
16
حذف عنصر من مصفوفة
delete يمكننا حذف عنصر من عناصر المصفوفة بإستخدام المعامل
وھو أحد المعاملات الخاصة للغة الجافا سكربت .
نقوم بعمل التالي oceans لذلك إذا أردنا حذف العنصر الثالث بالمصفوفة
var oceans = new Array("Atlantic","Pacific"," Indian"," Arctic");
delete oceans[ لحذف العنصر الثالث بالمصفوفة // ;[ 2
ما ھي التغیرات التي حدثت بالمصفوفة
- أولا تم حذف العنصر الثالث بالمصفوفة .
كما يلي undefined فإذا قمنا بتعین قیمة العنصر الثالث للمصفوفة سوف يعطینا القیمة
var oceans = new Array("Atlantic","Pacific"," Indian"," Arctic");
delete oceans[ لحذف العنصر الثالث بالمصفوفة // ;[ 2
alert( " oceans[2] = " + oceans[2] );
- لكن لاحظ أن طول المصفوفة لم يتغیر فمازال طول المصفوفة يساوي ٤
وتكون المصفوفة كما بالشكل التالي
oceans[0] = "Atlantic";
oceans[1] = "Pacific";
oceans[3] = " Arctic";
البرمجة بالجافا سكربت الجزء الثاني
17
الفصل الثاني
المصفوفات ذات الأبعاد المتعددة
Multidimensional Arrays
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Multidimensional Arrays المصفوفات ذات الأبعاد المتعددة ·
Array of Array مصفوفة المصفوفة ·
Array Object كائن المصفوفة ·
Array Object Properties خصائص كائن المصفوفة o
Array Object Methods دوال كائن المصفوفة o
البرمجة بالجافا سكربت الجزء الثاني
18
Multidimensional Arrays المصفوفات ذات الأبعاد المتعددة
دعنا نقول أنه يوجد نوعین من المصفوفات أحدھما :
- ذات بعد واحد وھو ما كنا أشرنا إلیه سابقا كما بالمثال التالي
oceans[0] = "Atlantic";
oceans[1] = "Pacific";
oceans[2] = "Indian";
oceans[3] = " Arctic";
تمثل مصفوفة ذات بعد واحد oceans فالمصفوفة
أي أنه يمكن تمثیل عناصر المصفوفة علي شكل خطي كما بالشكل التالي
Atlantic Pacific Indian Arctic
- والأخري ذات أبعاد متعددة وھو ما سوف نتحدث عنه
أولا المصفوفة ذات الأبعاد المتعددة مثالا علي ذلك المصفوفة ثنائیة الأبعاد ، أي أنه يمكن تمثیل عناصر المصفوفة
علي شكل مستطیلي ، وأيضا المصفوفات ثلاثیة الأبعاد يمكن تمثیلھا في شكل مكعبي
ولن أطیل في ھذا الحديث لأنه للأسف لا توفر لنا لغة الجافا سكربت امكانیة عمل مصفوفة متعددة الأبعاد
ولكن أنتظر قلیلا فإنه يمكن التحايل علي ھذا الموضوع بعمل ما يسمي مصفوفة المصفوفة
Array of Array مصفوفة المصفوفة
وھي طريقة للتحايل لعمل مصفوفة Jagged Array مصفوفة المصفوفة أو ما تسمي أحیانا بمصفوفة الجاجد
متعددة الأبعاد .
وتكون فكرة عمل تلك المصفوفة معتمد علي أننا نقوم بعمل التالي :
- نقوم بإنشاء مصفوفة ذات بعد واحد كما تعلمنا سابقا
- ثم نقوم بملء عناصر تلك المصفوفة ، ولكن أنتظر قلیلا فأننا لن نقوم بملء عناصر المصفوفة بقیم من نوع
نصي أو رقمي كما كان بالسابق ، ولكننا سوف نجعل كل عنصر من عناصر تلك المصفوفة يشیر إلي
مصفوفة أخري ، وربما تكون المصفوفة المشارة إلیھا ذات بعد واحد أو مصفوفة من نوع مصفوفة المصفوفة
البرمجة بالجافا سكربت الجزء الثاني
19
دعنا نأخذ مثال عملي علي ذلك
ھب أننا نريد تمثیل مصفوفة لشركة لھا عدة فروع وكل فرع له الخصائص التالیة "الاسم" و "العنوان" و "نشاطه"
كما نري ھنا أننا نملك مصفوفة من الفروع ( لأن الشركة ربما يكون لھا أكثر من فرع ) ، إذا نقوم بعمل مصفوفة ذات
ولكن يأتي بعد ذلك كیفیة ملء عناصر تلك المصفوفة ، فكما تم ، CompBranches بعد واحد ونطلق علیھا مثلا
الأشارة سابقا أن كل فرع ( وھو ما يمثل عنصر بمصفوفة الفروع ) تمثل قیمته من خلال اسم الفرع وعنوانه ونشاطه
إذا نحتاج لعمل مصفوفة جديد تحمل بیانات الفرع ويكون طولھا ٣ كما يلي
var CompBranches = new Array(2);
CompBranches[0] = new Array(" ;("التجارة" , "القاهرة","الفرع الرئیسي
CompBranches[1] = new Array(" ;("المراجعة" , "الأسكندریة","فرع المنیرة
التي تعبر عن فروع الشركة كما يلي CompBranches كما نري فقد قمنا بتعريف المصفوفة
var CompBranches = new Array(2);
ثم قمنا بملء بیانات كل فرع علي حدي كما يلي
CompBranches[0] = new Array(" ;("التجارة" , "القاهرة","الفرع الرئیسي
CompBranches[1] = new Array(" ;("المراجعة" , "الأسكندریة","فرع المنیرة
كما يمكننا عمل المثال السابق بعدة طرق كما يلي
var CompBranches = new Array(2);
var branch1 = new Array(" ;("التجارة" , "القاهرة","الفرع الرئیسي
CompBranches[0] = branch1;
var branch2 = new Array(" ;("المراجعة" , "الأسكندریة","فرع المنیرة
CompBranches[1] = branch2;
أو كما يلي
var CompBranches = [ [" [ ["المراجعة" , "الأسكندریة","فرع المنیرة"] , ["التجارة" , "القاهرة","الفرع الرئیسي
أو كما يلي
var CompBranches = new Array(2);
var branch1 = new Array(3);
branch1[ ;"الفرع الرئیسي" = [ 0
branch1[ ;"القاهرة" = [ 1
branch1[ ;"التجارة" = [ 2
CompBranches[0] = branch1;
var branch2 = new Array(3);
البرمجة بالجافا سكربت الجزء الثاني
20
branch2[ ;"فرع المنیرة" = [ 0
branch2[ ;"الأسكندریة" = [ 1
branch2[ ;"المراجعة" = [ 2
CompBranches[1] = branch2;
أو كما يلي
var CompBranches = new Array(2);
CompBranches[0] = new Array(3);
CompBranches[0][ ;"الفرع الرئیسي" = [ 0
CompBranches[0][ ;"القاهرة" = [ 1
CompBranches[0][ ;"التجارة" = [ 2
CompBranches[1] = new Array(3);
CompBranches[1][ ;"فرع المنیرة" = [ 0
CompBranches[1][ ;"الأسكندریة" = [ 1
CompBranches[1][ ;"المراجعة" = [ 2
كما يلي Associative Array يمكننا إستخدام المصفوفة المجمعة
var CompBranches = new Array(2);
CompBranches[0] = new Array(3);
CompBranches[0]["name"] = " ;"الفرع الرئیسي
CompBranches[0]["address"] = " ;"القاهرة
CompBranches[0]["activity"] = " ;"التجارة
CompBranches[1] = new Array(3);
CompBranches[1]["name"] = " ;"فرع المنیرة
CompBranches[1]["address"] = " ;"الأسكندریة
CompBranches[1]["activity"] = " ;"المراجعة
for مثال لطباعة بیانات مصفوفة الفروع السابقة بإستخدام جملة






ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
22
for in مثال أخر لطباعة بیانات مصفوفة الفروع السابقة بإستخدام جملة






ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
23
Array Object كائن المصفوفة
دعنا نتحدث الأن عن الخصائص و الدوال الخاصة بكائن المصفوفة
Array Object Properties خصائص كائن المصفوفة
constructor الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة constructor سوف نتحدث عن الخاصیة
prototype الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة prototype سوف نتحدث عن الخاصیة
Inheritance والوراثة
البرمجة بالجافا سكربت الجزء الثاني
24
length الخاصیة
لحساب طول المصفوفة اي عدد عناصر المصفوفة length تستخدم الخاصیة
مثال
var arr = new Array("100","12","44");
alert( arr.length );
ويكون الناتج كما يلي
مثال






البرمجة بالجافا سكربت الجزء الثاني
25
ويكون الناتج كما يلي :
مثال
var arr = new Array("100","12","44");
alert( arr.length ); // طول المصفوفة یساوي ٣
إضافة عنصر جدید للمصفوفة //
arr[ arr.length ] = "200";
alert( arr.length ); // طول المصفوفة یساوي ٤
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
26
Array Object Methods دوال كائن المصفوفة
concat الدالة
تستخدم لدمج مصفوفتین في مصفوفة جديدة
الصیغة العامة
Array.concat( arrayObject );
مثال
var array1 = new Array(1,2,3);
var array2 = new Array("a","b","c");
var array3 = array1.concat( array2 );
alert( array3.length );
ويكون الناتج كما يلي
مثال




البرمجة بالجافا سكربت الجزء الثاني
27


ويكون الناتج كما يلي :
join الدالة
تستخدم لدمج قیم عناصر المصفوفة ، ويتم الدمج بین عناصر المصفوفة مع وضع فاصل بین قیم العناصر ويتم تحديد
ھذا الفاصل .
الصیغة العامة
Array.join( ;( الجملة الفاصلة
مثال
var arr = new Array("a","b","c");
var str = arr.join(",");
alert( str );
str = arr.join(" ");
alert( str );
str = arr.join("");
alert( str );
البرمجة بالجافا سكربت الجزء الثاني
28
بوضع العلامة الفاصلة "،" arr كما نلاحظ فقد تم دمج عناصر المصفوفة
ويكون الناتج كما يلي
unshift و shift و push و pop الدوال
تستخدم لإضافة عنصر جديد في أخر المصفوفة : push الدالة
تستخدم لحذف أخر عنصر من المصفوفة : pop الدالة
تستخدم لإضافة عنصر في أول المصفوفة : unshift الدالة
تستخدم لحذف أول عنصر من المصفوفة : shift الدالة
الصیغة العامة
Array.push( ;( قیمة العنصر الجدید
Array.pop();
Array.unshift( ;( قیمة العنصر الجدید
Array.shift();
البرمجة بالجافا سكربت الجزء الثاني
29
تستخدم لإضافة عنصر جديد في أخر المصفوفة : push الدالة
مثال
var arr = new Array("a","b","c");
arr.push( "d" );
alert( arr.length );
alert( arr[3] );
ويكون الناتج كما يلي
تستخدم لحذف أخر عنصر من المصفوفة : pop الدالة
مثال
var arr = new Array("a","b","c");
arr.pop();
alert( arr.length );
alert( arr[arr.length- عرض أخر عنصر بالمصفوفة // ;( [ 1
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
30
تستخدم لحذف أول عنصر من المصفوفة : shift الدالة
مثال
var arr = new Array("a","b","c");
arr.shift();
alert( arr.length );
alert( arr[ عرض أول عنصر بالمصفوفة // ;( [ 0
ويكون الناتج كما يلي
تستخدم لإضافة عنصر في أول المصفوفة : unshift الدالة
مثال
var arr = new Array("a","b","c");
arr.unshift( "x" );
alert( arr.length );
alert( arr[ عرض أول عنصر بالمصفوفة // ;( [ 0
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
31
مثال






ويكون الناتج كما يلي :
البرمجة بالجافا سكربت الجزء الثاني
32
reverse الدالة
تستخدم لعكس مواقع عناصر المصفوفة .
الصیغة العامة
Array.reverse();
مثال
var arr = new Array("a","b","c");
var arrReverse = arr.reverse();
alert( arrReverse.join(",") );
ويكون الناتج كما يلي
splice و slice الدالة
تستخدم كلتا الدالتان لإختزال عناصر المصفوفة .
slice الصیغة العامة للدالة
Array.slice( ;( موقع البدایة
أو
Array.slice( ;( موقع أخر عنصر – ١ , موقع البدایة
splice الصیغة العامة للدالة
Array.splice( ;( عدد العناصر , موقع البدایة
مثال
var arr1 = new Array("a" ,"b" ,"c" ,"d" ,"e" ,"f");
var arr2 = arr1.slice(2);
alert( arr2.join(",") );
البرمجة بالجافا سكربت الجزء الثاني
33
ويكون الناتج كما يلي
مثال
var arr1 = new Array("a" ,"b" ,"c" ,"d" ,"e" ,"f");
var arr2 = arr1.slice(2,4);
alert( arr2.join(",") );
var arr3 = arr1.splice(2,2);
alert( arr3.join(",") );
ويكون الناتج كما يلي
sort الدالة
تستخدم لترتیب عناصر المصفوفة .
الصیغة العامة
Array.sort();
أو
Array.sort( ;( الدالة الخاصة بالترتیب
البرمجة بالجافا سكربت الجزء الثاني
34
مثال
var arr1 = new Array("c", "a", "b");
var arr2 = arr1.sort();
alert( arr2.join(",") );
ويكون الناتج كما يلي
لاحظ المثال التالي
var arr1 = new Array(12, 5, 200, 80);
var arr2 = arr1.sort();
alert( arr2.join(",") );
ويكون الناتج كما يلي
كما تري لم يتم الترتیب بشكل صحیح ، لأنه تم ترتیب عناصر قیم المصفوفة علي أساس أنھا قیم نصیة
ولحل ھذة المشكلة يتم عمل دالة خاصة للترتیب كما يلي
مثال






ويكون الناتج كما يلي
toString و toLocaleString الدالة
تقوم كلتا الدالتین بدمج قیم عناصر المصفوفة في متغیر نصي بوضع فاصل بین القیم
يكون الفاصل المستخدم ھو "،" toString فعند إستخدام الدالة
كما يلي join وبذلك فإنھا تكافئ عمل الدالة
Array.join(",");
يكون الفاصل المستخدم ھو ";" toLocaleString أما عند إستخدام الدالة
كما يلي join وبذلك فإنھا تكافئ عمل الدالة
Array.join(";");
البرمجة بالجافا سكربت الجزء الثاني
36
الصیغة العامة
Array.toLocaleString();
Array.toString();
مثال
var arr1 = new Array("a", "b", "c");
var str = arr1.toLocaleString();
alert( str );
str = arr1.toString();
alert( str );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
37
الفصل الثالث
التعامل مع النصوص
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Simple String النصوص البسیطة ·
Concatenation دمج النصوص ·
parseInt الدالة ·
isNaN الدالة ·
parseFloat الدالة ·
علاج تداخل علامات التنصیص ·
Escaping Characters علامات الھروب أو العلامات الخاصة للكتابة ·
URL String Encoding and Decoding دوال تشفیر وفك تشفیر عناوين الأنترنت ·
escape الدالة o
unescape الدالة o
البرمجة بالجافا سكربت الجزء الثاني
38
كما كنا قد أشرنا سابقا بالجزء الأول من الكتاب في فصل المتغیرات أن لغة الجافا سكربت لیست من اللغات التي
يجعلھا تمیز بین المتغیرات "not strongly typed language" تمیز أنواع البیانات المخزنة بالمتغیرات يشكل قوي
الحرفیة والمتغیرات النصیة بشكل جید ، كما سنري ظھور بعض المشاكل عند إستخدام المتغیرات النصیة البسیطة
لذلك ظھرت الحاجة لإنشاء كائن نصي يكون مبني داخل لغة الجافا سكربت يوفر أسلوب تعامل صحیح مع المتغیرات
النصیة
Simple String النصوص البسیطة
ما ھو النص البسیط : يتكون النص من حرف أو أكثر وربما من رقم أو أكثر أو ربما يكون خلیط من حروف مع أرقام لكن
بشرط أن يتم وضع ھذه الحروف بین علامتین تنصیص كما يلي
var str = " ;"مرحبا بكم
أو بین علامتین تنصیص فردي كما يلي
var str = ' ;'مرحبا بكم
Empty لاحظ أيضا أن المتغیر النصي ربما لا يحتوي علي اي حروف أو أرقام وھو ما يسمي بالمتغیر النصي الفارغ
كما يلي String
var str = "";
Concatenation دمج النصوص
تعتبر عملیة دمج النصوص من العملیات الھامة عند القیام بإنشاء صفحات للويب
ويتم دمج النصوص بإستخدام المعامل + أو المعامل =+ كما يلي
var str = "";
str += "";
str += "";
str += "";
مثال
var str ;"أنت هنا معنا" = 1
var str ;"بالجزء الثاني" = 2
var str3 = str1 + " " + str2;
alert( str3 );
البرمجة بالجافا سكربت الجزء الثاني
39
ويكون الناتج كما يلي
مثال
var str1 = "2";
var str2 = 3;
var str3 = str1 + str2;
alert( str3 );
ويكون الناتج كما يلي
قیمة نصیة بالرغم من أنھا لم يتم وضعھا بین علامتین تنصیص وكان str لاحظ معي أنه تم إعتبار قیمة المتغیر 2
. المتوقع أن يكون ناتج الجمع ھو ٥
كما بالمثال التالي parseFloat أو الدالة parseInt ولعلاج ھذة المشكلة يتم إستخدام الدالة
مثال
في ھذا المثال نطلب من المستخدم إدخال رقمین ، ثم نقوم بإظھار حاصل جمعھم






ويكون الناتج عند إدخال الرقم الأول بالقیمة ٤ والرقم الثاني بالقیمة ٨ ، فیكون ناتج الجمع ھو ١٢ كما يلي
parseInt الدالة
تستخدم لتحويل القیم النصیة إلي قیم عددية صحیحة ( اي أنھا تتعامل مع الأعداد الصحیحة ولیست مع الأعداد
النسبیة ) .
إلي قیمة عددية يمكننا prompt كما رأينا بالمثال السابق أننا قمنا بتحويل القیمة النصیة الراجعة من الدالة
إستخدامھا في العملیات الحسابیة بشكل صحیح
الصیغة العامة
parseInt( ;( القیمة النصیة المراد تحویلها
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة عددية صحیحة
مثال
var num = parseInt( "23" );
alert( num );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
41
مثال
var num = parseInt( "23.43" );
alert( num );
ويكون الناتج كما يلي
integer Number تقوم بالتحويل القیم النصیة إلي قیم عددية صحیحة parseInt لاحظ أن الدالة
لاحظ معي ھذه الحالة
إذا قمنا بتمرير قیمة نصیة للدالة ولكن ھذه القیمة لا تمثل عدد كما يلي
parseInt( "h23" );
ويكون الناتج كما يلي
اي أن القیمة الممرة لھا لیست Not a Numeric وھي إختصار للجملة التالیة NaN فقد قامت الدالة بإرجاع القیمة
. isNaN قیمة عددية ولتفادي ھذه الحالة يمكننا إستخدام الدالة
isNaN الدالة
تستخدم للتأكد من حالة القیمة الممررة لھا ھل ھي قیمة عددية أم لا
اي ھل القیمة الممررة لیست قیمة عددية is Not a Number ھي إختصار للجملة التالیة isNaN وكلمة
الصیغة العامة
isNaN( ;( القیمة
البرمجة بالجافا سكربت الجزء الثاني
42
false أو true القیمة الراجعة من ھذه الدالة : تقوم بإرجاع قیمة من النوع البولیني اي إحدي القیمتین
مثال
alert( isNaN("1.3") );
ويكون الناتج كما يلي
parseFloat الدالة
تستخدم لتحويل القیم النصیة إلي قیم عددية نسبیة ( اي أنھا تتعامل مع الأعداد الصحیحة و الأعداد النسبیة ) .
الصیغة العامة
parseFloat( ;( القیمة النصیة المراد تحویلها
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة عددية نسبیة
مثال
var num = parseFloat( "23.32" );
alert( num );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
43
علاج تداخل علامات التنصیص
كما ذكرنا سابقا أن النص ھو عبارات وجمل يتم كتابتھا بین علامتین تنصیص ""
علي سبیل المثال نريد عمل نص به عبارة أنا من محبي لغة الجافا سكربت سوف نقوم بوضعھا بین علامتین
التنصیص كما يلي " أنا من محبي لغة الجافا سكربت " وبذلك يستطیع مفسر اللغة تمیز أن ھذه الكلمات تابعة
لنص واحد .
إذا إين المشكلة ومتي تظھر نعم أنت علي حق لا توجد مشكلة ھنا إلا إذا حدث التالي
تخیل معي أن نص الجملة يحتوي علامة تنصیص أو أكثر
علي سبیل المثال أنك تريد كتابة الجملة التالیة (ھل ھناك "مشكلة" يا رجل ؟) كما تري أننا الأن في مأزق لأننا
لو وضعنا ھذة الجملة بین علامتیین تنصیص سوف يحدث تداخل في علامات التنصیص وسوف يؤدي ھذا إلي إرتباك
. syntax error لمفسر اللغة مما ينتج عنه خطأ لغوي
الأن ما الحل ؟
ربما يتبادر إلي ذھنك الھرب من المشكلة وتقول أنا لست في حاجة لإظھار علامات التنصیص في الجملة وسوف
أجعل الجملة بدونھما كما ھو حالنا نحن العرب ولكن دائما تأتي الحلول لتفادي الأخطاء وتجنبھا ولیس الھرب
منھا ، أعتقد أنه تبادر إلیك الأن أن ھذه المشكلة لھا حل ابشرك بقولي نعم
. Escaping Characters حیث توفر لنا لغة الجافا سكربت علامات الھروب
Escaping Characters علامات الھروب أو العلامات الخاصة للكتابة
تمكنك من تضمین بعض الحروف التي يصعب كتابتھا في محتوي النصوص ومنھا التالي :
'\ تمكنك من إضافة علامه التنصیص الفردیة بداخل النص
"\ تمكنك من إضافة علامه التنصیص بداخل النص
Carriage تمكنك من إدخال حرف خاص لعمل ما یسمي \r
اي تراجع موشر الكتابه إلي بدایة السطر مما return
ینتج عنه في بعض الأحیان عمل سطر جدید
تمكنك من عمل سطر جدید داخل النص \n
Tab تمكنك من إدخال الحرف \t
بعد التعرف السريع لعلامات الھروب كیف يمكننا حل مشكلة كتابة النص السابق (ھل ھناك "مشكلة" يا رجل ؟ )
بكل يسر يتم إستبدال اي علامة تنصیص (") بعلامة الھروب ("\) ويكون النص كالتالي
(هل هناك \"مشكلة\" یا رجل ؟ )
البرمجة بالجافا سكربت الجزء الثاني
44
مثال تطبیقي لكتابة الرسالة التالیة :
نتمنا لك یا قارئنا "العزیز" أن تكون قد
تعلمت ما سبق من قول وان تحرص علي ما هو أت






ويكون الناتج كالتالي
البرمجة بالجافا سكربت الجزء الثاني
45
URL String Encoding and Decoding دوال تشفیر وفك تشفیر عناوين الأنترنت
أحیانا عندما نقوم بإرسال عنوان لاحدي المواقع ، بأن نقوم علي سبیل المثال بكتابة العنوان التالي
فعند Address Bar في شريط العنوان بالمتصفح "http://www.islamway.com/index.php?action=all news"
تلقائیا اي يتم تحويل العلامات الخاصة إلي ما يقابلھا في url يتم تشفیر عنوان الموقع go الضغط علي زرار ذھاب
ويكون العنوان الناتج كما يلي ASCII النظام الستعشري بنظام التشفیر الأسكي
و all لاحظ أن حرف المسافة بین الكلمتین " http://www.islamway.com/index.php?action=all%20news"
تم إستبدالھا بالرمز التالي " 20 %" والرقم ٢٠ ھو الرقم الستعشري في نظام التشفیر الأسكي news الكلمة
المقابل لحرف المسافة .
لكن أحیانا نقوم نحن بإستخدام أحدي الدوال لعمل إرسال لعنوان موقع من خلال كود الجافا سكربت وبذلك فنحن
. unescape و escape في عرضة لعدم تشفیر بیانات عنوان الموقع المرسل لذلك نحتاج إلي كلتا الدالتین
escape الدالة
أو اي نص ( لیس بالضرورة أن يكون عنوان لموقع ) url تستخدم لتشفیر العلامات الخاصة الموجودة بعنوان الموقع
مضافا إلیة العلامة % . ASCII إلي ما يقابلھا في النظام الستعشري بنظام التشفیر الأسكي
الصیغة العامة
escape( ;( عنوان الموقع المراد تشفیره
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة نصیة
مثال
var siteURL = "http://www.islamway.com/index.php?action=all news";
var codedSiteURL = escape( siteURL );
alert( codedSiteURL );
ويكون الناتج كالتالي
وكما تري فقد تغیر عنوان الموقع إلي عنوان خطأ لأنه تم تشفیر كل العنوان ، ولكننا دائما ما نحتاج إلي تشفیر
البیانات المرسلة فقط كما يلي
البرمجة بالجافا سكربت الجزء الثاني
46
مثال
var siteURL = "http://www.islamway.com/index.php?action=";
var codedSiteURL = siteURL + escape( "all news" );
alert( codedSiteURL );
ويكون الناتج كالتالي
unescape الدالة
أو اي نص ( لیس بالضرورة أن يكون عنوان لموقع url تستخدم لفك تشفیر العلامات الخاصة الموجودة بعنوان الموقع
. escape ) إي عكس ما تقوم به الدالة
الصیغة العامة
unescape( ;( عنوان الموقع المراد فك تشفیره
القیمة الراجعة من ھذه الدالة : بعد عملیة التحويل يتم إرجاع قیمة نصیة
مثال
تشفیر النص //
var siteURL = "http://www.islamway.com/index.php?action=";
var codedSiteURL = siteURL + escape( "all news" );
فك تشفیر النص //
var UnCodedSiteURL = unescape(codedSiteURL);
alert( UnCodedSiteURL );
ويكون الناتج كالتالي
البرمجة بالجافا سكربت الجزء الثاني
47
الفصل الرابع
كائن النصوص
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
String Object كائن النصوص ·
إنشاء كائن نصي ·
String Object Properties خصائص كائن النصوص ·
String Object Methods دوال كائن النصوص ·
parsing Methods الدوال الخاصة بالتعامل مع النصوص o
Formatting Methods الدوال الخاصة بتنسیق النص o
البرمجة بالجافا سكربت الجزء الثاني
48
String Object كائن النصوص
إنشاء كائن نصي
يمكننا إنشاء الكائن النصي بعدة طرق كما يلي
String ١- إنشاء كائن نصي بإستخدام الكائن
var str = new String();
أو
var str = new String(" ;("النص
String ٢- لاحظ أن النص البسیط يمكن إستخدامه مثل المتغیر الناشئ من الكائن
var literalStr = " ;"مرحبا بالنصوص
يوفر لنا الكائن النصي العديد من الخصائص والدوال المھمة ، لذلك دعنا نتحدث الأن عن الخصائص و الدوال الخاصة
بكائن النصوص
String Object Properties خصائص كائن النصوص
constructor الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة constructor سوف نتحدث عن الخاصیة
prototype الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة prototype سوف نتحدث عن الخاصیة
Inheritance والوراثة
length الخاصیة
لحساب طول النص اي عدد الحروف المكونة لھذا النص length تستخدم الخاصیة
مثال
var strObject = new String(" ;("الكائن النصي
alert( strObject.length );
البرمجة بالجافا سكربت الجزء الثاني
49
أو كما يلي
var strObject = new String();
strObject = " ;"الكائن النصي
alert( strObject.length );
ويكون الناتج كما يلي
مثال
var str = " ;"المتغیر النصي البسیط
alert( str.length );
أو كما يلي
alert( " المتغیر النصي البسیط ".length );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
50
String Object Methods دوال كائن النصوص
سوف نقسم دوال الكائن النصي إلي قسمین أحدھما للتعامل مع تقطیع النصوص والأخر لتغیر نسق النص من لون
وسمك ألخ عند كتابة تلك النص في المتصفح
parsing Methods الدوال الخاصة بالتعامل مع النصوص
charAt الدالة
تستخدم لقراءة حرف واحد في موقع معین من النص
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.charAt( ;( موقع الحرف
مثال
var str = new String();
str = " ;"لا اله إلا الله محمد رسول الله
alert( " : الحرف الذي یقع عند الموقع الثاني " + str.charAt(1) );
var char = str.charAt(7);
alert( " : الحرف الذي یقع عند الموقع الثامن " + char );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
51
تمرين
نريد عكس نص يتم إستقباله من المستخدم






كما يلي olleh ھو hello ويكون الناتج عند إدخال القیمة
البرمجة بالجافا سكربت الجزء الثاني
52
fromCharCode و charCodeAt الدوال
charCodeAt الدالة
تستخدم لقراءة حرف واحد في موقع معین من النص ولكن تقوم بإرجاع القیمة العددية بنظام التشفیر الأسكي
لھذا الحرف ASCII
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
String.charCodeAt( ;( موقع الحرف
أو
String.charCodeAt();
مثال
"abc".charCodeAt(); // 97 : ینتج عنه القیمة
"abc".charCodeAt( 97 : ینتج عنه القیمة // ;( 0
"abc".charCodeAt( 98 : ینتج عنه القیمة // ;( 1
fromCharCode الدالة
إلي ما يقابلھا من حروف ASCII تستخدم لتحويل قیمة عددية أو أكثر بنظام الأسكي
charCodeAt اي أنھا تقوم بعكس وظیفة الدالة
القیمة الراجعة : تقوم بإرجاع قیمة نصیة مكونة من حرف أو أكثر
الصیغة العامة
String.fromCharCode ( ;( القیمة العددیة
أو
String.fromCharCode( ;( أكثر من قیمة عددیة
مثال
String.fromCharCode( ینتج عنه القیمة // ;( 97 : a
String.fromCharCode(97, 98 , ینتج عنه القیمة // ;( 99 : abc
البرمجة بالجافا سكربت الجزء الثاني
53
concat الدالة
تستخدم لدمج قیمة نصیة بقیمة نصیة أخري
القیمة الراجعة : تقوم بإرجاع قیمة نصیة مكونة ناتج دمج نصین
الصیغة العامة
String.concat( ;( القیمة النصیة
مثال
"abc".concat("def"); // ینتج عنه القیمة : abcdef
lastIndexOf و indexOf الدوال
indexOf الدالة
تستخدم للبحث عن موقع نص داخل نص أخر ، ويبدأ البحث من أول حرف بالنص الذي يتم البحث فیه
القیمة الراجعة : تقوم بإرجاع قیمة عددية تعبر عن موقع النص الذي يتم البحث عنه داخل النص المبحوث فبه
الصیغة العامة
String.indexOf( ;( القیمة النصیة المراد البحث عنها
أو
String.indexOf( ;(موقع بدایة البحث , القیمة النصیة المراد البحث عنها
مثال
"abc".indexOf("b"); // 1 : ینتج عنه القیمة
"abc".indexOf("c"); // 2 : ینتج عنه القیمة
"abc".indexOf("bd"); // -1 : ینتج عنه القیمة
"abc".indexOf("g"); // -1 : ینتج عنه القیمة
"abc".indexOf("b" , 1 : ینتج عنه القیمة // ;( 1
"abc".indexOf("b" , -1 : ینتج عنه القیمة // ;( 2
كما نري إذا لم يتم العثور علي النص يتم إرجاع القیمة - ١
البرمجة بالجافا سكربت الجزء الثاني
54
تمرين
نريد التأكد من صحة قیمة بريد إلیكتروني يتم إستقباله من المستخدم
مع العلم أن البريد الألیكتروني يتمیز بوجود الرمز @






وسوف نري بالفصل القادم "التعامل مع التعبیرات المنتظمة" كیف يتم التأكد من البريد الإلیكتروني بشكل أكثر دقة
lastIndexOf الدالة
تستخدم للبحث عن موقع نص داخل نص أخر ، ويبدأ البحث من أخر حرف بالنص الذي يتم البحث فیه ، وھي
. indexOf بذلك تتشابه إلي حد ما مع الدالة
القیمة الراجعة : تقوم بإرجاع قیمة عددية تعبر عن موقع النص الذي يتم البحث عنه داخل النص المبحوث فبه
الصیغة العامة
String.lastIndexOf( ;( القیمة النصیة المراد البحث عنها
أو
String.lastIndexOf( ;(موقع بدایة البحث , القیمة النصیة المراد البحث عنها
البرمجة بالجافا سكربت الجزء الثاني
55
مثال
"abcdef".lastIndexOf("b"); // 1 : ینتج عنه القیمة
"abcdef".lastIndexOf("c"); // 2 : ینتج عنه القیمة
"abcdef".lastIndexOf("bd"); // -1 : ینتج عنه القیمة
"abcdef".lastIndexOf("g"); // -1 : ینتج عنه القیمة
"abcdef".lastIndexOf("b" , 1 : ینتج عنه القیمة // ;( 1
"abcdef".lastIndexOf("b" , 1 : ینتج عنه القیمة // ;( 2
search و replace و match الدوال
سوف يتم مناقشتھم في الفصل القادم "التعامل مع التعبیرات المنتظمة"
substring و substr و slice الدوال
substring و slice الدالة
تستخدم لإستخلاص جزء من النص بدون أن تؤثر علي النص الأساسي
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.slice( ;( موقع البدایة
String.substring( ;( موقع البدایة
أو
String.slice( ;(موقع النهایة , موقع البدایة
String.substring ( ;(موقع النهایة , موقع البدایة
مثال
"abcdef".substring( ینتج عنه القیمة // ;( 1 : bcdef
"abcdef".substring( ینتج عنه القیمة // ;( 1,3 : bc
البرمجة بالجافا سكربت الجزء الثاني
56
لاجظ التالي
مثال
"abcdef".substring(2, - ینتج عنه القیمة // ;( 1 : ab
قیمة سالبة يتم البحث من نھاية موقع البداية فكما slice أو substring لأنه عندما يكون موقع النھاية الممرر للدالة
ثم تم البحث لقیمة موقع النھاية بقیمة سالبة تساوي c بالمثال السابق كان موقع البداية ھو ٢ اي ما يكافئ الحرف
. b ١ اي أنه ستتم عملیة إختزال النص في أتجاه الیسار إبتدأ من الحرف موقع الحرف –
substr الدالة
مع وجود فارق substring تستخدم لإستخلاص جزء من النص بدون أن تؤثر علي النص الأساسي ، كما تفعل الدالة
يعبر عن عدد الحروف المختزلة أو طول النص الناتج ، بینما يعبر عن موقع substr أن المعامل الثاني الممرر للدالة
. substring النھاية بالنسبة للدالة
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.substr( ;( موقع البدایة
أو
String.substr ( ;( طول النص , موقع البدایة
مثال
"abcdef".substr( ینتج عنه القیمة // ;( 1 : bcdef
"abcdef".substr( ینتج عنه القیمة // ;( 1,3 : bcd
تمرين
نريد إستخلاص اسم المستخدم وسم مزود خدمة البريد الإلیكتروني لقیمة بريد إلیكتروني يتم إستقباله من
المستخدم
مع العلم أن اسم المستخدم يسبق موقع الرمز @ و اسم مزود الخدمة يلي الرمز @ فعلي سبیل المثال
a_elhussein@hotmail.com إذا كان البريد الإلیكتروني المدخل ھو
a_elhussein يكون اسم المستخدم
hotmail ويكون اسم المزود
البرمجة بالجافا سكربت الجزء الثاني
57






split الدالة
تستخدم لتقطیع النص إستنادا علي جملة التقطیع الممررة لھا ، ثم تقوم بوضع الجمل المقطعة في مصفوفة ذات
بعد واحد .
القیمة الراجعة : تقوم بإرجاع مصفوفة تحمل الجمل المقطعة
الصیغة العامة
String.split( ;( الجملة المراد التقطیع بها
أو
String.split( ;(طول المصفوفة الناتج , الجملة المراد التقطیع بها
البرمجة بالجافا سكربت الجزء الثاني
58
مثال
"abcdef".split("cd");
ينتج عنھا المصفوفة التالیة
Arr[0] ----------à ab
Arr[1] ----------à ef
مثال
var arr = "abcdef".split("cd");
alert( arr.toString() );
ويكون الناتج كما يلي
مثال
var arr = "abcdef".split("cd", 1);
alert( arr.toString() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
59
toUpperCase و toLowerCase الدالة
small letters لتحويل حالة الحروف بالنص إلي حروف صغیرة toLowerCase تستخدم الدالة
. capital letters لتحويل حالة الحروف بالنص إلي حروف كبیرة toUpperCase وعلي العكس تستخدم الدالة
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.toLowerCase();
String.toUpperCase();
مثال
"abcdef".toUpperCase(); // ینتج عنه القیمة : ABCDEF
"AbcDef".toLowerCase(); // ینتج عنه القیمة : abcdef
valueOf و toString الدالة
تستخدم لعرض قیمة النص
القیمة الراجعة : تقوم بإرجاع قیمة نصیة
الصیغة العامة
String.toString);
String.valueOf();
مثال
"abcdef".toString(); // ینتج عنه القیمة : abcdef
"abcdef".valueOf(); // ینتج عنه القیمة : abcdef
البرمجة بالجافا سكربت الجزء الثاني
60
Formatting Methods الدوال الخاصة بتنسیق النص
تستخدم لتغیر نسق النص
الدالة الوصف
تعمل التالي anchor( name)

blink()
تعمل التالي
<>…
تعمل التالي bold()
<>…
تعمل التالي fixed()

تعمل التالي Fontcolor(colorValue)

تعمل التالي Fontsize(size)

تعمل التالي Italics()

تعمل التالي link( url)

تعمل التالي big()

تعمل التالي small()

strike()
تعمل التالي

sub()
تعمل التالي

sup()
تعمل التالي

تمرين
نريد إستخلاص الكلمات التالیة "محمد" و "صحبه" و "عن" من النص التالي
"الحمد لله ماحمده الحامدون وغفل عن حمده الغافلون والصلاة والسلام على عبد ه ورسوله محمد صلاة بعدد ذرات
الخلائق وما يكون . ورضاك اللھم عن آله الطیبین وصحبه المكرمین المبجلین أجمعین وبعد" وتلوينھا باللون
البرمجة بالجافا سكربت الجزء الثاني
61
الأحمر






البرمجة بالجافا سكربت الجزء الثاني
62
البرمجة بالجافا سكربت الجزء الثاني
63
الفصل الخامس
التعامل مع التعبيرات المنتظمة
Regular Expressions
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Regular Expressions ما ھي التعبیرات المنتظمة ·
طريقة كتابة التعبیرات المنتظمة ·
patterns الأنماط o
Grouping المجموعات o
إستخدام كائن النصوص مع الأنماط ·
RegExp كائن التعبیرات المنتظمة ·
البرمجة بالجافا سكربت الجزء الثاني
64
Regular Expressions ما ھي التعبیرات المنتظمة
يمكننا القول بأن التعبیرات المنتظمة ھو أسلوب متقدم للتعامل مع النصوص ، لتوفیر الوقت والمجھود المبذول عند
التعامل مع النصوص كما رأينا بالفصل الثاني الخاص بالتعامل مع النصوص من تقطیع و معاينة موقع جملة معینة بنص
ما .
البیرل ، فلن يجد إختلاف في طريقة إستخدام التعبیرات الخاصة بلغة الجافا سكربت perl ولمن يبرمج بلغة مثل لغة
عما تعلمه بلغة البیرل .
توفر أيضا التعبیرات الخاصة أسلوب قوي للتعامل مع النصوص ، مع القدرة العالیة لتقطیع النصوص وإستبدال نص بنص
أخر وكثیر من المھام الأخري .
Regular Expressions طريقة كتابة التعبیرات المنتظمة
وسوف نتحدث grouping و عمل المجموعات patterns يمكننا كتابة التعبیرات المنتظمة بناء علي ما يسمي بالأنماط
عن كل عنصر علي حدي
patterns الأنماط
تنقسم الأنماط إلي نوعین أنماط بسیطة و أخري مركبة
الأنماط البسیطة
أمثلة علي الأنماط البسیطة
var pattern = / /;
فھذا النمط يعبر عن الحرف "مسافة" وفیما بعد سوف نري كیفیة إستخدام ھذا النمط لإجراء عملیات البحث و
الإستبدال
var pattern = /hello/;
"hello" فھذا النمط يعبر عن الكلمة
var pattern = /hello patterns/;
"hello patterns" فھذا النمط يعبر عن الجملة
var pattern = /web/i;
الذي يجعل عملیات البحث والإستبدال القائمة علي ھذا النمط لا تتأثر بحالة الحروف كبیرة أم i لاحظ وجود الحرف
Case Insensitive ھو إختصار لي i صغیرة ، وحرف
وھكذا . "weB" أو "Web" أو "web" أو "WEB" لذلك ھذا النمط يعبر عن كلمة
البرمجة بالجافا سكربت الجزء الثاني
65
var pattern = /web/g;
الذي يجعل عملیات البحث والإستبدال القائمة علي ھذا النمط تتم علي كل النص ولا تتوقف g لاحظ وجود الحرف
global ھو إختصار لي g بمجرد أن يتم توافق النمط مع جزء من النص ، وحرف
فقط ولكن يتم البحث عنھا في كل النص بدون توقف . "web" لذلك ھذا النمط يعبر عن كلمة
كما يلي g و i ويمكننا دمج الرمزين
var pattern = /web/gi;
الأنماط المركبة
تمكننا الأنماط المركبة من إجراء تعبیرات أكثر قوة ، ومثل علي ذلك تمكننا الأنماط المركبة من عمل التالي
إستخدام الرموز الخاصة بالتكرار
الرمز الوصف
. تعبر عن حرف واحد
? تعبر عن وجود حرف واحد علي الأكثر ، اي ربما تعبر عن
عدم وجود اي حرف
* تعبر عن وجود حرف أو أكثر أو لا شئ
+ تعبر عن وجود حرف أو أكثر
مثال
var pattern = /w.eb/;
وھكذا "Wbeb" أو "waeb" لاحظ وجود الحرف "." داخل نص النمط ، لذلك ھذا النمط يعبر عن كلمة
لأن الحرف "." يعبر عن وجود حرف واحد بدون تحديد لھذا الحرف. "web" ولا يعبر عن
مثال
var pattern = /c.t/;
"category" ولا عن "ct" وھكذا ولا يعبر عن "cut" أو "cat" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /w?eb/;
وھكذا "Wbeb" أو "waeb" لاحظ وجود الحرف "?" داخل نص النمط ، لذلك ھذا النمط يعبر عن كلمة
لأن الحرف "?" يعبر عن وجود حرف واحد بدون تحديد لھذا الحرف وربما يعبر عن لا شئ. "web" و أيضا يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
66
مثال
var pattern = /c*t/;
"category" ولا يعبر عن "coot" و "ct" و "cut" و "cat" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c*t*/;
"category" و "coot" و "ct" و "cut" و "cat" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c+t/;
"category" أو "ct" ولا يعبر عن "coot" و "cut" و "cat" ھذا النمط يمكن أن يعبر عن
إستخدام رموز البداية والنھاية الخاصة
الرمز الوصف
^ تعبر عن أن عند إجراء عملیة تماثل النص مع النمط يجب
أن يتكافئ النمط مع بداية النص
$ تعبر عن أن عند إجراء عملیة تماثل النص مع النمط يجب
أن يتكافئ النمط مع نھاية النص
مثال
var pattern = /^web/;
لأننا "this is a web" ولا يعبر عن "web" لاحظ وجود الحرف "^" بالنمط ، لذلك ھذا النمط يمكن أن يعبر عن
في أول النص . web أشترطنا في ھذا النمط أن تأتي كلمة
مثال
var pattern = /web$/;
لأننا أشترطنا في ھذا "this is a web" أو "web" لاحظ وجود الحرف "$" بالنمط ، لذلك ھذا النمط يمكن أن يعبر عن
."is web , good" في أخر النص ، لذلك ھذا النمط لا يعبر عن web النمط أن تأتي كلمة
البرمجة بالجافا سكربت الجزء الثاني
67
مثال
var pattern = /^web$/;
فقط . "web" لاحظ وجود الحرفین "^" و "$" بالنمط ، لذلك ھذا النمط يمكن أن يعبر عن
إستخدام رموز التكرار العددية
الرمز الوصف
تعبر عن أن يجب تكرار الحرف السابق له عدد من المرات {n}
n يساوي
تعبر عن أن يجب تكرار الحرف السابق له عدد من المرات {n,m}
m إلي القیمة n يساوي من القیمة
تعبر عن أن يجب تكرار الحرف السابق له عدد من المرات {n,}
إلي مالانھاية n يساوي من القیمة
مثال
var pattern = /c{2}t/;
"ct" ولا عن "cat" ولا يعبر عن "cct" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c{1,2}t/;
"cat" ولا يعبر عن "ct" أو "cct" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c{2,}t/;
"ct" ولا عن "cat" ولا يعبر عن "ccccct" أو "cct" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /c.t{2}.{2}/;
"cutter" أو "cotton" ھذا النمط يمكن أن يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
68
لاحظ الحالات التالیة
الحالة الأولي
var pattern = /a?/;
يكافئ
var pattern = /a{0,1}/;
الحالة الثانیة
var pattern = /a./;
يكافئ
var pattern = /a{1}/;
الحالة الثالثة
var pattern = /a*/;
يكافئ
var pattern = /a{0,}/;
الحالة الرابعة
var pattern = /a+/;
يكافئ
var pattern = /a{1,}/;
range إستخدام رموز المدي
الرمز الوصف
[ ] تعبر عن أنه يتم البحث في المدي المحدد
[ ^] تعبر عن أنه يتم البحث في عكس المدي المحدد
مثال
var pattern = /[a-z]/;
z و a يقع بین الحرفین small letter ھذا النمط يمكن أن يعبر عن اي حرف صغیر
مثال
var pattern = /[a-z]+/;
"HELLO" ولا يعبر عن "hello" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /[^a-z]+/;
"hello" ولا يعبر عن "HELLO" ھذا النمط يمكن أن يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
69
بعض الأنماط المفیدة
النمط التالي يعبر عن جمیع الحروف التي يمكن كتابتھا بجمیع الحالات (صغیرة أو كبیرة)
var pattern = /[a-zA-Z]/;
النمط التالي لا يعبر عن جمیع الحروف التي يمكن كتابتھا بجمیع الحالات (صغیرة أو كبیرة)
var pattern = /[^a-zA-Z]/;
النمط التالي يعبر عن جمیع الأعداد من صفر إلي ٩
var pattern = /[0-9]/;
النمط التالي لا يعبر عن جمیع الأعداد من صفر إلي ٩
var pattern = /[^0-9]/;
النمط التالي يعبر عن جمیع الأعداد من صفر إلي ٩ وجمیع الحروف المكتوبة
var pattern = /[a-zA-Z0-9]/;
مثال
var pattern = /^[0-9]web/;
"2web" ھذا النمط يمكن أن يعبر عن
مثال
var pattern = /^[^0-9]web/;
"2web" ولا يعبر عن "aweb" ھذا النمط يمكن أن يعبر عن
إستخدام الرموز الخاصة
الرمز الوصف
تعبر عن الأرقام من صفر إلي ٩ \d
[0- اي أنھا تكافئ النمط التالي [ 9
لا تعبر عن الأرقام من صفر إلي ٩ \D
[^0- اي أنھا تكافئ النمط التالي [ 9
تعبر عن جمیع الرموز التي يمكن كتابتھا كالأرقام من \w
أو عن الحرف _ أو z إلي a صفر إلي ٩ أو عن الحروف من
underscore ما يسمي بالأندرسكور
[a-zA-Z0- اي أنھا تكافئ النمط التالي [_ 9
لا تعبر عن جمیع الرموز التي يمكن كتابتھا كالأرقام من \W
أو عن الحرف _ أو z إلي a صفر إلي ٩ أو عن الحروف من
underscore ما يسمي بالأندرسكور
البرمجة بالجافا سكربت الجزء الثاني
70
[^a-zA-Z0- اي أنھا تكافئ النمط التالي [_ 9
تعبر عن جمیع الرموز الخاصة التي يصعب كتابه بعضھا \s
\n والسطر الجديد tab مثل حرف المسافة والتاب
\f و \r والرموز التالیة
لا تعبر عن جمیع الرموز الخاصة التي يصعب كتابه بعضھا \S
\n والسطر الجديد tab مثل حرف المسافة والتاب
\f و \r والرموز التالیة
تعبر عن أن النمط يجب أن يتواجد في أول الكلمة فقط \b
ولا organ يعبر عن /\bor/ علي سبیل المثال النمط
normal يعبر عن
perform ولا يعبر عن traitor يعبر عن /or\b/ والنمط
لا تعبر عن أن النمط يجب أن يتواجد في أول الكلمة فقط \B
organ لا يعبر عن /\Bor/ علي سبیل المثال النمط
normal ولكن يعبر عن
الرمز الوصف
\\ تعبر عن الحرف \
tab تعبر عن الحرف \t
.\ تعبر عن الحرف .
?\ تعبر عن الحرف ?
+\ تعبر عن الحرف +
*\ تعبر عن الحرف *
^\ تعبر عن الحرف ^
$\ تعبر عن الحرف $
Grouping المجموعات
$ تستخدم لتجمیع نواتج البحث في مجموعات يتم تخزينھا في مصفوفة أو في متغیرات تبدأ بالرمز $ كالمتغیر 1$ و 2
ولعمل مجموعات يتم إستخدام الرمز الأقواس التالیة () أو العلامة التالیة كما يلي
مثال
var pattern = /^([0-9])(web)/;
web 0] والأخري للنمط - سوف يتم وضع نتائج البحث علي ھذا النمط في مجموعات أحدھما للنمط [ 9
مثال
var pattern = /webcat/;
وھذا النمط ، web والأخري للنمط cat سوف يتم وضع نتائج البحث علي ھذا النمط في مجموعات أحدھما للنمط
"web" أو "cat" يمكن أن يعبر عن
البرمجة بالجافا سكربت الجزء الثاني
71
إستخدام كائن النصوص مع الأنماط
بعدما تعلمنا طريقة كتابة الأنماط ، حان الوقت لمعرفة طريقة تطبیقھا
لذلك سوف نعتمد علي بعض دوال الكائن النصي لتطبیق الأنماط وھي كما يلي
match الدالة
تستخدم للبحث عن نمط معین بداخل النص ، ثم تقوم بإرجاع مصفوفة بھا نواتج البحث
القیمة الراجعة : تقوم بإرجاع مصفوفة
الصیغة العامة
String.match( ;( النمط
مثال
var str = new String();
str = "hello mr hello";
var arrResult = new Array();
var pattern = /hello/;
arrResult = str.match( pattern );
alert( " عدد مرات التواجد : " + arrResult.length );
ويكون الناتج كما يلي
مرتین لكن ناتج البحث كان مرة واحدة ، وھذا صحیح لأن النمط المستخدم hello مع أنا النص يحتوي علي كلمة
يتوقف بعد حدوث تماثل له مع النص الذي يتم البحث فیه ، لذلك لإجراء البحث علي جمیع النص يتم إستبدال النمط
السابق بالنمط التالي كما يلي
البرمجة بالجافا سكربت الجزء الثاني
72
مثال
var str = new String();
str = "hello mr hello";
var arrResult = new Array();
var pattern = /hello/g;
arrResult = str.match( pattern );
alert( " عدد مرات التواجد : " + arrResult.length );
ويكون الناتج كما يلي
تمرين
نريد التأكد من صحة البريد الإلیكتروني الذي يتم إستقباله من المستخدم






البرمجة بالجافا سكربت الجزء الثاني
73
تمرين
نريد إستخلاص اسم المستخدم واسم مزود خدمة البريد الإلیكتروني لقیمة بريد إلیكتروني يتم إستقباله من
المستخدم
مع العلم أن اسم المستخدم يسبق موقع الرمز @ و اسم مزود الخدمة يلي الرمز @ فعلي سبیل المثال
a_elhussein@hotmail.com إذا كان البريد الإلیكتروني المدخل ھو
a_elhussein يكون اسم المستخدم
hotmail ويكون اسم المزود
لاحظ أن النمط المستخدم ھو نفس النمط السابق مع إضافة المجموعات بإستخدام الأقواس .






replace الدالة
تستخدم للبحث عن نمط معین بداخل النص ثم تقوم بإستبداله بنص أخر
القیمة الراجعة : تقوم بإرجاع النص الجديد
الصیغة العامة
String.replace ( ;( نص الإستبدال , نمط البحث
البرمجة بالجافا سكربت الجزء الثاني
74
مثال
var str = new String();
str = "hello mr hello";
var pattern = /hello/g;
var newStr = str.replace( pattern, "me" );
alert( " : النص الجدید : " + newStr );
ويكون الناتج كما يلي
search الدالة
التابعة للكائن النصي indexOf تستخدم للبحث عن نمط معین بداخل النص ثم تقوم بإرجاع مكان تواجدة مثل الدالة
القیمة الراجعة : تقوم بإرجاع موقع النص علي ھیئة قیمة عددية
الصیغة العامة
String.search( ;( نمط البحث
مثال
var str = new String();
str = "hello mr hello";
var pattern = /mr/;
var index = str.search( pattern );
alert( " موقع جملة mr : " + index );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
75
RegExp كائن التعبیرات المنتظمة
RegExp إنشاء كائن التعبیرات المنتظمة
يمكننا إنشائه كما يلي
var regexpObject = new RegExp();
RegExp خصائص الكائن
constructor الخاصیة
بالجزء الثالث من ھذا الكتاب ، عند الحديث عن الكائنات والبرمجة الكائنیة constructor سوف نتحدث عن الخاصیة
global الخاصیة
به g وتعبر ھل النمط المستخدم تم إستخدام المعامل ، read only ھذه الخاصیة للقرأة فقط
فعلي سبیل المثال
true تساوي global تكون الخاصیة /hello/g النمط التالي
false تساوي global تكون الخاصیة /hello/ أما النمط التالي
ignoreCase الخاصیة
به i وتعبر ھل النمط المستخدم تم إستخدام المعامل ، read only ھذه الخاصیة للقرأة فقط
فعلي سبیل المثال
true تساوي ignoreCase تكون الخاصیة /hello/i النمط التالي
false تساوي ignoreCase تكون الخاصیة /hello/ أما النمط التالي
multiline الخاصیة
وتعبر ھل النمط المستخدم سوف لا يتجاھل السطور العديدة به ، read only ھذه الخاصیة للقرأة فقط
source الخاصیة
. RegExp وتعبر عن صیغة النمط المستخدم بالكائن ، read only ھذه الخاصیة للقرأة فقط
البرمجة بالجافا سكربت الجزء الثاني
76
RegExp دوال الكائن
compile الدالة
تمكننا من إنشاء كائن للتعبیرات المنتظمة به نمط معین
الصیغة العامة
RegExp.compile( ;( النمط
أو
RegExp.compile( النمط , ["g" "i" "m"]);
يحدد المعامل الثاني طريقة البحث بإستخدام النمط
multiline وھي يعبر عن البحث في جمیع السطور m وھنا سوف نشیر إلي الرمز
مثال
var regexpObject = new RegExp();
var regexpObject2 = regexpObject.compile("/me/");
var regexpObject2 = regexpObject.compile("/me/", "i");
test الدالة
تستخدم للتأكد من توافق النمط مع النص الممرر لھا
false وفي حالة عدم التوافق ترجع true القیمة الراجعة : في حالة توافق النمط مع النص ترجع الدالة القیمة
الصیغة العامة
RegExp.test( ;( النص
مثال
var RegExp = /me/;
alert( regExp.test("hello me hello") );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
77
exec الدالة
تستخدم لتنفیذ النمط علي النص الممرر لھا
Match القیمة الراجعة : مصفوفة من كائنات من النوع
الصیغة العامة
RegExp.exec( ;( النص
مثال
var RegExp = /me/;
var matchArray = RegExp.exec("hello me hello");
if( matchArray == null )
alert(" لم یتم العثور علي جملة me");
else
alert( " : تم العثور علي جملة " + matchArray[0] );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
78
الفصل السادس
التعامل مع التاريخ
سوف نناقش إن شاء الله في ھذا الفصل النقاط التالیة :
Date الكائن ·
إنشاء كائن التاريخ ·
دوال كائن التاريخ ·
البرمجة بالجافا سكربت الجزء الثاني
79
Date Object كائن التاريخ
الجافا سكربت لیس بھا نوع بیانات أولي للتاريخ ، لكنك تستطیع أن تستخدم كائن التاريخ ودوالة أو وظائفه للتعامل
مع التاريخ والوقت في تطبیقاتك
منذ تاريخ ١ يناير ١٩٧٠ milliseconds يتم تخزين التاريخ بالملي سكند
لاحظ أن كائن التاريخ لیس به أي خصائص
إنشاء كائن التاريخ
الصیغة العامة
var dateObject = new Date();
أو
var dateObject = new Date( ;( تاریخ
مثال
var dateObject = new Date();
alert( dateObject );
ويكون الناتج كما يلي
ويمكننا تحديد التاريخ كما يلي
مثال
var dateObject = new Date("6/15/2004");
alert( dateObject );
البرمجة بالجافا سكربت الجزء الثاني
80
ويكون الناتج كما يلي
دوال كائن التاريخ
تنقسم دوال كائن التاريخ إلي ثلاث أقسام أحدھما دوال لإرجاع القیم من التاريخ والأخري لوضع قیم بالتاريخ
والأخري لتحويل التاريخ كما يلي
getDate الدالة
تستخدم لإرجاع الأيام الموجودة بالتاريخ من ١ إلي ٣١
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getDate();
مثال
var dateObject = new Date();
alert( dateObject.getDate() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
81
getDay الدالة
تستخدم لإرجاع رقم يوم الأسبوع الموجود بالتاريخ وتكون ممثلة لأيام الأسبوع من ٠ إلي ٦ ، حیث صفر يعبر عن يوم
الأحد
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getDay();
مثال
var dateObject = new Date();
alert( dateObject.getDay() );
ويكون الناتج كما يلي
والرقم ٣ يعبر عن يوم الأربعاء
getMonth الدالة
تستخدم لإرجاع رقم الأشھر من ٠ إلي ١١ ، حیث يعبر الرقم صفر عن شھر يناير
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getMonth();
البرمجة بالجافا سكربت الجزء الثاني
82
مثال
var dateObject = new Date();
alert( dateObject.getMonth() );
ويكون الناتج كما يلي
والرقم ٥ يعبر عن شھر يونیو
getYear الدالة
تستخدم لإرجاع السنة
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getYear();
مثال
var dateObject = new Date();
alert( dateObject.getYear() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
83
getHours الدالة
تستخدم لإرجاع قیمة عدد الساعات من ٠ إلي ٢٣
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getHours();
مثال
var dateObject = new Date();
alert( dateObject.getHours() );
ويكون الناتج كما يلي
والساعة ١٦ تعادل الساعة الراعة صباحا
getMinutes الدالة
تستخدم لإرجاع قیمة عدد الدقائق من ٠ إلي ٥٩
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getMinutes();
مثال
var dateObject = new Date();
alert( dateObject.getMinutes() );
البرمجة بالجافا سكربت الجزء الثاني
84
getSeconds الدالة
تستخدم لإرجاع قیمة عدد الدقائق من ٠ إلي ٥٩
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getSeconds();
مثال
var dateObject = new Date();
alert( dateObject.getSeconds() );
getTime الدالة
تستخدم بحساب التاريخ بالملي سكند الذي مر علي ھذا التاريخ منذ تاريخ منتصف لیل يوم ١ يناير ١٩٧٠
القیمة الراجعة : تقوم بإرجاع قیمة عددية
الصیغة العامة
Date.getTime();
مثال
var dateObject = new Date();
alert( dateObject.getTime() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
85
setDate الدالة
تستخدم لوضع عدد الأيام بالتاريخ وتكون القیمة المضافة من ١ إلي ٣١
الصیغة العامة
Date.setDate( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setDate("2");
setMonth الدالة
تستخدم لوضععدد الشھور بالتاريخ وتكون القیمة المضافة من ٠ إلي ١١
الصیغة العامة
Date.setMonth( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setMonth("2");
setYear الدالة
تستخدم لتحديد قیمة السنوات بالتاريخ
الصیغة العامة
Date.setYear( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setYear("2006");
البرمجة بالجافا سكربت الجزء الثاني
86
setHours الدالة
تستخدم لتحديد قیمة الساعات بالتاريخ
الصیغة العامة
Date.setHours( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setHours("2");
setMinutes الدالة
تستخدم لتحديد قیمة الدقائق بالتاريخ
الصیغة العامة
Date.setMinutes( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setMinutes("20");
setSeconds الدالة
تستخدم لتحديد قیمة الثواني بالتاريخ
الصیغة العامة
Date.setSeconds( ;( القیمة
مثال
var dateObject = new Date();
dateObject.setSeconds("2");
toGMTString الدالة
تستخدم لتحويل التاريخ إلي ما يعادلة بتوقیت جرينتش
الصیغة العامة
Date.toGMTString();
البرمجة بالجافا سكربت الجزء الثاني
87
مثال
var dateObject = new Date();
alert( dateObject.toGMTString() );
ويكون الناتج كما يلي
toLocaleString الدالة
تستخدم لتحويل التاريخ إلي ما نص علي حسب نظام التشغیل الذي يعمل به الجھاز
الصیغة العامة
Date.toLocaleString();
مثال
var dateObject = new Date();
alert( dateObject.toLocaleString() );
ويكون الناتج كما يلي
البرمجة بالجافا سكربت الجزء الثاني
88
parse الدالة
تستخدم لتحويل القیمة النصیة إلي متغیر من نوع تاريخ
الصیغة العامة
Date.parse( " ;( "نص التاریخ
مثال
var dateObject = new Date( Date.parse("Wed Jun 16 17:31:01 PDT 2004") );
alert( dateObject.getYear() );
ويكون الناتج كما يلي
تمرين