جافا سكربت المستوي الأول - elibrary

بسم اهللا الرحمن الرحيم سبحانك ال علم لنا إال ما علمتنا إنك أنت العليم الحكيم

:المقدمة

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

ساسیات أوربما يحتاج القارئ أن يكون ملما ب، م لغة الجافا سكربت یالخطوات األولي لتعلمن الكتاب يقدم ھذا الجزء الخاصة بتكوين صفحات الويب htmlلغة الھتمل

اعالمي عن الخطأ علي العنوان التالي في حالة وجود أي أخطاء أرجو

[email protected]

وأرجو من كل من أستفاد من ھذا الكتاب أن يدعوا لي بالتوفیق في الدنیا واألخرة

:إھداء

إلي الجیل القادم الذي يعز اهللا به اإلسالمأھدي ھذا الكتاب

اهللا صلي اهللا علیه وسلم وھو شاء اهللا أن أنھي ھذا الجزء من الكتاب في يوم میالد النبي األمي محمد بن عبد وقد .أن ھداني لھذا وما كنا لنھتديا لوال أن ھدانا اهللا فأحمد اهللا علي ، بما علمه اهللا خیر معلم أول معلم و

نا مادامت فیا الحیاة باذل جھدي وعقلي ومستفرغ طاقتي في العلم وذلك لثالثة أمورإو

إفادة من يطلب العلم في حیاتي وبعد مماتي - ة لي في قبري ويوم حسابيذخیر - رفعة لسلطان المسلمین -

الحسین محمد علي :تألیف

mailto:[email protected]

Tips Club

المكتبة العربية

http://www.TipsClub.com/

ولجافا سكربت المستوي األ

2

المحتويات

١. ................................. ...........................................................مقدمة للغة الجافا سكربت : الفصل األول

١٠................................ ......................................................... الجافا سكربتةأساسیات لغ : الثانيالفصل ٣٢. ............................................................................................................ متغیراتال : لثالثاالفصل ٤١ ............................................................................................................. المعامالت : لرابعاالفصل ٦٩......... ..................................................................................التحكم في مسار البرنامج : الخامسالفصل ٨٧...................................................... ............................................ .الدوال أو الوظائف : السادسالفصل


3

الفصل األول مقدمة للغة الجافا سكربت

:سوف نناقش إن شاء اهللا في ھذا الفصل النقاط التالیة

جافا سكربتماھي ال • أصل الجافا سكربت • ممیزات الجافا سكربت • لماذا أتعلم الجافا سكربت • والجافا سكربت.. ماھو الفرق بین الجافا • لمقصود بشفرة البرنامج أو السورس كود اما • متصفحي النتسكیب واإلكسبلورر • " Hello World"برنامجك األول •


4

ماھي الجافا سكربت

في صفحات الويب مھامھا األساسیه بث الحیاة.. غة من لغات البرمجة ان صح التعبیر وبكل بساطه لسكربت الجافا

الى الوصالت بل وحتى forms من ال وتعطیك امكانیة التحكم بكل جزء في صفحة الوب، HTML المكتوبة بلغة ال . بعض الوظائف الخارجیه

أصل الجافا سكربت

اليفوتني أن أذكر أن ال ة بعض الحیوية الى صفحات الويب، طبعاإلضاف Netscape الجافا سكربت صممت من قبلJava في االصل صممت من قبل شركة Sun للغة وھي المالك األساسي.

ممیزات الجافا سكربت

حتى لألشخاص الذين لم يكتبوا لف عن أغلب لغات البرمجة األخرى في كونھا سھلة التحكم ،تالجافا سكربت تخ . بساطة،الجافا سكربت ھي الھواء لصفحتك بكل. خرى في حیاتھم كلھابأي لغة برمجة أ

اي تعتمد علي وجود بعض الفئات ان صح التعبیر مبنیة بداخل Object baseباإلضافة إلي أنھا برمجه كائنیة اإلعتماد

.document و الكائن windowيمكن إستخدامھا بكل سھولة مثل الكائن اللغة

eventsا سكربت التعامل مع األحداث توفر لغة الجاف

فھي ال تعتمد علي نظام ، تعمل لغة الجافا سكربت من خالل جمیع أنظمة التشغیل مثل الويندوز و اللینكس . Platform independentالتشغیل

لف عن نفس الالتینیه الصغیره تخت ، أي أن الكلمة المكتوبه بالحروف case sensitive language الجافا سكربت ھي الكلمة مكتوبة باألحرف الكبیره

: مثالNaser غیر naser غیر naSer وھكذا ، ..

: يفترض الى درجة اإللزام أن ينتھي كل سطر بفاصلة منقوطة

var x = 3;


5

: تتجاھل المساحات الخالیة ، والسطور الجديدة ، مثال HTML ھتملالجافا سكربت كما ال

var x=4 نفسهاهي var x = 4

مع مالحظة أنه البد من ترك مسافة خالیة على األقل بعد أي مصطلح من مصطلحات الجافا

لماذا أتعلم الجافا سكربت

فأنت HTML بمجرد الكتابه بال ألنه. اإلبداع .. الحريه .. القوة : أول مايخطر في بالي إجابة على ھذا السؤال ھو الكود ، وھذا غیر مقبول بتاتا في عالم التكنولوجیا الجديده ثابته التتغیر اال بتغییرل صفحتك كما ھي ظمقید بأن ت

وحتى الصور.. وأنواع الخطوط .. يمكنك حتى الباس صفحتك حلة جديدة من ألوان الخلفیه وبواسطة الجافا سكربت. ! حسب التوقیت الیومي للزائر وبدون أي تدخل منك ..

الرأي ، أال توافقني.. .نعم الكل .. الكل يستطیع تعلمھا ! سكربت تعتبر من أبسط اللغات االجاف.. وشيء مھم أيضا . أن كتابة الكود الخاص بك مباشرة أفضل ألف مرة من البحث عنه في الشبكه

. أو قد التجدة إطالقا! وربما التجد مبتغاك بسھولة

والجافا سكربت.. ماھو الفرق بین الجافا

وھي . ألسف ، أصعب في التحكم لو بت ، وأكثر تعقیدا ،الجافا أقوي بكثیر من الجافا سكرنعم ف. ھما كبیر الفرق بین . تأتي في نفس مستوى لغتي السي ، والسي بلس بلس

يمكنك بمجرد فتح ! سكربت أبسط بكثیر باإلضافه الى أنك تحتاج الى برامج خاصة للكتابة بلغة الجافا ، بینما الجافا

لن تحتاج الى شي آخر . صدق أوال تصدق !!! السكربت كامال كتابة NOTEPAD نوتة تحرير نصوص مثل الجبرنامأي . سوى المتصفح لترى النتیجه

لمقصود بشفرة البرنامج أو السورس كود اما

الرئیسیه ، أي بصورتة وعة األوامر التي تكتب مجتمعة أو متفرقة لیعمل البرنامجمھو مج: الكود أو السورس كود NOTEPAD عرضھا بأي برنامج تحرير نصوص عادي مثل ال البنیة التحتیة للبرنامج ، وتكون دائما مكتوبه كتابة ويمكن

.


6

متصفحي النتسكیب واإلكسبلورر

بدون أية مشاكل ؟ ھل بإمكان الكود الذي كتبته بالجافا سكربت العمل على متصفحي النتسكیب واإلكسبلورر ! سف ، اإلجابة باللأل

من جھة أخرى ھناك فروقات . نتسكیب أكثر دعما له اذا. الجافا سكربت أصال مصمم من قبل شركه نتسكیب . الجافا ، وبعضھا يطال حتى األوامر األساسیه أساسیة في تعامل ھذين المتصفحین مع

بأن أفضل طريقة للتأكد من عمل السكربت ھوھذه العقبة ، أما اآلن فدعني أخبرك سنتطرق الحقا الى كیفیة تجاوز

الى أفضل شكل طبعا ستدھشك كثرة المواقع التي فشلت في الوصول بصفحاتھا. تجربته على كال المتصفحین : ودعم لكال المتصفحین ، وھذا مايفسر السطر الذي نراه كثیرا

. ألفضل عرض ، ينصح بإستخدام المتصفح الفالني

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

"Hello World"برنامجك األول

جافا سكربتكودأساسیات كتابة يمكننا من إستعراض Hello Worldھذا المثال الشھیر بـ <HTML> <HEAD> <TITLE>My First Script</TITLE> </HEAD> <BODY> <H2> this is my First JavaScript Code </H2> <HR> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </BODY> </HTML>


7

د عرضه من خالل المتصفح أنترنت أكسبلورارويكون ھذا ھو الناتج عن

ھذا المثال البسیط سوف يكون البوابة األولي لدخول عالم البرمجة بلغة الجافا سكربت :ومنه سوف نتعرف علي الخطوات المتبعة لكتابة كود جافا سكربت وھي كما يلي

لذلك مبدئیا نالحظ أن ، HTMLھتمل ) أوسمه(نالحظ أننا أدرجنا كود الجافا سكربت بداخل أكواد •متداد إحتي يتم تنفیذ أكواد الجافا سكربت سوف نحتاج إلي إدراج كود الجافا سكربت في ملف ذو

htm أو html) أو ملفات دينامیكیة مثلASP أو PHP ( firstJs.htmلذلك سوف نحفظ الكود السابق في ملف ولیكون

كودفصل بین كود الھتمل وكود الجافا سكربت الحظ الثانیا ربما يتبادر إلي الذھن كیف يتم ال • التالي

<SCRIPT LANGUAGE="JavaScript"> هنا یتم كتابة كود الجافا سكربت // </SCRIPT>

<script>وھو (Tag)بكل سھولة توفر لنا لغة الھتمل أحد األوسمة كتابة السكربت ان نحدد له اسم اللغة المستخدمة لھذا الوسم يحتاج

JavaScript بان نحدد له القیمة Languageويتم ھذا من خالل إستخدام المعامل مع مالحظة أنھا ھي القیمة األفتراضیة لذلك عادة ال نحتاج إلي تحديد لغة األسكربت إلي جافا

كما يليسكربت


8

<SCRIPT> كما تري ال نحتاج لتحدید لغة األسكربت // ا یتم كتابة كود الجافا سكربتهن // </SCRIPT>

كما يلي<Script/> و <Script>ويتم وضع الكود الخاص بلغة الجافا سكربت بین الوسمین

<SCRIPT LANGUAGE="JavaScript">  </SCRIPT>

ف يتم كتابة كود الجافا سكربت نعم ھذا صحیح ولكن تمھل قلیل أذا كل ما نحتاجه األن معرفة كی •

وفكر معي ماذا يحدث لو كان المتصفح المستخدم لفتح الملف ال يدعم لغة الجافا سكربت ؟ أعتقد أنك سوف تقول بكل بساطة أن الكود المكتوب بھذه اللغة لن يعمل وھذا القول صحیح

وھو ظھور كود الجافا سكربت بداخل محتويات الصفحةلكن سوف ينتظرك ما ھو أسوء من ھذا أال كما بالشكل التالي

كما يلي<--// --!> يمكنك إخفاء ظھور كود الجافا سكربت بوضع الكود بینلكن ال تحزن




9

وھواألن حان الوقت لمعرفة أول أمر في لغة الجافا سكربت •

document.write("Hello World");

document.write:وبالتالي سوف يتم كتابة النص يمكننا ھذا األمر من كتابة نص في المتصفح

Hello Worldة بین عالمتین تنصیص كما يلي ت مع مالحظة وضع النص المراد كتاب

document.write("Hello World");

:التالييجب مالحظة

فعلي سبیل المثال)وف الصغیرة والكبیرة رالح( الجافا سكربت لغة حساسة لحالة الحروفان لغة document.write ال تكافيء document.Write ولو استخدمت بھذا الشكل سوف تؤدي لحدوث خطأ

Hello Worldولن يتم عرض النص


10

الثانيالفصل أساسيات لغة الجافا سكربت

:ي هذا الفصل النقاط التالیة سوف نناقش إن شاء اهللا ف

إدراج كود الجافا سكربت في صفحة ھتمل •o إدراج داخلي o إدراج خارجي

Commentsالتعلیقات •

o تعلیق لسطر واحد o تعلیق لسطر أو ألكثر من سطر

طرق إدخال و إخراج البیانات •

o طرق إخراج البیانات alertالطريقة § writeالطريقة § writelnالطريقة § printالطريقة §

o طرق إدخال البیانات confirmالطريقة § promptالطريقة §


11

إدراج كود الجافا سكربت في صفحة ھتمل

أن كود الجافا سكربت غالبا ما يتم إدراجه بین كود الھتملHello Worldفي مثال كما رأينا سابقا : ويتم ھذا اإلدراج عن طريق

إدراج داخلي .١ إدراج خارجي .٢

: داخليإدراج :يتم كتابة كود الجافا سكربتفیه أو كالھما<Body> أو الوسم <Head> ويمكنك وضع ھذا الوسم بین الوسم <Script> بین الوسم إما - أ

كما يلي

<Head>وضع كود الجافا سكربت بین وسم <HTML> <Head> <script>  </script> </Head> <Body></Body> </HTML>

<Body>وضع كود الجافا سكربت بین وسم <HTML> <Head></Head> <Body> <script>  </script> </Body> </HTML>

: التالي يتبادر لك السؤال ربما لكن

؟<Body> والوسم <Head>ھل ھناك فرق بین إدراج كود الجافا سكربت بین الوسم أي أن كود الجافا سكربت المندرج بین تنفیذ الكودتسلسلبالطبع نعم ولكن ھذا الفرق ينحصر فقط في : اإلجابة

)حتي قبل تحمیل عناصر الصفحة( سوف يتم تنفیذه أوال <Head>الوسمین <Body>تنفیذ كود الجافا سكربت المندرج بین الوسمین ثم يتم


12

الحظ معي المثال التالي

<HTML> <HEAD> <TITLE> الفرق بین وضع الكود </TITLE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </BODY> </HTML>

<Head>كما تري تم وضع الكود التالي بین الوسم وبالتالي سوف يتم تنفیذه أوال

<SCRIPT LANGUAGE="JavaScript">  </SCRIPT>

<Body>م وضع الكود التالي بین الوسم ث

وبالتالي سوف يتم تنفیذه بعد األنتھاء من تنفیذ الكود السابق <SCRIPT LANGUAGE="JavaScript">  </SCRIPT>


13

ويكون الناتج كما يلي

أو يتم وضع كود الجافا سكربت بداخل اي وسم ھتمل - ب

كما يلي <TagName event="یتم هنا إدراج كود الجافا سكربت"></TagName>

Span الوسم المراد ولیكن علي سبیل المثال بـاسمTagNameيتم إستبدال onclick بـاسم الحدث المطلوب ولیكن علي سبیل المثال eventويتم إستبدال

ثم يتم وضع الكود داخل ھذا الحدث

سوف نتناوله في الجزء الثاني من الكتاب بشكل مفصلوھذا النوع من إدراج كود الجافا سكربت كما يلي الطريقةولكن دعنا نري مثال سريع يوضح

<HTML> <HEAD> <TITLE> إدراج الكود داخل األوسمة </TITLE> </HEAD> <Body> <Span onclick="document.write('نحن األن بالداخل')"> قم بالضغط علي هذا النص </Span> </Body> </HTML>

كما يلي)Spanت الوسم المختار وھو ھنا محتوياياي عند الضغط عل (onclickتم إستخدام الحدث

<Span onclick="document.write('نحن األن بالداخل')"> قم بالضغط علي هذا النص </Span>

سوف يتم تنقیذ الكود التالي <Span>فعند الضغط علي محتويات الوسم


14

document.write('نحن األن بالداخل') <Span onclick="document.write('نحن األن بالداخل')"> قم بالضغط علي هذا النص </Span>

:خارجي إدراج jsإدراج كود الجافا سكربت من ملف خارجي غالبا ما يكون ذو إمتداد فیه يتم كما يلي

<SCRIPT LANGUAGE="JavaScript" src="fileName.js"></SCRIPT>

jsلف ذو اإلمتداد كتابة كود الجافا سكربت في الميتم و

يتكون من ملفین أحدھما:مثال توضیحي ExternalEmbed.htm يدرج به الملف outerScript.js الذي يحتوي علي كود الجافا سكربت

ExternalEmbed.htm <HTML> <Head> <SCRIPT LANGUAGE="JavaScript" src="outerScript.js"></SCRIPT> </Head> <Body> إدراج خارجي </Body> </HTML>

outerScript.jsdocument.write("هذا نص خارجي من الملف المدرج"); document.write("<br>");


15

)(Commentsالتعلیقات

في مثل ھذه الحاالت سوف ) سطر٢٠٠٠حوالي مثال (معقد وطويل أنك قمت بكتابة كود جافا سكربت يتخیل مع :جه التالي توا

صعوبة قراءة الكود • Debugصعوبة تصحیح األخطاء •

: إذا ما الحل

لكل جزء من الكود Commentsمن الخطوات المتبعة في تقلیص ھذة المشكلة عمل مالحظات أو تعلیقات :التعلیقات وكما سنري يوجد نوعین من

)// (تعلیق لسطر واحد • :ھم تعلیقك الخاص بك كما بالمثال التالي ثم يلی//بإستخدام العالمتین التالیتین

<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

)/* */ (كثر من سطرر أو ألسطتعلیق •

ثم نضع مرة ربما يكون مكون من سطر أو أكثر ثم يلیھم تعلیقك الخاص بك*/ بإستخدام العالمتین التالیتین إلنھاء التعلیق /*خرة العالمتین ا

: كما بالمثال التالي

<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


16

.يمكنك إستخدام اي نوع من التعلیقات أو كالھما كما يفضل المبرمج

إي ال يتم (JavaScript Interpreter) يتم تجاھله من قبل مفسر لغة الجافا سكربتلتعلیقات كال النوعین من ا سبیل المثال ربما تقوم بالتاليتنفیذه علي

)تستخدم ھذة الطريقة في عملیة تصحیح األخطاء (تحويل كود مكون من سطر أو أكثر إلي تعلیق : كما بالمثال التالي وبالتالي لن يتم تنفیذه

<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما تري لن يتم تنفیذ السطر التالي

// document.write("إلي اللقاء");

ويكون الناتج كما بالشكل التالي


17

: مالحظة هامة

)/* */( تعلیق لسطر أو أكثر من سطر للنوع الثاني من التعلیقات عند إستخدامك (nesting)ال يمكنك عمل تداخل Syntax Errorث خطاء لغوي حداإإلن ذلك سوف يؤدي إلي

: األشكال التالیة من األخطاءيالحظ مع

<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

/* للمستخدم ترحیب رسالة إظهار ثم /* طباعة سطر فارغ */ */

/* للمستخدم ترحیب رسالة إظهار ثم طباعة سطر فارغ */ /* تداخل جدید */ */ */


18

تطرق إدخال و إخراج البیانا

وھي من النقاط الھامة التي تعطي برنامجك تفاعل مع توفر لنا اي لغة برمجة طرق إلدخال وإخراج البیانات المستخدمین لبرنامجك

.بیانات الإلخراج وإدخال وسوف نتناول في ھذا الجزء الطرق المختلفة

طرق إخراج البیانات: أوال

أن لغة الجافا سكربت توفر لك بعض إلخراج البیانات نعني بذلك عندما يقال أن لغة الجافا سكربت توفر لنا طرقمثل الشاشة ( بجھاز الكمبیوترتظھر من خالل وحدات اإلخراج األوامر الخاصة بھا التي تمكنك من إظھار رسائل

. وسوف نتناول ھذة الطرق المختلفة )والطابعة

:alert الطریقة -١ .تقوم بإظھار رسالة إلي المستخدم • كما سنري الحقا، windowعتبر إحدي الوظائف التابعة للكائن ت • : طريقة إستخدامھا •

alert(" ضع هنا رسالتك ");

أو window.alert(" ضع هنا رسالتك ");

إظهارها كالھما سوف يؤدي إلي نفس النتیجة ثم يتم تمرير الرسالة المرادwindow.alert أو alertيتم كتابة األمر

"" بین عالمتین تنصیص

تمرین إلظهار رسالة تحذیر للمستخدم

<HTML> <Title> الطریقة alert </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


19

:كما يلي ويكون الناتج

:write الطریقة -٢ .كنابة نص في الصفحة للمستخدم بتقوم • كما سنري الحقا، documentتعتبر إحدي الوظائف التابعة للكائن • : طريقة إستخدامھا •

document.write(" ضع هنا رسالتك ");

نص أوplain textة الرسالة إما نص بسیط وتكون ھذ"" بین عالمتین تنصیص كتباتھايتم تمرير الرسالة المراد أيضا

HTML textھتمل

جمیع حروفهwriteيجب مالحظة أن لغة الجافا سكربت لغة حساسة لحالة الحروف لذلك يكتب األمر كما يلي (small letters)صغیرة


20

للمستخدم بسیطةحیبرتتمرین إلظهار رسالة

<HTML> <Title> الطریقة write </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

:ويكون الناتج كما يلي

للمستخدمتأكید لعملیة حذفتمرین إلظهار رسالة

document.writeألمر في ھذا التمرين سوف نتعلم طريقة إستخدام ا .إلظھار رسالة أكثر تعقید منصقة بإستخدام جمل الھتمل • .طريقة دمج النصوص • .طريقة حل المشكلة الناتجة من تداخل عالمات التنصیص •


21

<HTML> <Title> الطریقة write </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


:كما ذكرنا في النفاط المستفادة من ھذا التمرين سنالحظ التالي : طریقة دمج النصوص -

المستخدم في عملیات الجمع+بإستخدام الرمز ) والنص ھو الجملة المحددة بعلمتین تنصیص ( يتم دمج النصوص كما يليالرياضي

document.write("<Center>" + "<Input type=button value=موافق> ");


22

: تداخل عالمات التنصیص عالج-

""كما ذكرنا سابقا أن النص ھو عبارات وجمل يتم كتابتھا بین عالمتین تنصیص تینمبین عال سوف نقوم بوضعھا علي سبیل المثال نريد عمل نص به عبارة أنا من محبي لغة الجافا سكربت

تابعة الكلمات وبذلك يستطیع مفسر اللغة تمیز أن ھذه " أنا من محبي لغة الجافا سكربت "التنصیص كما يلي .واحد لنص

إذا إين المشكلة ومتي تظھر نعم أنت علي حق ال توجد مشكلة ھنا إال إذا حدث التالي تخیل معي أن نص الجملة يحتوي عالمة تنصیص أو أكثر

كما تري أننا األن في مأزق ألننا )يا رجل ؟" مشكلة"ھل ھناك (ل المثال أنك تريد كتابة الجملة التالیة علي سبی وسوف يؤدي ھذا إلي إرتباكوضعنا ھذة الجملة بین عالمتیین تنصیص سوف يحدث تداخل في عالمات التنصیص لو

.syntax errorوي لغمما ينتج عنه خطأ لمفسر اللغة ؟األن ما الحل

ربما يتبادر إلي ذھنك الھرب من المشكلة وتقول أنا لست في حاجة إلظھار عالمات التنصیص في الجملة وسوف ولكن دائما تأتي الحلول لتفادي األخطاء وتجنبھا ولیس الھرب أجعل الجملة بدونھما كما ھو حالنا نحن العرب

نعم يابشرك بقولأعتقد أنه تبادر إلیك األن أن ھذه المشكلة لھا حل ،منھا . Escaping Charactersحیث توفر لنا لغة الجافا سكربت عالمات الھروب

:Escaping Characters عالمات الهروب

: ومنھا التالي تمكنك من تضمین بعض الحروف التي يصعب كتابتھا في محتوي النصوص

تمكنك من إضافة عالمه التنصیص الفردیة بداخل النص '\ مكنك من إضافة عالمه التنصیص بداخل النصت "\\r تمكنك من إدخال حرف خاص لعمل ما یسميCarriage

returnمما اي تراجع موشر الكتابه إلي بدایة السطر ینتج عنه في بعض األحیان عمل سطر جدید

\n تمكنك من عمل سطر جدید داخل النص \t تمكنك من إدخال الحرفTab

)يا رجل ؟ " مشكلة"ھل ھناك (يع لعالمات الھروب كیف يمكننا حل مشكلة كتابة النص السابق بعد التعرف السر

ويكون النص كالتالي )"\(بي عالمة الھروب (") بكل يسر يتم إستبدال اي عالمة تنصیص )یا رجل ؟" \مشكلة"\هل هناك (


23

:مثال تطبیقي لكتابة الرسالة التالیة

أن تكون قد" العزیز"رئنا نتمنا لك یا قا تعلمت ما سبق من قول وان تحرص علي ما هو أت

<HTML> <Title> الطریقة write و alert </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

ويكون الناتج كالتالي


24

:مالحظة لكتابة سطر جدید

لعمل سطر جدید r\n\ قمنا بإستخدام عالمات الهروب : alert بالطریقة حتي ننمكن من كتابة سطر جدید <br>قمنا بإستخدام الوسم : write بالطریقة

writeln

.باإلضافة إلي أنها تحدث سطر جدید قبل كتابة النصتقوم بكنابة نص في الصفحة للمستخدم • كما سنري الحقا، documentكائن تعتبر إحدي الوظائف التابعة لل • : طريقة إستخدامھا •

document.writeln(" ضع هنا رسالتك ");

نص أوplain textوتكون ھذة الرسالة إما نص بسیط "" بتھا بین عالمتین تنصیص اأيضا يتم تمرير الرسالة المراد كت

HTML textھتمل

<HTML dir=rtl> <Title> الطریقة writeln </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


25

ا ال نري سطر جديد ولكن ھذا ال يعني عدم وجودة حیث أنه تم كما تري لم يتم عمل سطر جديد أقول لك نعم أنن . وكما نعلم أن لغة الھتمل تتجاھل المسافات الزائدة والسطور الجديدة n\عمل تغذيه لسطر جديد باستخدام

:print الطریقة -٣ .الصفحة بطباعة تقوم • . windowتعتبر إحدي الوظائف التابعة للكائن • : طریقة إستخدامها •

window.print();

. سوف نتحدث عنھما فیما بعد onAfterprintو onBeforeprintوجد حدثان أيضا ي


26

طرق إدخال البیانات: ثانیا

: confirm الطریقة -١

السابقة باإلضافة إلي أنها تقوم بإرجاع أحدي القیمتین alertظهار رسالة مثل الطریقة إبتقوم •true أو false.

. windowتعتبر إحدي الوظائف التابعة للكائن • : طریقة إستخدامها •

confirm(" ضع هنا رسالتك ");

أو window.confirm(" ضع هنا رسالتك ");

كالھما سوف يؤدي إلي نفس النتیجة ثم يتم تمرير الرسالة المراد window.confirm أو confirmيتم كتابة األمر

"" ین عالمتین تنصیص إظھارھا ب )فیما بعد سوف يتم شرح المتغیرات ( ثم يتم إستقبال القیمة الراجعة من اإلختیار في متغیر

حدي العمالءاشتراك إأكید حذف تمرین إلظهار رسالة ت

<HTML> <Title> الطریقة confirm </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


27


وحتي ، لم نتعرف أيھما تم الضغط علیه ok أو cancelحدي الزرارين إكما تري ظھور الرسالة ولكن بعد الضغط علي :نحتاج إليف علي القیمة الراجعة من اإلختیار نتعر

ن المستخدم قد أفھذا يعني true تخزين القیمة الراجعة في متغیر ثم نحدد قیمة ھذا المتغیر فإذا كانت قیمته -وسوف نتحدث علي ھذا cancel فھذا يعني أن المستخدم قد ضغط زرfalse وإذا كانت قیمته ، okضغط الزر .عند الحديث عن المتغیراتما بعد اإلسلوب فی

:كما سوف يتضح في المثال التالي ) من علي الطائر كما يقال ( أو نقوم بإستخدام القیمة الراجعة بدون تخزينھا - : كما يلي alertحیث سوف نقوم بطباعة القیمة الراجعة من اإلختیار بواسطة الطريقة

<HTML> <Title> الطریقة confirm </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


28


: يكون الناتج كالتالي okفعند الضغط علي زر


29

: يكون الناتج كالتالي cancelوعند الضغط علي زر

: prompt الطریقة -٢

السابقة باإلضافة إلي أنها تقوم بإرجاع أحدي القیمتین confirmتقوم بإظهار رسالة مثل الطریقة • .)وهي تعني ال شيء ( null القیمة أو القیمة المدخلة من خالل المستخدم

. windowعة للكائن تعتبر إحدي الوظائف التاب • : طریقة إستخدامها •

prompt(" القیمة اإلفتراضیة للقیمة الراجعة" ," ضع هنا رسالتك");

أو window.prompt(" القیمة اإلفتراضیة للقیمة الراجعة" ," ضع هنا رسالتك");

جة ثم يتم تمرير الرسالة المراد كالھما سوف يؤدي إلي نفس النتیwindow.prompt أو promptيتم كتابة األمر

ثم تمرر أو ال تمرر القیمة اإلفتراضیة للقیمة الراجعة وإذا لم تمرر سوف تأخذ القیمة "" إظھارھا بین عالمتین تنصیص undefinedاإلفتراضیة

ھا في شكل أو إظھار)سوف يتم شرح المتغیرات فیما بعد ( ثم يتم إستقبال القیمة الراجعة من اإلختیار في متغیر كما بالمثال التالي confirmرسالة كما سبق القول في الطريقة


30

لمستخدم بعد إدخال اسمهبها اسم اتمرین إلظهار رسالة

<HTML> <Title> الطریقة prompt </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


:كالتالي " الحسین محمد"ثم نقوم بإدخال االسم ولیكن التالي


31

: يكون الناتج كالتالي okفعند الضغط علي زر


32

: يكون الناتج كالتالي cancelوعند الضغط علي زر


33

الثالثلفصل ا المتغيرات

:سوف نناقش إن شاء اهللا في هذا الفصل النقاط التالیة

Variables المتغیرات •o ما ھو المتغیر o أنواع البیانات o طريقة تسمیة المتغیرات o تعريف المتغیرات

JavaScript Keywords المحجوزة الكلمات •


34

Variablesالمتغیرات

:متغیر ما ھو ال

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

. نعم نعما الرأي ما قلت لقريب أو البعیدفي المستقبل اعند حاجتي لھا حتي أستخدمھا

توي يحفظه حتي نتمكن حبكل بساطة كما أحتجنا إلي تخزين الماء في م، لكن ما عالقة ھذا بموضوعنا المتغیرات ننا أيضا في عالم الكمبیوتر والبرمجة نحتاج إلي عملیة تخزين ولكن لیس للماء إف، من إستخدامه عند الحاجة إلیه

. للبیاناتتخزينولكن

وقلت لك كیف يمكنك تخزين ھذا النص ربما أسرعت الحمد هللا العلي العظیمفھب أنني أعطیتك النص التالي ردنا تخزين ولكن إذا أ، بالقول لي أنني سوف أقوم بحفظ ھذا النص في رأسي وتكون رأسك ھنا ھي مخزن النص

)ل البرنامج فقط وينتھي تخزينھا عند إنتھاء البرنامج اي خالل فترة عم( النص السابق في برنامجنا بشكل مؤقت ويتم إعطاء ھذا ، ة الحھاز المؤقتة وغالبا ما يكون جزء من ذاكرھنا سوف نحتاج إلي مخزن يتم حفظ ھذا النص به

.الجزء من ذاكرة الجھاز اسم خاص حتي يتم التعامل مع ھذا الجزء

ثابة مخزن للبیاناتميعتبر ب، اكرة الجھاز يتم إعطاء اسم له ھو جزء من ذ المتغیرنخلص مما سبق إلي أن

:أنواع البیانات

دراك التمیز بین الحروف األبجدية و األرقام وبین النصوص والقیم العددية إتختلف أنواع البیانات فمثال يستطیع اإلنسان :بیانات أنواع من ال٤وأيضا توفر لنا لغة الجافا سكربت التمیز بین ، وھكذا

Stringالنصوص • Numberالقیم العددية • Boolean) صح أم خطأ ( الحالة البولینیة • Nullالقیمة ال شئ •

كما نعلم أن شكل وطبیعة تركیب مخازن المیاه يختلف عن بنیة مخازن البترول مثال الحظ معي التالي

.طبیعة ونوع المادة المخزنة به وھكذا يختلف نوع المخزن حسب بإختالف نوع البیانات المخزنة ال تختلف في بنیتھا ) وھي مخازن البیانات( في لغة الجافا سكربت المتغیراتن ولك

.بھا كما ھو الحال بلغة الجافا والسي التي يتمیز فیھا نوع المخزن حسب نوع البیانات المخزنة به


35

:طريقة تسمیة المتغیرات

: وھي كالتالي ساسیة يجب توافرھا لیعمل البرنامج بالصورة الصحیحةالمتغیرات تخضع لشروط أتسمیة

كبیرا أو صغیرا مع مالحظة الخانة األولي من إسم المتغیر البد أن تكون أحد األحرف اإلنجلیزية سواًء حرفا •

.الينصح بإستخدام العالمة األخیرة ، مع أنه$ أو عالمة _ الفرق بینھما ، ويمكن البدء بعالمة

. خانة في اإلسم اليمكنك إطالقا ٍإستخدام رقم كأول •

. بدل المسافات_ يمكنك إستخدام العالمة األسماء اليمكن أن تحوي مسافات بین أحرفھا ، لكن •

. من الكلمات المحجوزة وھذه القاعدة عامة لجمیع لغات البرمجة اليمكن ألي إسم أن يماثل أيا •

: للمتغیرات الصحیحة التسمیةوإلیك بعض األمثلة على• Address1 • A4xb5 • lastName • _firstName • parent_Name

: للمتغیرات الصحیحة غیر التسمیةوإلیك بعض األمثلة على

• 1stName • ?subName • last name • @ userID

كلمات للفصل بین مقاطع ال_ ستخدام الحرف إجرت العادة عند تسمیة المتغیرات في الجافا سكربت أنه ال يفضل

فعلي سبیل ولكن يتم دمج المقاطع مع جعل الحرف األول صغیر وأول حرف من المقاطع التالیة يكون ذو حرف كبیر : ال يفضل تسمیته كما يلي last nameالمثال عندما نريد تسمیة متغیر لیعبر عن

Last_name ولكن يفضل تسمیة كما يلي lastName.

:ات عند تسمیة المتغیر ھامةاتمالحظ

ن المتغیر إكما نعلم فإن لغة الجافا سكربت تمیز بین حالة الحروف الكبیرة والصغیرة فlastName لیس مثل المتغیر LastName.

.عملیة التعديل في البرنامج دائما حاول أن تكون أسماء المتغیرات ذات داللة تبسط علیك في المستقبل


36

:تعريف المتغیرات

وقبل أن . إلیھا كن في ذاكرة الجھاز لحفظ البیانات التي تسنداأن المتغیرات ھي أسماء لحجز أم كما غلمنا

var األمر تستخدم أيا من ھذه المتغیرات البد من اإلفصاح عنھا ، وذلك بإستخدام

var firstName;

ا مااليمكنك عمله بواسطة الفیجوال أكثر من متغیر في سطر واحد ، وھذ أنه من الممكن اإلعالن عن وھكذا ، كما ..ت بیسك سكرب

var firstName, lastName, userID;

: يمكننا إسناد القیم الى ھذه المتغیرات أثناء تعريفھا واإلفصاح عنھا، كما يلي وأخیرًا ، لمزيد من التبیسط ،

var firstName, lastName = "علي", userID = 13;

لغة سكربتعن أي متغیر قبل إستخدامه فإن ذلك سیوقف عمل البرنامج ، والتنسى أن الجافا لم تفصحتذكر أنه إذا

ومصطلحاتھا السكربت والوظائف دائما حتى في أوامر الجافا X غیر x ـحساسة تجاه األحرف كما ذكرنا سابقا ف . المحجوزة

رحیب للمستخدم بعد إدخال اسمهتمرین إلظهار رسالة ت

<HTML> <Title> المتغیرات </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

:كما يلي یمة محمد بعد إدخال األسم بقويكون الناتج


37

: okوبعد الضغط علي الزر


38

كما يلي promptالقیمة الراجعة من األمر به خزن ثم userName اإلعالن عن متغیر باسم وكما نري فقد تم

var username = prompt(" أدخل هنا اسمك" ,"ما هو اسمك ؟");

:كما يلي " : مرحبا بك یا " مضافا إلیھا نص userNameثم قمنا بطباعة القیمة المخزنة بالمتغیر

var username = prompt(" أدخل هنا اسمك" ,"ما هو اسمك ؟"); alert( " : مرحبا بك یا " + username );

وعمره بیانات المستخدم بعد إدخال اسمهتمرین إلظهار

<HTML dir=rtl> <Title> المتغیرات </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

:كما يلي okختیار بعد إويكون الناتج


39

:كما يلي محمدبعد إدخال األسم بقیمة ويكون الناتج


40


41

الكلمات المحجوزة

على التي اليمكنك نسب أي متغیرات إلیھا سكربت المحجوزة ، وھي أوامر الجافا سكربت الجافاأو مصطلحات . اإلطالق ، كما في كل لغات البرمجة المعروفة

وستجد جدوال مبینا لھا . حفظھا كاملة ، وإنما اإللمام بھا طبعا اليجب علیك

true in break typeof int continue var labeled do void new else while null false with return for switch function this if

protected final abstract public finally boolean short float byte static goto case synchronized implements catch super import char throw instanceof class throws interface const transient long default try native delete package double private extends


42

الرابعالفصل

المعامالت


Operatorsالمعامالت •

o معامالت رياضیةArithmetic Operators o معامالت دمج النصوصConcatenation Operators o معامالت المقارنةComparison Operators o معامالت منطقیةLogical Operators o حادية معامالت اUnary Operators o معامالت تغیر القیمAssignment Operators o معامالت التعامل بالنظام الثنائيShift & Bitwise Operators o معامالت خاصة

Operator Precedenceأولوية تنفیذ المعامالت • Exception Handling األخطأ معالجة • with جملة •


43

Operatorsالمعامالت . قیم المتغیرات بینتعامللبر المعامالت ھي الوسیط األساسي لتعت

:وتنقسم المعامالت إلي غدة أقسام كما يلي

Arithmetic Operatorsمعامالت رياضیة • Concatenation Operators معامالت دمج النصوص • Comparison Operators معامالت المقارنة • Logical Operators معامالت منطقیة • Unary Operators ت احاديةمعامال • Assignment Operators القیمریغتمعامالت • Shift & Bitwise Operators معامالت التعامل بالنظام الثنائي • معامالت خاصة •

Arithmetic Operatorsمعامالت رياضیة

.تستخدم إلجراء العملیات الرياضیة من جمع وطرح وضرب وقسمة وباقي القسمة

.دم إلجراء عملیات الجمع الرياضي تستخ+ : • . الرياضي الطرحتستخدم إلجراء عملیات : - • . الرياضي الضربتستخدم إلجراء عملیات : * • . الرياضي القسمةتستخدم إلجراء عملیات : / • باقي القسمة الرياضي حسابتستخدم ل : % •

:مثال

alert( 5 % 2 );



44

Concatenation Operatorsمعامالت دمج النصوص

:تستخدم لدمج النصوص كما يلي تستخدم إلجراء عملیات الجمع الرياضي كما + : •

var username = "محمد"; alert( " : مرحبا بك یا " + username );


Comparison Operatorsمعامالت المقارنة

إلجراء عملیات المقارنةمتستخد

.false أو true مقارنة يكون ناتج ھذة المقارنة إحدي القیم اما عند إجراء . في القیمةساويانلتعین ھل طرفي المقارنة مت== : • .نوع البیانات لتعین ھل طرفي المقارنة متساويان في القیمة و= : == • . في القیمةانغیر متساوي لتعین ھل طرفي المقارنة : =! • .نوع البیانات متساويان في القیمة و غیرلتعین ھل طرفي المقارنة=! : = • .لتعین ھل الطرف األيسر أكبر من الطرف األيمن : < • .لتعین ھل الطرف األيسر أقل من الطرف األيمن : > • .لتعین ھل الطرف األيسر أكبر أو يساوي الطرف األيمن : =< • .ل الطرف األيسر أقل من أو يساوي الطرف األيمن لتعین ھ : => •

:الحظ

: كما بالمثال التالي نیمرتیین متتالیت" =" عند تعین ھل الطرفین متساويان يم أستخدام الحرف

:مثال

alert( "5 == 2 : " + (5 == 2) ); alert( "7 == 7 : " + (7 == 7) );


45


Logical Operatorsمعامالت منطقیة

. false أو trueوغالبا ما تكون أطراف المقارنة إحدي القیم ، تستخد إلجراء مقارنة منطقیة .false أو true مقارنة يكون ناتج ھذة المقارنة إحدي القیم اما عند إجراء

• &&: وغیر ذلك trueدما يكون طرفي المقارنة يساوي عنtrueوتقوم بإرجاع القیمة " و"تعني العملیة المنطقیة

: كما يلي falseسوف يؤدي إلي إرجاع القیمة

القیمة القیمة الناتجTrue True True False False True False True False False False False

• || : يساوي أو كالھماطرفي المقارنة احدي عندما يكونtrueوتقوم بإرجاع القیمة " وأ"تعني العملیة المنطقیة

true وغیر ذلك سوف يؤدي إلي إرجاع القیمة false كما يلي :

القیمة القیمة الناتجTrue True True True False True True True False False False False


46

• !:

: بعكس القیمة كما يلي وتقوم" ال"تعني العملیة المنطقیة

یمةالق الناتج False True True False

:ة مثلأ

alert( true && false );


alert( true || false );


alert( !true );



47

alert( !( 5 > 7 ) );


Unary Operatorsحادية االت معامالال

.تستخدم إلجراء العملیات الرياضیة من جمع وطرح بشكل مختصر جدا ) operand(وتسمي ھذه المعامالت بأنھا معامالت احادية ألنھا تتعامل مع طرف واحد

.قدار واحد صحیحمالممرر لھا ب) العامل(زيادة قیمة الطرف تستخدم ل+ : + • . قدار واحد صحیحمالممرر لھا ب) العامل(ص قیمة الطرف تستخدم إلنقا: - - •عكس إشارة العامل الممرر لھا فإذا كانت قیمة سالبة فسوف تتحول إلي قیمة موجبة تستخدم ل: - •

.والعكس صحیح

:الحظ : حالة قبلیة وأخري بعدية كما يلي -- و ++حالتان للمعاملین يوجد

:)Postfix(الحالة البعدية

:الحظ معي المثال التالي بعد اإلنتھاء من إجراء السطر الحالي )-- ( أو النقص (++)فیھا يتم إجراء عملیة الزيادة

:مثال

<HTML dir=rtl> <Title> ت االحادیةالمعامال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript"> 


48

</SCRIPT> </HEAD> </HTML>

:الحظ السطر التالي

num2 = num1++;

num1 ولكن بالوضع البعدي ألنه أتي بعد العامل ++يتم فیه استخدام المعامل االحادي :الیین وھذا السطر يكافئ السطرين التت

num2 = num1; num1 = num1 + 1;

:يكون الناتج كما يلي لذلك

:)Prefix( القبلیةالحالة : السطر الحالي الحظ معي المثال التالي تنفیذ قبل إجراء) --(أو النقص (++) فیھا يتم إجراء عملیة الزيادة

:مثال

<HTML dir=rtl> <Title> دیةالمعامالت االحا </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


num2 = ++num1;

num1 العامل قبل ألنه أتي القبليولكن بالوضع ++ دام المعامل االحادي يتم فیه استخ :وھذا السطر يكافئ السطرين التتالیین

num1 = num1 + 1; num2 = num1;



50

: الحظ معي األمثلة التالیة

:مثال

var num1 = 3, num2; num2 = ++num1 + 4; alert( "num1 = " + num1 ); alert( "num2 = " + num2 );

:ال حظ ان السطر التالي

num2 = ++num1 + 4;

:يكافي السطريین التتالیین

num1 = num1 + 1; num2 = num1 + 4;


:مثال

var num1 = 13; num1--; alert( "num1 = " + num1 );

:يكون الناتج كما يلي و


51

:مثال

var num1 = 13; alert( "num1 + 1 = " + (num1 + 1) ); alert( "num1 = " + num1 ); alert( "num1 + 1 = " + ++num1 ); alert( "num1 = " + num1 );

:لناتج كما يلي يكون او


52

num1الحظ أن السطر التالي لم يؤثر في قیمة

alert( "num1 + 1 = " + (num1 + 1) );

Assignment Operators القیم غیرمعامالت ت

تستخدم لتغیر قیمة المعامل الموجود بالطرف األيسر

.األيمنقیمة الطرف األيسر بقیمة الطرف ریلتغ: = • .لزيادة قیمة الطرف األيسر بمقدار قیمة الطرف األيمن : =+ • . قیمة الطرف األيسر بمقدار قیمة الطرف األيمن نقصل : =- • .ر لضرب قیمة الطرف األيسر في قیمة الطرف األيمن ووضع الناتج لیكون قیمة الطرف األيس : =* • .ر ف األيمن ووضع الناتج لیكون قیمة الطرف األيس قیمة الطرعليقیمة الطرف األيسر لقسمة : =/ •قسمة قیمة الطرف األيسر علي قیمة الطرف األيمن ووضع الناتج لیكون قیمة الطرف حساب باقي ل :=% •

.األيسر

:مثال

var num = 6; num += 5; alert( "num : " + num );



53


num += 5;

: وھذا السطر يكافئ السطر التالي 5المقدار numالمتغیر ويعني أضف إلي قیمة

num = num + 5;

:مثال

var num = 6; num *= 5; alert( "num : " + num );


& Bitwise Operators Shiftمعامالت التعامل بالنظام الثنائي

قبل الحديث عن معامالت النظام الثنائي دعني أخذك لنري لمحات في عالم الثنائیات أو نظام العد الثنائيوال أخفي علي اي مبتدأ في عالم البرمجیات أو ربما المتوسطین أيضا أن دخول ھذا المنعطف ربما ال يكون سھل

.ولكن دعنا نتوكل علي اهللا فھو خیرا معین

ائيالنظام الثن

.ھو أحد أنظمة العد مثل النظام العشري المعتاد لنا . الصفر و الواحد فقط وھما رقمینلكن النظام الثنائي يعتمد علي

الحواسب في بدايات تطوير برامج للحاسبات بما كان يعرف بلغة األلة ستخدامه لبرمجةإوھذا النظام العددي تم machine language الن الوحدة اإللكترونیة ( تتعامل في حساباتھا بالنظام الثنائي حاسب وحدات بناء النوذلك ال

وعدم وجود إشارة نتیجة ، إغالق الدائرة اإللكترونیة ال تستطیع تمیز إال حالتان وھما وجود إشارة إلیكترونیة نتیجة .)فتح الدائرة اإللكترونیة

٠ والـ ١ا فإن كنا نريد تمثیل األعداد وال نملك إال رقمین فقط وھم

٠ و ١نقوم بعملیة دمج الرقمین عشرة عندما نريد تمثیل العدد لذلك قیاسا علي ما تعلمناه في النظام العشري . وھكذا عندما نخرج عن نطاق نظام العد ١ و ١نقوم بدمج الرقمین الحادي عشروعند تمثیل العدد

وھكذا٠ و ١نقوم بدمج الرقمین أثنین نريد تمثیل العدد وبما أن النظام الثنائي ال يتمیز إال برقمین فقط فعندما

١٠ يمثل في النظام الثنائي كما يلي ٢فالعدد العشري ١١ يمثل في النظام الثنائي كما يلي ٣العدد العشري و


54

.المختلفه وتوجد أسالیب رياضیة لن نتطرق لھا تستخدم في التحويل بین أنظمة العد

Bitwise Operatorsمعامالت التعامل بالبت تستخدم لتتعامل مع القیمة الثنائیة لكال الطرفین

:وعمل مقارنه منطقیة لكل بت علي حدي كما سیتضح فیما يلي

• &: &&تتعامل مثل المعامل المنطقي

.واحد تلو األخربت ، ولكن تتعامل لیس بالقیمة الكلیة للطرفین ولكن تتم المقارنة علي مستوي البت • |:

||تتعامل مثل المعامل المنطقي .بت واحد تلو األخر، ولكن تتعامل لیس بالقیمة الكلیة للطرفین ولكن تتم المقارنة علي مستوي البت

• ~: !تتعامل مثل المعامل المنطقي

.بت واحد تلو األخر ، ولكن تتعامل لیس بالقیمة الكلیة للطرفین ولكن تتم المقارنة علي مستوي البت • ^:

ولكن|| مثل المعامل المنطقي XORتتعامل بمفھوم الـ وغیر ذلك سوف يؤدي إلي إرجاع true عندما يكون احدي طرفي المقارنة يساوي trueتقوم بإرجاع القیمة

: كما يلي falseالقیمة

القیمة القیمة الناتجFalse True True True False True True True False False False False

:مثال

alert( 2 & 3 );


:تفسیر الناتج كما يلي ٢ ١ ٠ ٣ ١ ١ ٢ ١ ٠

:مثال

alert( 2 | 3 );


55


:تفسیر الناتج كما يلي ٢ ١ ٠ ٣ ١ ١ ٣ ١ ١

:مثال

alert( 2 ^ 3 );

: كما يلي ويكون الناتج

:تفسیر الناتج كما يلي ٢ ١ ٠ ٣ ١ ١ ١ ٠ ١

Shift Operators معامالت اإلزاحةأما

كما يلي إلي الیمین أو الیسار حسب نوع اإلزاحة bitsللبتات ) تحريك ( لعمل أزاحة تستخدم

• >> : ف األيمنمقادر قیمة الطرالیمین لعدد من البتات يكافيء تقوم بعمل إزاحة ناحیة

لقیمة العدد بالطرف األيسر• <<:

لعدد من البتات يكافيء مقادر قیمة الطرف األيمنالیسارتقوم بعمل إزاحة ناحیة لقیمة العدد بالطرف األيسر


56

:مثال

var num = 6 , num1 , num2; num1 = num >> 1; alert( "num1 : " + num1 ); num2 = num >> 2; alert( "num2 : " + num2 );


:كما يلي تفسیر الناتج و

فعند إزاحة ھذا العدد الثنائي ناحیة الیمین بمقدار بت واحد سوف يصبح ، بالنظام الثنائي١١٠ بالعدد ٦يمثل العدد ١ جھة الیمین يكون العدد كالتالي وإذا تم إزاحة بمقدار بت أخر، بالنظام العشري ٣اي ما يكافئ العدد ١١كالتالي

: كما يتضح بالشكل التالي بالنظام العشري ١اي ما يعادل

:مثال

var num = 6 , num1 , num2; num1 = num << 1; alert( "num1 : " + num1 );


57

num2 = num << 2; alert( "num2 : " + num2 );


:كما يلي فسیر الناتج تو

بمقدار بت واحد سوف يصبح الیسارفعند إزاحة ھذا العدد الثنائي ناحیة ، بالنظام الثنائي ١١٠ بالعدد ٦يمثل العدد وإذا تم إزاحة بمقدار بت أخر جھة الیمین يكون العدد ، بالنظام العشري ١٢اي ما يكافئ العدد ١١٠٠كالتالي بالنظام العشري ٢٤ اي ما يعادل ١١٠٠٠كالتالي

معامالت خاصة

• ? : : (Ternary operator)ويسمي أيضا معامل تیرنري (conditional operator)المعامل الشرطي

:الشكل العام له

; القیمة عندما یكون ناتج الشرط خطأ : القیمة عندما یكون ناتج الشرط صحیحة ?( الشرط )

:مثال

var num1 = 6 ,num2; num2 = ( num1 > 3 )? 5 : 100; alert( "num2 : " + num2 );

true سوف يكون ( num1 > 3 )وألن ناتج المقارنة :يكون الناتج كما يلي لذلك


58

:مثال

var num1 = 6 ,num2; num2 = ( num1 < 3 )? 5 : 100; alert( "num2 : " + num2 );

false سوف يكون ( num1 < 3 )ن ناتج المقارنة وأل :يكون الناتج كما يلي لذلك


59

Operator Precedenceأولوية تنفیذ المعامالت

كما تعلمنا جمیعا بالمرحلة اإلبتدائیة أن العملیات الرياضیة من جمع و طرح وقسمة وضرب تختلف أولوية تنفیذه .لیات الضرب والقسمة أكبر من أولوية إجراء عملیات الجمع و الطرححیث أن أولوية إجراء عم

.وأولوية عملیات الضرب والقسمة متساوية .وأيضا أولوية عملیات الجمع والطرح متساوية

) . ولسنا بصغاروتاهللا ما زلنا صغارا( فجزي اهللا كل خیر من علمنا العلم ونحن صغارا

لحسابیة تعالي معي نبحث ھذه العملیة ا

2 + 4 * 3

؟١٤ أم ١٨ ھذه العملیة الحسابیة ھل يكون الناتج ةفما نتیج ولكن ھذا غیر ١٨ يكون الناتج ٣ ثم عند ضرب ھذا الرقم في العدد ٦ ينتج العدد ٤ علي الرقم ٢لو تم جمع الرقم

ا علمنا من قلیل أن أولوية إجراء عملیات ولكنن، صحیح رياضیا ألننا أجرينا عملیة الجمع أوال ثم إجرينا عملیة الضرب أي أننا ينبغي أن ننفذ عملیة الضرب أوال وتكون ، الضرب والقسمة أكبر من أولوية إجراء عملیات الجمع و الطرح

:الخطوات كالتالي .١٤ ويكون الناتج ٢ ثم يتم جمعه علي العدد ١٢ وينتج عنه العدد ٣ في العدد ٤يتم ضرب العدد

:مثال

var num1 = 2 ,num2 = 4 , num3; num3 = num1 + num2 * 3; alert( "num3 : " + num3 );


بإستخدام ما يسمي ولكننا تعلمنا مما درسناه في منھج الرياضیات أننا يمكننا تغیر أولوية تنفیذ العملیات الرياضیة ن العملیات الحسابیة الموجودة داخل ھذه األقواس ذات أعلي أولويةوتكو أقواس المجموعات

:كما بالمثال التالي


60

:مثال

var num1 = 2 ,num2 = 4 , num3; num3 = (num1 + num2) * 3; alert( "num3 : " + num3 );


:الحظ معي السطر التالي

num3 = (num1 + num2) * 3;

num1 + num2الحظ وجود األقواس حول العملیة الحسابیة .مما يجعل أولوية إجراء ھذه العملیة أكبر من أولوية إجراء عملیة الضرب

١٨ يكون الناتج ٣ ثم عند ضرب ھذا الرقم في العدد ٦ ينتج العدد ٤ علي الرقم ٢فیتم جمع الرقم

:مثال

var num1 = 2 ,num2 = 4 , num3; num3 = ( (num1 + num2) / 2 + 6 ) * 3; alert( "num3 : " + num3 );



61

Exception Handlingمعالجة األخطأ

ال التالي دعنا نري المثمع أنك لم تخطأ في كود البرنامج وال تكون أخطاء لغوية وربما يصادفك حدوث بعض المشاكل

:مثال

<HTML dir=rtl> <Title> معالجة األخطا </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

ائه قیمة فال يمكن إستخدامه إعط لم يتم تعريفة والnum3وبما أن المتغیر المسمي

: ويكون الناتج كما يلي

اي رسالة خطأErrorكما يتضح من الرسالة أنھا رسالة غیر معرف أو غیر معروف لدي num3اي أن المتغیر المسمي " num3 is undefined"وتشیر الرسالة إلي أن

.البرنامج


62

ألخطأ ؟ ولكن السؤال األن ھل يمكن تجنب وقوع ا

catch و الـ tryيمكنك تجنب حدوث األخطأ باستخدام صیغة ، نعم

الصیغة العامة try{ }catch( e ){ }

الجملة فإذا حدث اي خطأ ينتقل المفسر إلي منطقة األكواد بین أقواسtryيتم كتابة األكود بین أقواس الجملة

catchأ جرت العادة لتسمیة ھذا المتغیر باسم ل مواصفات ھذا الخط ويتم تحمیل كائن مخصص لحمe النه يدل علي Exception حدوث إستثناء

التالي ة كتبإعادة كتابولمعالجة المثال السابق نقوم

:مثال

<HTML dir=rtl> <Title> معالجة األخطا </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



63

: وخائصه ھي eويمكننا إظھار رسالة الخطأ األساسیة بإستخدام خصائص الكائن

• Name

وتعبر عن اسم الخطأ• Message

محتوي نص رسالة الخطأوتعبر عن• Number

رقم الخطأوتعبر عن• Description

رسالة تفصیلیة للخطأوتعبر عن

نقوم بإعادة كتابة المثال السابق كالتالي :مثال

<HTML dir=rtl> <Title> معالجة األخطا </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



64

throwإستحداث خطأ بإستخدام الجملة

بطريقتین ، throwويتم ذلك بإستخدام األمر ، في بعض األحیان نحتاج إلي إستحداث خطأ ما

أولھما

كما يليھذا المثال لیس به اي خطأ ولكننا سوف نستحدث ھذا الخطأ

<HTML dir=rtl> <Title> معالجة األخطا </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


كما بالسطر التاليthrowتم كتابة رسالة الخطأ بعد األمر من المثال السابق

throw "هذا خطأ لیس حقیقي ولكنه مستحدث";

eأ في المتغیر حامال معه رسالة الخطcatchفعند تنفیذ ھذا األمر ينتقل المفسر إلي الجملة بعدھا قمنا بطباعة رسالة الخطأ كما يلي

}catch( e ){ alert( " : رسالة الخطأ " + e ); }


65

throwثم إرساله إلي األمر Error ھو عمل خطأ من الكائن ثانیھما

بالمثال التاليكما

مثال

<HTML dir=rtl> <Title> معالجة األخطا </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

بالجزء الثاني من ھذا الكتاب إن شاء اهللاErrorولن نخوض كثیرا في ھذا المثال حتي نقوم بشرح الكائن


66

withجملة

يمكننا أن نجعل ھذا الكائن ، تابعة لكائن واحد functions و أو وظائف properties بإستخدام خصائص عندما تقوم .يشیر إلي خصائصه و وظائفه بدون تكرار كتابته قبل كتابة الخاصیة أو الوظیفة

withالصیغة العامة لجملة

with( اسم الكائن المستهدف عدم تكراره ) { األكواد // ربما تحتوي األكواد علي خصائص أو وظائف لهذا الكائن // }

وبالمثال يتضح المقال :مثال

withھذا المثال بدون إستخدام جملة

<HTML dir=rtl> <Title> جملةبدون with </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما يلي windowلكائن وكما تري بالمثال السابق قد قمنا بتكرار كتابة ا

var familyName = window.prompt("ما هو اسم العائلة ؟"); window.alert(" : مرحبا بك یا " + userName ); window.alert(" : مرحبا بعائلة " + familyName );

:ال التالي كما بالمثwindow بإستخدام الكائن windowويمكننا أن نقوم بإلغاء تكرار كتابة الكائن


67

withھذا المثال بإستخدام جملة

<HTML dir=rtl> <Title> جملة with </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

إلي نفس الناتج بالمثال السابق المثالويؤدي ھذا

:سطر التالیة باألwithويتضح طريقة إستخدام جملة

with( window ){ var familyName = prompt("ما هو اسم العائلة ؟"); alert(" : مرحبا بك یا " + userName ); alert(" : مرحبا بعائلة " + familyName ); }

ثم اي خاصیة أو with مرة واحدة بین أقواس جملة تهبل تم كتاب ، windowكما تري لم نقم بتكرار كتابة اسم الكائن

window يمكنك تجاھل كتابة اسم الكائن withواس المجموعة لجملة قلكائن تم كتابتھا بین أوظیفة تابعة لھذا ا .التابع له

:مالحظة

. بدون فائدة withلكن ھذا يجعل جملة و with بعد إستخدام جملةكتابة اسم الكائن وحتي يمكنك :كما يلي

with( window ){ var familyName = prompt(" ;(" اسم العائلة ؟ما هو window.alert(" : مرحبا بك یا " + userName ); alert(" : مرحبا بعائلة " + familyName ); }


68

:withتداخل جملة

:لي بالمثال التا كما with لجمل nestingيسمح بعمل تداخل

مثال

<HTML dir=rtl> <Title> جملة with </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

: كما يلي document واألخري للكائن window أحدھما للكائن withكما تالحظ أنه تم تداخل جملتین لـ

with( window ){ var familyName = prompt("ما هو اسم العائلة ؟"); alert(" : مرحبا بك یا " + userName ); alert(" : مرحبا بعائلة " + familyName ); with تداخل لجمل // with( document ){ write(" مرحبا بفكرة تداخل جمل with <br>" ); writeln(" إلي اللقاء مع الفصل القادم "); alert الحظ أن هذه الوظیفة // تابعة لجملة // // with األولي alert(" : إلي اللقاء لعائلة " + familyName ); } }


69

خامسالالفصل سار البرنامج التحكم في م


Conditional Statements جمل الشرط •o جملة الشرطif o جملة الشرطswitch

Iteration Statementsجمل التكرار والحلقات •

o جملة التكرارfor o جملة التكرارwhile o جملة التكرارdo while


70

Conditional Statements جمل الشرط

علي سبیل المثال قبل أن تبدأ في ما نحتاج إلتخاذ بعض القرارات ھل نفعل كذا أم كذا دائما في حیاتنا المعاصرة ؟ھل أنت في حاجة لتعلم ھذه اللغةتعلم لغة الجافا سكربت ربما تبادر لك ھذا السؤال إجابتك علي ھذا السؤال تكون قد حددت مسارك في األيام وب، وھذا السؤال يحتمل إحدي اإلجابات إما نعم أو ال

وإذا كانت إجابتك ، لما إستطعت قرأت ھذا النص المكتوب بین يديك بالعلي سبیل المثال لو كانت إجابتك ، القادمة .بنعم فسوف تكون من قارئي ھذا النص

مسار الوھذه الجملة تحدد جمل شرطا في نحتاج لوضعھإختیاراتنخلص مما سبق إلي أننا دائما ما تطرح أمامنا

فعلي سبیل المثال لجملة الشرط، اإلختیار حسب ال واألخر نعمولیس أمامك إال إختیاران أحدھما ھل تريد أن تتعلم لغة الجافا سكربت ؟ نا إال نفسك وإذا كان الخیار بال فال تلوم، إن شاء اهللا فمن جد وجد فعندما تقول نعم فسوف تجني ثمار ما تعلمت

.لتفريطك في أخذ العلم النافع

ifجملة الشرط .وتستخدم لعمل تفريع بمسار البرنامج ifمن أشھر جمل الشرط الجملة

if الشرطالعامة لجملةالصیغة

:كما يلي ifتوجد عدة صیغ لجملة الشرط

: if الصیغة الفردية أو اي قیمة عددية غیر الصفر أو (trueملة الشرط تكافي القیمة فإذا كانت ججملة الشرطوفیه يتم حساب قیمة

، ifعندئذ يتم تنفیذ األكواد بین أقواس جملة الشرط ف، ) nullقیمة نصیة غیر قیمة النص الفارغ أو القیمة اي تنفیذ األكواد سوف يتم تجاھل) أو القیمة العددية صفر أو القیمة النصیة الفارغة ( falseوإذا كانت تكافئ القیمة .بین أقواس جملة الشرط

if( جملة الشرط ) { األكواد // }

مثال

var num = 78; if( num >= 50 ) { alert( " المتغیر num = " + num + "\n ٥٠أكبر من أو یساوي " ); }



71

:if ... else الصیغة المزدوجة

أو اي قیمة عددية غیر الصفر أو (true فإذا كانت جملة الشرط تكافي القیمة جملة الشرطوفیه يتم حساب قیمة

،ifفعندئذ يتم تنفیذ األكواد بین أقواس جملة الشرط ، ) nullاي قیمة نصیة غیر قیمة النص الفارغ أو القیمة سوف يتم تجاھل تنفیذ األكواد ) دية صفر أو القیمة النصیة الفارغة أو القیمة العد ( falseوإذا كانت تكافئ القیمة .else ثم يتم تنفیذ األكواد المنحصرة بین أقواس الجملة if بین أقواس جملة الشرط

if( جملة الشرط ) { األكواد // }else{ األكواد // }

مثال

var num = 18; if( num >= 50 ) { alert( " المتغیر num = " + num + "\n ٥٠أكبر من أو یساوي " ); }else{ alert( " المتغیر num = " + num + "\n ٥٠أقل من " ); }


:كبةرالصیغة الم

أو اي قیمة عددية غیر (trueة فإذا كانت جملة الشرط تكافي القیم األوليجملة الشرطوفیه يتم حساب قیمة

ifفعندئذ يتم تنفیذ األكواد بین أقواس جملة الشرط ، ) nullالصفر أو اي قیمة نصیة غیر قیمة النص الفارغ أو القیمة سوف يتم تجاھل تنفیذ األكواد ) أو القیمة العددية صفر أو القیمة النصیة الفارغة ( falseوإذا كانت تكافئ القیمة ،

نتقل ألي جملة الشرط التالیة ويفعل معھا مثل ما سبق فإذا كانت كل جمل الشرط ثم يifواس جملة الشرط بین أقتنفیذ األكواد المنحصرة بین أقواس الجملة فإن وجدت فسوف يتم else فسوف يتم البحث عن جملة falseتؤول إلي

else وإن لم يجد جملةelseفلن يتم تنفیذ شئ .

if( ١شرط رقم جملة ال ) { األكواد // else if( ٢جملة الشرط رقم ) { األكواد // }else{ األكواد // }


72

: كما يلي else بدون وأ

if( ١جملة الشرط رقم ) { األكواد // else if( ٢جملة الشرط رقم ) { األكواد // }

مثال var num = 48; if( num >= 1 && num <= 10 ) { alert( " العدد num \n ١٠ و ١محصور بین " ); }else if( num > 10 && num <=20 ){ alert( " العدد num \n ٢٠أو تساوي وأقل من ١٠أكبر من " ); }else if( num > 20 && num <=30 ){ alert( " العدد num \n ٣٠أقل من أو تساوي و٢٠أكبر من " ); }else{ alert( "العدد num \n ٣٠أكبر من " ); }


مثال elseھو نفس المثال السابق ولكن بدون جملة

var num = 48; if( num >= 1 && num <= 10 ) { alert( " العدد num \n ١٠ و ١محصور بین " ); }else if( num > 10 && num <=20 ){ alert( " العدد num \n ٢٠ وأقل من أو تساوي١٠أكبر من " ); }else if( num > 20 && num <=30 ){ alert( " العدد num \n ٣٠ وأقل من أو تساوي٢٠أكبر من " ); }


.من الشروط السابقة لعدم تحقق اي لن يتم ظھور اي رسائل


73

كلمة السرللكشف عنتمرین

<HTML dir=rtl> <Title> الكشف عن كلمة السر </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

:كما يلي ok ثم الضغط علي زرار ١٢ إدخال كلمة السر بقیمة بعدويكون الناتج

:كما يلي ok ثم الضغط علي زرار ١٢٣بعد إدخال كلمة السر بقیمة ويكون الناتج


74

:حاول أن تركز في األمثلة القادمة

مثال

var num = 4; if( ++num == 5 ) { alert( " العدد num \n ٥یساوي " ); }


مثال

var num = 4; if( num++ == 5 ) { alert( " العدد num \n ٥یساوي " ); }else{ alert( "num = " + num ); }



75

switchجملة الشرط

إذا ما دامت تؤدي نفس ، المزدوجة أو المركبة if مثل إستخدامنا لجملة الشرط switchتستخدم جملة الشرط

الشرطیة بدال منswitchحق لكننا نحتاج إلي جملة نعم أنت علي ، فما الحاجة إلیھا ifوظیفة الجملة .لتسھیل شكل الكود if ... elseجملة

العامةالصیغة

switch( المتغیر أو العملیة المراد مقارنتها ) { case " ١قیمة " : األكواد // break; case " ٢قیمة " : األكواد // break; case " ٣قیمة " : األكواد // break; default : األكواد // }

: كما يلي default بدون وأ

switch( المتغیر أو العملیة المراد مقارنتها ) { case " ١قیمة " : األكواد // break; case " ٢قیمة " : األكواد // break; case " ٣قیمة " : األكواد // break; }

فإذا تساوت switchجملة ) cases(بالقیم الموجودة بحاالت المتغیر أو العملیة المراد مقارنتھايتم مقارنة

وإن لم يتم ، وتنفیذ األكواد التي بداخلھا caseإحداھما مع قیمة المتغیر المقارن يتم الدخول داخل ھذة الحالة فإذا وجدت يتم الدخول default يتم البحث عن الحالة الخاصة switchة تساوي القیمة المقارنة باي من حاالت جمل

.ة بھا وداألكواد الموجفیھا ثم تنفذ

:مالحظة .switch حتي تنھي جملة breakيجب وضع األمر fall through ي أو ما يسمي بعملیة السقوطلتفادي حدوث

. كما سنري باألمثلة القادمة ولكن في بعض األحیان نحتاج لعدم تالفي عملیة السقوط


76

مثال

<HTML dir=rtl> <Title> جملة الشرط switch </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



77

مثال

<HTML dir=rtl> <Title> جملة الشرط switch </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما تالحظ بالسطر ذو اللون األحمر

٤ أو ٣ أو ٢ أو ١ بإحدي القیم numيتم دخول ھذه الحالة إذا تساوت القیمة switch( num ) { case 1 , 2 , 3 , 4: alert( " العدد num \n ٤ أو ٣ أو ٢ أو ١ربما یساوي " ); break;


:الحظ معي التالي :أن ھذه الحالة تكافيء التالي

switch( num ) { case 1 : case 2 : case 3 : case 4 : alert( " عدد ال num \n ٤ أو ٣ أو ٢ أو ١ربما یساوي " ); break;


78

التاليمثاللكما با

<HTML dir=rtl> <Title> جملة الشرط switch </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

إذا و ، بل أردنا إحداث ھذا السقوطfall through عملیة السقوط لتفادي حدوث breakوھنا لم نضع الجملة

.سوف يتم تنفیذ نفس قطعة الكود ٤ أو ٣ أو ٢ أو ١ بإحدي القیم numتساوي القیمة تصادف

، break ال يوجد بھا األمر ٢ ألن الحالة ٣سوف يتم السقوط إلي الحالة ، ٢ تساوي القیمة numفإذا كانت القیمة ثم يتم ، switch تنفیذ جملة ء الخاص بإنھاbreak لیس بھا األمر ٣ألن الحالة ٤ثم يحدث سقوط أخر إلي الحالة

. ٤ بالحالة break نتیجة وجود األمر switchثم يتم إنھاء الجملة ، ٤الكود الموجود بالحالة تنفیذ


79

Iteration Statementsجمل التكرار والحلقات

.مدي معین من المرات أو كواد لعدد الھدف من جمل التكرار ھو تكرار مجموعة من األ

ثالث مرات فسوف تقول لي ھذا " أن محتاج لجمل التكرار" أن تقوم بطباعة الجملة التالیة طلبت منكأنني ھب مرة مثال أو إلي عدد من المرات غیر محدد ١٠٠٠نعم سوف أصدقك ولكن ماذا لو زادت مرات التكرار إلي ، أمر سھل

. سنري عند الحديث علي جمل التكرار علي حدا يتوقف علي شرط ما كما

forالتكرار جملة

. ھو تكرار مجموعة من األكواد لعدد معین من المرات for التكرار ةالھدف من جمل


for ( إجراء زیادة أو نقص ; شرط التكرار ; كود البدایة ) { األكواد // }

مثال

٤ إلي ١باعة مجموع األرقام من يقوم بط

<HTML dir=rtl> <Title> حملة التكرار for</Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



80

. أول مرة فقط يتم تنفیذ جملة البداية forعند تنفیذ جملة

for( i=0; i<5 ; i++ ) { x += i; }

.forبین أقواس الجملة يتم تنفیذ األكواد trueثم يتم حساب جملة الشرط فإذا كانت تساوي

for( i=0; i<5 ; i++ ) { x += i; }

. forثم يتم تنفیذ األكواد بین أقواس الجملة

for( i=0; i<5 ; i++ ) { x += i; }

.ثم يتم حساب جملة الزيادة أو النقص

for( i=0; i<5 ; i++ ) { x += i; }

. forیذ األكواد بین أقواس الجملة يتم تنفtrueثم يتم حساب جملة الشرط فإذا كانت تساوي

for( i=0; i<5 ; i++ ) { x += i; }

. فتنتھي ھذة الحلقة false جملة الشرط ويساتوھكذا حتي

مثال

forمثل المثال السابق ولكن بعدم وضع جملة الشرط لجملة

<HTML dir=rtl> <Title> حملة التكرار for</Title> <HEAD> <SCRIPT LANGUAGE="JavaScript"> 


81

</SCRIPT> </HEAD> </HTML>

بالمثال السابقويكون الناتج كما

ولكن يوجد داخل كود جمل التكرار أحد جمل الشرط بھا كود يؤدي إلي إنھاء forجد جملة شرط لجملة الحظ أنه ال تو

.forدورة جملة

كما بالسطور التالیة

for( i=0; ; i++ ) { x += i; if( i == 4 ) break; }

for inجملة Arrays مثل المصفوفات objects لعمل تكرار للمتغیرات من النوع الكائني تستخدم

. ي من ھذا الكتابنوسوف نتحدث عنھا في الجزء الثا


for ( المتغیر in الكائن) { األكواد // }

breakجملة

do whileمل ج وwhileمل ج وforتستخدم إلنھاء جمل التكرار مثل جمل

continueجملة كما بالمثال وإلغاء تنفیذ األكواد التالیة لھا ، خري إلي جملة الشرط المحددة لعملیة التكرارتستخدم للرجوع مرة أ

:التالي

مثال ١٠ و ١األرقام الفردية بین يقوم بطباعة مجموع

<HTML dir=rtl> <Title> حملة التكرار for</Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


whileالتكرار جملة

وجودبدون، غیر محدد يتوقف علي جملة شرط كرار مجموعة من األكواد لعدد ت ھيwhile التكرار ةالھدف من جمل

.قیمة إبتدائیة وبدون جملة للزيادة أو النقصان


while ( شرط التكرار ) { األكواد // }

مثال

٥ و ١يقوم بطباعة األرقام بین

<HTML dir=rtl> <Title> حملة التكرار while</Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


83


for وجملة التكرار whileملة التكرار من المثال السابق ال نجد فرق بین ج عند التعرض إلي تنفیذ الكود بشكل متكرر حسب شرط غیر مرتبط whileولكن تظھر الحاجة إلي إستخدام جملة

:بعملیة حسابیة تكرارية كما بالمثال التالي

مثال في ھذا المثال بالكشف عن كلمة السرقومن

دخال كلمة السر حتي يتم إدخالھا بشكل صحیحفلو أدخلت كلمة السر خطأ يتم إعادة إ

<HTML dir=rtl> <Title> الكشف عن كلمة السر </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

do … whileالتكرار جملة

بداخلھا يتم تنفیذه مرة واحدة أن الكود الموجودي نھا تختلف فكول ، whileتتشابه مع وظیفة جملة التكرار ، عند أول مقارنة false حتي ولو كانت جملة الشرط تساوي علي األقل

.ألنه يتم تنفیذ الكود أوال ثم يتم تنفیذ جملة الشرط


do{ األكواد // }while ( شرط التكرار );

مثال

وتتم ھذه فلو أدخلت كلمة السر خطأ يتم إعادة إدخال كلمة السر ، ل بالكشف عن كلمة السرنقوم في ھذا المثا . مرات متتالیة عند إدخال كلمة سر خاطئة ٣العملیة

<HTML dir=rtl> <Title> الكشف عن كلمة السر </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


85

عن جمل التكرارأمثلة عامة

مثال

٨٠ إلي ٢٠بي لألعداد من احساب المتوسط الحس

<HTML dir=rtl> <Title> المتوسط الحسابي </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


مثال متقدم .رقممع عرض عدد البتات المكونة لھذا الثم نحوله إلي النظام الثنائي ، ينأخذ من المستخدم رقم بالنظام العشر

<HTML dir=rtl> <Title> التحویل للنظام الثنائي </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

يكون الناتج كما يلي٥ فعند إدخال الرقم


87

سادسالالفصل الدوال أو الوظائف

:ناقش إن شاء اهللا في هذا الفصل النقاط التالیة سوف ن

تمھید • تعريف الدوال أو الوظائف • أنواع الدوال • الصیغة العامة للدوال • تعريف الدوال • الدوالطريقة إستدعاء • والعامةمحلیةالمتغیرات ال • إسترجاع القیم من الدوال • تمرير المعامالت للدوال • Recursive Functionإستدعاء الدالة لنفسھا • inner Function داخل دالةةدال •


88

تمھید

ربما كنا في الفصل السابق نحتاج إلي إستخدام جزء من الكود بشكل تكراري لذلك إحتجنا لجمل التكرار مثل جملة for ، بالدوال أو ولكن لو كنا نريد إستخدام جزء من الكود بشكل دائما فسوف نلجأ إلي إستخدام ما يسمي

Functionsالوظائف

الحظ معي الحالة التالیة

var password = prompt(" أدخل كلمة السر ",""); if ( password == "123" ){ alert("مرحبا بك في موقعنا"); document.write("مرحبا بك في موقعنا <br>"); document.write("مدیر الموقع"); }else if ( password == "111" ){ alert("مرحبا بك في موقعنا"); document.write("مرحبا بك في موقعنا <br>"); document.write("مشترك بالموقع"); }else{ alert("كلمة السر خاطئة"); }

طور التالیةسالحظ معي ال

alert(" رحبا بك في موقعنام "); document.write("مرحبا بك في موقعنا <br>");

فھب أننا سوف نستخدمھا أكثر من مرتین فما الحل ، قد تم تكرارھا مرتین ف

بالطبع ھذا لیس بحل يروق لك ،ھل نقوم بتكرار ھذة الجمل كلما إحتجنا لھا ، وأنا معك أن ھذا الحل ال يروق لي أنا أيضا

نستطیع تنفیذ ، ) دالة أو وظیفة ( فسوف نقوم بوضع ھذيین السطرين داخل بوطقة ال تقلق الحل قد أتي بحمد اهللا .وقتما أردنا من األكواد ما بھا

وتكون علي الشكل التالي

function displayMessage() { alert("مرحبا بك في موقعنا"); document.write("مرحبا بك في موقعنا <br>"); }

قة حقیقیة إلي عالم البرمجة نطالإولكن تابع معي أول ، ولیس ھناك اي داعي لمحاولة فھم ما كتب األن

.مع الحديث عن الدوال أو الوظائف


89

تعريف الدوال أو الوظائف

. فذ كوحدة واحدةنبه وتوالوظائف ھي مجموعة من الجمل يطلق علیھا إسم ويشار إلیھا

أنواع الدوال يوجد نوعین من الدوال

built-in functionsالدوال المبنیة داخل لغة الجافا سكربت -يمكننا و ، parseIntمثل دالة المجموعة من الدوال تم بنائھا داخل لغة الجافا سكربت هھذ

.أستخدامھا كأي دالة قمنا بتعريفھا كما سنري فیما بعد ال المبنیة من خالل مبرمجي الجافا سكربتالدو -

. بشكل مفصل وھذا ھو النوع من الدوال الذي سوف نتحدث عنه في ھذا الفصل

دوالالصیغة العامة لل

function ( معامالت الدالة ) إسم الدالة { األكواد المراد تنفیذها // ربما تقوم الدالة بإرجاع قیمة // return القیمة الراجعة ; }

باإلضافة إلي أنھا ال ، نفس شروط تسمیة المتغیرات تخضع لاسم الدالة و ثم يلیھا function كلمة أوال نبدأ بكتابة -١

.built-in functionيجب أن تأخذ اي اسم لدالة مبنیة داخل لغة الجافا سكربت .ربما ال يتم تمرير معامالت لھا كما سوف نري الحقا ثم يتم تمرير معامالت لھا أو -٢ .ثم يتم كتابة األكواد المراد تنفیذھا بین أقواس المجموعة الخاصة بالدالة -٣ . كما سوف نري الحقابعدھا ربما تقوم ھذة الدالة بإرجاع قیمة أو ال ترجع اي قیم -٤

دوالتعريف ال

بكتابة احدي الدوال البسیطة وظیفتھا عمل التاليأن نقوم ، دوال دعنا بعدما علمنا الصیغة العامة لل .ثم إظھار رسالة ترحیب له ، أخذ اسم المستخدم


90

ھذه الدالة ال تأخذ معامالت وال تقوم بإرجاع اي قیم كما يلي showMessageلذلك سنقوم بعمل دالة باسم

function showMessage () { var userName = prompt("أدخل اسمك من فضلك",""); alert(" : مرحبا بك " + userName ); }

إستنادا علي ما تعلمناه للصیغة العامة للدوالنعم لقد تمكنا من بناء ھذه الدالة كیف يمكننا تنفیذ ما بداخلھا من أكواد ؟ولكن

الیة لإلجابة علي ھذا السؤال أتبعني في الفقرة الت

دوال الدعاءإستطريقة

: الدوال بعدة أشكال أحدھما إستدعاء ويمكننا ، الدالة اي تنفیذ ما بداخلھا من أكواد إستدعاءنعني ب دالة من خارج اي دالةإستدعاء - دالة من داخل دالةإستدعاء - Recursive functionدالة لنفسھا إستدعاء -

شه في أخر ھذا الفصلا نقیتمس، أكثر صعوبة وھذا النوع من الدوال إستخدامھا أن نقوم ب showMessageقمنا بتعريف الدالة دعنا بعدما

كما بالمثال التالي

مثال

<HTML dir=rtl> <Title> نداء الدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


91


يكون الناتج كالتاليمحمدوبعد إدخال االسم بالقیمة

كما بالسطر التالي بأقواس امتبوعسمھا اجمیل جدا لقد تم تنفیذ أكواد ھذا الدالة بمجرد كتابة

الدالة بإستدعاء نقوم // showMessage showMessage();

الحظ ما ھو أت

يوربما نحتاج لتنفیذ أحدي الدوال من داخل دالة أخر، أكثر من دالة ربما نحتاج في بعض األحیان لعمل كما بالمثال التالي

مثال

<HTML dir=rtl> <Title> بعضها لبعضنداء الدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

ويكون الناتج كما بالمثال السابق

الحظ معي السطور التالیة

showMessageمن داخل الدالة getName الدالة إستدعاءلقد تم

showMessage تعریف الدالة // function showMessage () { الدالة بإستدعاء نقوم // getName showMessage من داخل الدالة // getName(); alert(" : مرحبا بك " + userName ); } getName تعریف الدالة // function getName () { userName = prompt("أدخل اسمك من فضلك",""); }

الحظ أيضا التالي من داخل الدالة قیمتهوتم عرض ، getNameالدالة من داخل userNameتغیر قیمة المتغیر لقد تم

showMessageكما يلي

var userName; showMessage تعریف الدالة // function showMessage () { الدالة بإستدعاء نقوم // getName showMessage من داخل الدالة // getName(); alert(" : مرحبا بك " + userName ); } getName تعریف الدالة // function getName () {


93

userName = prompt("أدخل اسمك من فضلك",""); } الدالة بإستدعاء نقوم // showMessage showMessage();

. ف ھذا دعنا ننتقل للفقرة التالیة اكتشإلو، وھذا يقودنا إلي كیفیة تعامل الدوال مع المتغیرات

عامة و المحلیةالمتغیرات ال

Local variables المتغیرات المحلیة

فلن تستطیع عرض أو تعديل قیمة ھذا المتغیر إال من داخل ھذة الدالة المعرف بھا ، إذا تم تعريف المتغیر داخل دالة Local بمتغیر محليويسمي ھذا المتغیر ، وال يمكنك عرض أو تعديل محتويات ھذا المتغیر من داخل دالة أخري

variable كما بالمثال التالي

مثال

getJob تعریف الدالة // function getJob () { var userJob = prompt("أدخل اسمك من فضلك",""); } showJob تعریف الدالة // function showJob () { alert( " قیمة المتغیر userJob = " + userJob ); }

لذلك يعتبر ھذا المتغیر ، getJob تم تعريفه داخل الدالة userJob أن المتغیر المسمي كما بالمثال السابق نجد من خارج ھذه الدالة أو من داخل دالة userJobوال يمكن التعامل مع المتغیر getJobمتغیر محلي بالنسبة للدالة

.خارجیة أخري

كما بالسطر التالي سیؤدي ذلك لحدوث خطأ showJob من داخل الدالة userJobولو قمنا بعرض قیمة المتغیر

alert( " قیمة المتغیر userJob = " + userJob );


94

ھامةمالحظة

وسوف يتم ، يمكنك إستخدام نفس اسم المتغیر في أكثر من دالة بشرط أن يتم تعريفه داخل كل دالة علي حدي

الة المعرف بھا كما بالمثال التاليالتعامل مع كل متغیر علي حدي داخل الد

مثال

<HTML dir=rtl> <Title> المتغیرات المحلیة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كن يتم ل ، func2 و الدالة func1 تم تعريفه داخل الدالة userName نجد أن المتغیر المسمي كما بالمثال السابق

.كال حسب مكان تعريفه داخل الدالة التعامل مع ھذا المتغیر علي أساس أنھم متغیرين


95



96

Global variables عامةالمتغیرات ال

تستطیع عرض أو تعديل قیمة ھذا بھذا ، اي علي مستوي األسكربت العام دالةخارج نطاق اي تعريف المتغیر إذا تم كما بالمثال التالي Global variable عامبمتغیر ويسمي ھذا المتغیر ، أي دالة أو من خارجھما المتغیر من داخل

مثال

var userName; showMessage تعریف الدالة // function showMessage () { الدالة بإستدعاء نقوم // getName showMessage من داخل الدالة // getName(); alert(" : مرحبا بك " + userName ); } getName تعریف الدالة // function getName () { userName = prompt("أدخل اسمك من فضلك",""); } الدالة بإستدعاءنقوم // showMessage showMessage();

قد تم تغیر و ،دالة في الكود خارج نطاق اي تم تعريفه userNameكما بالمثال السابق نجد أن المتغیر المسمي

showMessage من داخل الدالة قیمتهوتم عرض ، getName من داخل الدالة userNameقیمة المتغیر


97

إسترجاع القیم من الدوال

.returnبإستخدام الكلمة المحجوزة ، للجملة التي قامت بإستدعائھا يمكن للدوال في الجافا سكربت إرجاع قیم .returnيتم وضع القیمة الراجعة من الدالة بعد الكلمة

تالي كما بالمثال الالة يمكن تخزينھا في متغیر أو تكون وسط جملة حسابیه القیمة الراجعة من الد

مثال

<HTML dir=rtl> <Title> إسترجاع القیم من الدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

دعنا ندرس ھذا المثال خطوة بخطوة getGuestNameأوال قمنا بإستدعاء الدالة

returnName في المتغیر القیمة الراجعة من الدالة فسوف يتم تخزين ،وبما أن ھذه الدالة تقوم بإرجاع قیمة كما بالسطر التالي

var returnName = getGuestName();

عند إستدعاء الدالة يتم تنفیذ األكود التالیة ف

var userName = prompt(" ;(""," اسمك من فضلكأدخل return userName;

userName ويتم تخزين القیمة الراجعة منه في المتغیر المسمي promptوكما نري يتم تنفیذ األمر وج منھا بتنفیذ األمر التاليريتم إنھاء الدالة والخثم

return userName;

.إنھاء تنفیذ الدالةثم ، رجاع القیمة التالیة لهإ بعمل شیئین أولھما returnويقوم األمر


98

باإلنتقال إلي مكان إستدعاء الدالة كما بالسطر التاليinterpreterيقوم مفسر اللغة ، بعد إنتھاء تنفیذ الدالة

var returnName = getGuestName();

. returnNameتغیر في المgetGuestNameثم يتم تخزين القیمة الراجعة من الدالة

مالحظة يتم إرجاع returnألننا كما أشرنا إلي أن بمجرد تنفیذ األمر ، ال يتم تنفیذه returnالحظ أن اي أمر يكتب بعد األمر

ثم إنھاء الدالة، القیمة التالیة له

مثال

<HTML dir=rtl> <Title> إسترجاع القیم من الدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما ھو موضح return ألنھا أتت بعد األمر إلي اللقاءفعند تشغیل ھذا الكود لن تظھر رسالة

getGuestName تعریف الدالة // function getGuestName () { var userName = prompt("أدخل اسمك من فضلك",""); return userName; alert("إلي اللقاء"); }


99

تمرير المعامالت للدوال

:معامالت الدالة يتم إستخدامھا داخل الدالة ، ھي قیم يتم تمريرھا إلي الدالة من خارجھا

لة ثم تمسح من ذاكرة البرنامج بمجرد إنتھاء عمل الدا

:طريقة تمرير المعامالت للدوال إلي الدوال بعدة طرق Argumentsيتم تمرير المعامالت

معامل واحد أو أكثر - Optional argumentمعامالت إختیاريه - غیر محددال يتم عمل اي معامالت للداله ولكن يتم تمرير معامالت للداله بعدد -

.اي يمكنك تمرير اي عدد من القیم

معامل أو أكثردوال ذات

مثال

<HTML dir=rtl> <Title> الدوالإلي القیم تمریر </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما يلي يتم تمرير المعامالت للدالة بین أقواس الدالة

setGuestName تعریف الدالة // function setGuestName ( name ) {

كما ھم مبین بالسطر التالي علي انه متغیر معرف داخل الدالة ثم يتم إستخدام ھذا المعامل

function setGuestName ( name ) { GuestName = name;


100

ثم يتم إستدعاء الدالة كما يلي

setGuestName( "الحسین" );

مثال

بر للقیمتیننريد عمل دالة يتم تمرير معاملین لھا ثم تقوم بإرجاع القیمة األك

<HTML dir=rtl> <Title> تمریر القیم إلي الدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

قمنا بتمرير معاملین كما يلي getMaxفي الدالة

getMax تعریف الدالة // function getMax ( num1 , num2 ) {

ثم تقوم بإرجاع القیمة األكبر للعددين الممرران لھا كما يلي

دالة تعریف ال // getMax function getMax ( num1 , num2 ) { return ( num1 > num2 )? num1 : num2 ; }

ثم يتم إستدعاء الدالة كما يلي

alert( getMax(21,34) );


101

Optional Arguments المعامالت اإلختیارية

optional argumentولكن المعامل الثاني يكون معامل إختیاري ، نريد عمل دالة يتم تمرير معاملین لھا أما ، بحیث يكون المعامل األول عبارة عن محتوي النص المراد طباعة ، وظیفة ھذه الدالة طباعة النص الممرر لھا

. المعامل الثاني يكون إختیار إلظھار رسالة ترحیب أم ال

مثال

<HTML dir=rtl> <Title> ر القیم إلي الدوالتمری </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

یاريت معامل إخdispalyHelloMessage المعامل الثاني قمنا بتمرير معاملینdisplayMessageفي الدالة كما يلي عند إستدعائھالدالةلاي ربما ال يمرر

displayMessage تعریف الدالة // function displayMessage ( messageText , dispalyHelloMessage ) {

true لھا بقیمة مرتین أحدھما تم تمرير المعامل الثانيdispalyHelloMessageتم إستدعاء الدالة

واألخر لم يمرر لھا إال المعامل األول فقط كما يلي

displayMessage( "رسالة مرسلة" , true ); displayMessage( "رسالة مرسلة" ); //--> </SCRIPT>


102

تمرير عدد غیر محدد من المعامالت إلي الدالة

لداله ولكن يتم تمرير معامالت للداله بعدد غیر محدد فیھا ال يتم عمل اي معامالت ل

.اي يمكنك تمرير اي عدد من القیم

مثال نريد عمل دالة يمرر لھا اي عدد من المعامالت ثم تقوم بإرجاع القیمة األكبر لھذه القیم

<HTML dir=rtl> <Title> تمریر القیم إلي الدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

الي من الكتاب ثوھذا المثال أقدمه لكم األن بدون شرح حتي نتناول التعامل مع المصفوفات في الجزء ال


103

Recursive Function الدالة لنفسھا إستدعاء

كما أشرنا سابقا أننا يمكننا إستدعاء دالة من داخل دالة أخري وقمنا بتطبیق أمثلة لذلك الغرض ولكن ھل يمكن لدالة أن تستدعي نفسھا من داخلھا ؟

ا وإال سوف يدخل البرنامج في حلقة من الدورات ولكن بشرط وضع شرط ينھي إستدعاء الدالة لنفسھ، أجیب بنعم infinite loopغیر منتھیه

لقیمة المعامل الممرر لھا Factorial مثال علي ذلك عمل دالة رياضیة تقوم بحساب المضروب الرياضي

يتم حساب المضروب الرياضي بالشكل التالي ١ x ٢ x ٣ يساوي ٣مضروب

١ x ٢ x ٣ x ٤ يساوي٤مضروب و ١ x ٢ x ٣ x ٤ x ٥ يساوي ٥مضروب و

مثال

<HTML dir=rtl> <Title> حساب المضروب </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



104

inner Function داخل دالةةلاد

يمكننا تعريف دالة داخل دالة كما يلي

superFunction تعریف الدالة // function superFunction ( number ) { innerFunction تعریف الدالة // دالة داخلبة // function innerFunction ( number ) { } return "إلي اللقاء مع الجزء الثاني"; }

تم شرحه في الجزء الثالث من ھذا الكتاب الخاص بالبرمجة الكائنیة للجافا وھذا النوع المتقدم من الدوال سوف ي

.سكربت

بسم اهللا الرحمن الرحيم سبحانك ال علم لنا إال ما علمتنا إنك أنت العليم الحكيم

:المقدمة

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

يقدم ھذا الجزء من الكتاب طريقة إستخدام لغة الجافا سكربت في برمجة الويب

في حالة وجود أي أخطاء أرجو اعالمي عن الخطأ علي العنوان التالي [email protected]

بالتوفیق في الدنیا واألخرة وأرجو من كل من أستفاد من ھذا الكتاب أن يدعوا لي

:إھداء

إلي الجیل القادم الذي يعز اهللا به اإلسالمأھدي ھذا الكتاب نا مادامت فیا الحیاة باذل جھدي وعقلي ومستفرغ طاقتي في العلم وذلك لثالثة أمورإو

إفادة من يطلب العلم في حیاتي وبعد مماتي - ذخیرة لي في قبري ويوم حسابي - طان المسلمینرفعة لسل -

الحسین محمد علي :تألیف


Tips Club

المكتبة العربية

http://www.TipsClub.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 Msg1 = "مرحبا بك"; var Msg2 = "نحن األن نتعلم المصفوفات"; var Msg3 = "الحمد هللا";

ثم نقوم بطباعة ھذه الرسائل كما يلي

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

كتابة محتویات المصفوفةتمرین

<HTML dir=rtl> <Title> صفوفاتالم </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



11

التكراريةfor inجملة إستخدام

تستخدم لعمل تكرار للمتغیرات من النوع الكائني for in أن جملة كما قد كنا أشرنا بالجزء األول من ھذا الكتاب

objects مثل المصفوفات Arrays

طول بمقدار يساوي فقد إحتجنا لتحديد عدد مرات التكرر ، forالحظ بالمثال السابق عندما قمنا بإستخدام جملة يلي كما )اي بعدد عناصر المصفوفة ( المصفوفة

var empNameArray = new Array("أحمد محسن","حمدي غانم","محمد عبد اهللا","الحسین محمد"); for( var i=0; i<4; i++){ document.write(empNameArray[i] ); document.write( "<br> " ); }

لقائي سوف يتم التكرار بعدد ألنھا بشكل ت، ال نحتاج لتحديد عدد مرات التكرار for inولكننا عند إستخدامنا لجملة

.عناصر المصفوفة


for ( المتغیر in الكائن) { األكواد // }

مثال توضیحي لحساب مجموع قیم المصفوفة

<HTML dir=rtl> <Title> صفوفاتالم </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


12


مثال

نريد عمل دالة يمرر لھا اي عدد من المعامالت ثم تقوم بإرجاع القیمة األكبر لھذه القیم

كما يليشارة لھذا المثال سابقا بالجزء األول من الكتابوقد تم اإل

<HTML dir=rtl> <Title> إلي الدوالتمریر القیم </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

getMax قمنا بتعريف الدالة ولذلك

function getMax () { var args = getMax.arguments; var max = args[0]; for( var i=1; i<args.length; i++ ){ if( max < args[i] ) max = args[i]; } return max; }

كما يلي عند إستدعائھا عدد من المعامالتوھذه الدالة يمكنھا أستقبال اي

alert( getMax(21,34) ); alert( getMax(2,43,5) ); alert( getMax(2,1,3,4,7,4,8,1) );

إستقبال المعامالت الممررة لھذة الدالة في المصفوفة التابعة لكائن ھذة الدالةتم يو

كما يليgetMaxي خصائص الدالة وھي أحدargumentsوھذه المصفوفة تسمي

function getMax () { var args = getMax.arguments; . . . }

. يشیر إلي مصفوفة عناصرھا ھي المعامالت الممررة للدالةargs يكون المتغیر وبذلك


14

Associative Arraysالمصفوفات المجمعة

فعلي سبیل المثال لتعین ركما تعلمنا سابقا التعامل مع عناصر المصفوفة يتم عن طريق تحديد موقع ھذا العنص نكتب هت لذلك لتعین قیمصفر نقوم بإستخدام موقع ھذا العنصر بالمصفوفة وھو arrقیمة العنصر األول بالمصفوفة

arr[0]كما يلي

var arr = new Array(" ن محمدالحسی ;("أحمد محسن","حمدي غانم","محمد عبد اهللا"," العنصر األول بها // document.write( arr[0] );

نخلص إلي أنه يتم التعامل مع عناصر المصفوفة من خالل مواقعھا بالنسبة للمصفوفةوبذلك

بل يتم التعامل من ، مواقع تلك العناصر فال يتم التعامل مع عناصرھا من خالل للمصفوفات المجمعةأما بالنسبة .بالمصفوفةما حتي يمكننا اإلشارة لعنصر keysكلمات مفتاحیه خالل أستخدام

طريقة ملء المصفوفات المجمعة

var earth = new Array(); earth["diameter"] = "7920 miles"; earth["distance"] = "93 million mile"; earth["year"] = "365.25 days" earth["day"] = "24 hours";

كما سوف يتضح بشكل (يمكننا أيضا التعامل مع الكلمات المفتاحیة كأنھا خصائص تم إضافتھا إلي كائن المصفوفة كما يلي) مفصل بالجزء الثالث من ھذا الكتاب

var earth = new Array(); earth.diameter = "7920 miles"; earth.distance = "93 million mile"; earth.year = "365.25 days" earth.day = "24 hours";

كما يلي نستطیع اإلشارة لعناصر المصفوفة بواسطة موقع العنصر بالنسبة للمصفوفة الالحظ أننا

var earth = new Array(); earth.diameter = "7920 miles"; alert( earth[0] );


15

لتعین قیم عناصر المصفوفة المجمعة كما يلي for in جملةيمكننا إستخدام

مثال كتابة محتويات مصفوفة مجمعة بالمتصفحنريد

<HTML> <Title> المصفوفات المجمعة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



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 المصفوفة كائن •

o المصفوفة كائن خصائص Array Object Properties o المصفوفة كائن دوال Array Object Methods


18

Multidimensional Arraysالمصفوفات ذات األبعاد المتعددة

: دعنا نقول أنه يوجد نوعین من المصفوفات أحدھما وھو ما كنا أشرنا إلیه سابقا كما بالمثال التالي ذات بعد واحد -

oceans[0] = "Atlantic"; oceans[1] = "Pacific"; oceans[2] = "Indian"; oceans[3] = " Arctic";

تمثل مصفوفة ذات بعد واحدoceansفالمصفوفة

كما بالشكل التاليأي أنه يمكن تمثیل عناصر المصفوفة علي شكل خطي

Arctic Indian Pacific Atlantic تحدث عنه وھو ما سوف نذات أبعاد متعددةواألخري -

أي أنه يمكن تمثیل عناصر المصفوفة ، ذات األبعاد المتعددة مثاال علي ذلك المصفوفة ثنائیة األبعادأوال المصفوفة وأيضا المصفوفات ثالثیة األبعاد يمكن تمثیلھا في شكل مكعبي ، علي شكل مستطیلي

امكانیة عمل مصفوفة متعددة األبعادسكربتلألسف ال توفر لنا لغة الجافا ولن أطیل في ھذا الحديث ألنه مصفوفة المصفوفةولكن أنتظر قلیال فإنه يمكن التحايل علي ھذا الموضوع بعمل ما يسمي

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 بإستخدام جملة مثال لطباعة بیانات مصفوفة الفروع السابقة

<HTML> <Title> مصفوفة المصفوفة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



22

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

<HTML> <Title> مصفوفة المصفوفة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



23

Array Objectكائن المصفوفة

الدوال الخاصة بكائن المصفوفةودعنا نتحدث األن عن الخصائص

Array Object Propertiesخصائص كائن المصفوفة

constructorالخاصیة

عند الحديث عن الكائنات والبرمجة الكائنیة ، بالجزء الثالث من ھذا الكتابconstructorسوف نتحدث عن الخاصیة

prototypeالخاصیة عند الحديث عن الكائنات والبرمجة الكائنیة ، بالجزء الثالث من ھذا الكتابprototypeسوف نتحدث عن الخاصیة

Inheritanceوالوراثة


24

lengthالخاصیة

لحساب طول المصفوفة اي عدد عناصر المصفوفةlengthتستخدم الخاصیة

مثال

var arr = new Array("100","12","44"); alert( arr.length );


مثال

<HTML dir=rtl> <Title> طول المصفوفة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


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 );


مثال

<HTML dir=rtl> <Title> المصفوفةدوال </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT>


27

</HEAD> </HTML>


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

مثال

<HTML dir=rtl> <Title> دوال المصفوفة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



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(",") );


ألنه تم ترتیب عناصر قیم المصفوفة علي أساس أنھا قیم نصیة، كما تري لم يتم الترتیب بشكل صحیح مشكلة يتم عمل دالة خاصة للترتیب كما يليولحل ھذة ال

مثال

<HTML dir=rtl> <Title> دوال المصفوفة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


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 األنترنت عناوين تشفیر وفك تشفیر دوال •

o الدالة escape o الدالة unescape


38

كما كنا قد أشرنا سابقا بالجزء األول من الكتاب في فصل المتغیرات أن لغة الجافا سكربت لیست من اللغات التي يجعلھا تمیز بین المتغیرات "not strongly typed language "تمیز أنواع البیانات المخزنة بالمتغیرات يشكل قوي

كما سنري ظھور بعض المشاكل عند إستخدام المتغیرات النصیة البسیطة ، بشكل جید الحرفیة والمتغیرات النصیةلذلك ظھرت الحاجة إلنشاء كائن نصي يكون مبني داخل لغة الجافا سكربت يوفر أسلوب تعامل صحیح مع المتغیرات

النصیة

Simple String نصوص البسیطةال

يتكون النص من حرف أو أكثر وربما من رقم أو أكثر أو ربما يكون خلیط من حروف مع أرقام لكن : ما ھو النص البسیط بشرط أن يتم وضع ھذه الحروف بین عالمتین تنصیص كما يلي

var str = "مرحبا بكم";

بین عالمتین تنصیص فردي كما يلي أو

var str = 'مرحبا بكم';

Emptyم وھو ما يسمي بالمتغیر النصي الفارغ االحظ أيضا أن المتغیر النصي ربما ال يحتوي علي اي حروف أو أرقString كما يلي

var str = "";

Concatenation دمج النصوص

لويبتعتبر عملیة دمج النصوص من العملیات الھامة عند القیام بإنشاء صفحات ل

كما يلي=+أو المعامل + يتم دمج النصوص بإستخدام المعامل و

var str = ""; str += "<html><head><title>رأس الصفحة</title></head>"; str += "<body><h1>النصوص البسیطة</h1></body>"; str += "</html>";

مثال

var str1 = "أنت هنا معنا"; var str2 = "بالجزء الثاني"; var str3 = str1 + " " + str2; alert( str3 );


39


مثال

var str1 = "2"; var str2 = 3; var str3 = str1 + str2; alert( str3 );


وكان قیمة نصیة بالرغم من أنھا لم يتم وضعھا بین عالمتین تنصیص str2 المتغیر الحظ معي أنه تم إعتبار قیمة .٥المتوقع أن يكون ناتج الجمع ھو

كما بالمثال التاليparseFloat أو الدالة parseIntولعالج ھذة المشكلة يتم إستخدام الدالة

مثال

بإظھار حاصل جمعھمثم نقوم، في ھذا المثال نطلب من المستخدم إدخال رقمین

<HTML> <Title> النصوص البسیطة </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما يلي ١٢فیكون ناتج الجمع ھو ، ٨ والرقم الثاني بالقیمة ٤عند إدخال الرقم األول بالقیمة ويكون الناتج

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عالمات الھروب أو العالمات الخاصة للكتابة

:ي تمكنك من تضمین بعض الحروف التي يصعب كتابتھا في محتوي النصوص ومنھا التال

تمكنك من إضافة عالمه التنصیص الفردیة بداخل النص '\ تمكنك من إضافة عالمه التنصیص بداخل النص "\\r تمكنك من إدخال حرف خاص لعمل ما یسميCarriage

return اي تراجع موشر الكتابه إلي بدایة السطر مما ینتج عنه في بعض األحیان عمل سطر جدید

\n ر جدید داخل النصتمكنك من عمل سط \t تمكنك من إدخال الحرفTab

)يا رجل ؟ " مشكلة"ھل ھناك (بعد التعرف السريع لعالمات الھروب كیف يمكننا حل مشكلة كتابة النص السابق ويكون النص كالتالي ) "\(بعالمة الھروب (") بكل يسر يتم إستبدال اي عالمة تنصیص

)یا رجل ؟" \مشكلة"\هل هناك (


44

:مثال تطبیقي لكتابة الرسالة التالیة

أن تكون قد" العزیز"نتمنا لك یا قارئنا تعلمت ما سبق من قول وان تحرص علي ما هو أت

<HTML dir=rtl> <Title> تداخل عالمات التنصیص </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>



45

URL String Encoding and Decoding عناوين األنترنتوفك تشفیر دوال تشفیر

بأن نقوم علي سبیل المثال بكتابة العنوان التالي، دما نقوم بإرسال عنوان الحدي المواقع أحیانا عن"http://www.islamway.com/index.php?action=all news" في شريط العنوان بالمتصفح Address Bar فعند

المات الخاصة إلي ما يقابلھا في تلقائیا اي يتم تحويل العurl يتم تشفیر عنوان الموقع goالضغط علي زرار ذھاب العنوان الناتج كما يلي يكون وASCIIالنظام الستعشري بنظام التشفیر األسكي

" http://www.islamway.com/index.php?action=all%20news" الحظ أن حرف المسافة بین الكلمتین all و الرقم الستعشري في نظام التشفیر األسكي ھو ٢٠والرقم " 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 );


ولكننا دائما ما نحتاج إلي تشفیر ، تري فقد تغیر عنوان الموقع إلي عنوان خطأ ألنه تم تشفیر كل العنوان كماو

البیانات المرسلة فقط كما يلي

http://www.islamway.com/index.php?action=all

http://www.islamway.com/index.php?action=all

http://www.islamway.com/index.php


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 );


http://www.islamway.com/index.php?action

http://www.islamway.com/index.php?action


47

رابعلالفصل ا كائن النصوص


String Object النصوص كائن • نصي كائن إنشاء • String Object Properties النصوص كائن خصائص • String Object Methods النصوص كائن دوال •

o النصوص مع بالتعامل الخاصة الدوال parsing Methods o النص بتنسیق الخاصة الدوال Formatting Methods


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

تمرين

دمنريد عكس نص يتم إستقباله من المستخ

<HTML> <Title> عكس النص </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كما يلي ollehھو hello عند إدخال القیمة ويكون الناتج


52

fromCharCode و charCodeAtالدوال

charCodeAt ةالدال

ولكن تقوم بإرجاع القیمة العددية بنظام التشفیر األسكي تستخدم لقراءة حرف واحد في موقع معین من النصASCII لھذا الحرف

عدديةتقوم بإرجاع قیمة : القیمة الراجعة


String.charCodeAt( موقع الحرف );

أو

String.charCodeAt();

مثال

"abc".charCodeAt(); // 97 : ینتج عنه القیمة "abc".charCodeAt(0); // 97 : ینتج عنه القیمة "abc".charCodeAt(1); // 98 : ینتج عنه القیمة

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" ,2); // 1- : ینتج عنه القیمة

١ -كما نري إذا لم يتم العثور علي النص يتم إرجاع القیمة


54

تمرين

نريد التأكد من صحة قیمة بريد إلیكتروني يتم إستقباله من المستخدم

@مع العلم أن البريد األلیكتروني يتمیز بوجود الرمز

<HTML> <Title> التأكد من صحة البرید اإللیكتروني </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

كیف يتم التأكد من البريد اإللیكتروني بشكل أكثر دقة"التعامل مع التعبیرات المنتظمة"سوف نري بالفصل القادم و

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" ,2); // 1 : ینتج عنه القیمة

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

تمرين

إلیكتروني يتم إستقباله من نريد إستخالص اسم المستخدم وسم مزود خدمة البريد اإللیكتروني لقیمة بريد المستخدم

فعلي سبیل المثال @و اسم مزود الخدمة يلي الرمز @مع العلم أن اسم المستخدم يسبق موقع الرمز

[email protected]إذا كان البريد اإللیكتروني المدخل ھو a_elhusseinيكون اسم المستخدم

hotmailويكون اسم المزود



57

<HTML dir=rtl> <Title> البرید اإللیكتروني </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

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) تعمل التالي

<a name="">… </a>

blink()

تعمل التالي< blink>…</ blink>

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

< b>…</ b> fixed() تعمل التالي

<tt>…</tt> Fontcolor(colorValue) تعمل التالي

<font color="colorValue">…</font> Fontsize(size) تعمل التالي

<font size="size">…</font> Italics() تعمل التالي

<i>…</i> link( url) تعمل التالي

<a href="url">… </a> big() تعمل التالي

<big>… </big> small() تعمل التالي

<small>… </small> strike()

تعمل التالي<strick>…</ strick >

sub()

تعمل التالي<sub>…</ sub>

sup()

تعمل التالي

<sup> … </ sup>

تمرين

من النص التالي "عن"و " صحبه"و " محمد"التالیة اتكلمالنريد إستخالص

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


61

األحمر

<HTML dir=rtl> <Title> تلوین النص </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


62


63

خامسلالفصل ا تعامل مع التعبيرات المنتظمة ال

Regular Expressions


Regular Expressions المنتظمة التعبیرات ھي ما • المنتظمة التعبیرات كتابة طريقة •

o األنماط patterns o المجموعات Grouping

األنماط مع النصوص كائن إستخدام • 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 ٩رقام من صفر إلي األتعبر عن

[9-0]اي أنھا تكافئ النمط التالي \D ٩رقام من صفر إلي ال تعبر عن األ

[9-0^]اي أنھا تكافئ النمط التالي \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ولكن يعبر عن

الوصف الرمز

\الحرف تعبر عن \\\t تعبر عن الحرفtab .تعبر عن الحرف .\ ?تعبر عن الحرف ?\ +تعبر عن الحرف +\ *تعبر عن الحرف *\ ^تعبر عن الحرف ^\ $تعبر عن الحرف $\

Groupingالمجموعات

2$ و 1$كالمتغیر $ عات يتم تخزينھا في مصفوفة أو في متغیرات تبدأ بالرمز لتجمیع نواتج البحث في مجموتستخدم كما يلي | أو العالمة التالیة () واس التالیة قولعمل مجموعات يتم إستخدام الرمز األ

مثال

var pattern = /^([0-9])(web)/;

web واألخري للنمط [9-0]مط سوف يتم وضع نتائج البحث علي ھذا النمط في مجموعات أحدھما للن

مثال

var pattern = /web|cat/;

وھذا النمط ، 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 );


تمرين

يتم إستقباله من المستخدمالذياإللیكتروني تأكد من صحة البريد النريد

<HTML dir=rtl> <Title> البرید اإللیكتروني </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>


73

تمرين

سم مزود خدمة البريد اإللیكتروني لقیمة بريد إلیكتروني يتم إستقباله من انريد إستخالص اسم المستخدم و المستخدم

فعلي سبیل المثال @و اسم مزود الخدمة يلي الرمز @مع العلم أن اسم المستخدم يسبق موقع الرمز

[email protected]إذا كان البريد اإللیكتروني المدخل ھو a_elhusseinيكون اسم المستخدم

hotmailويكون اسم المزود

.الحظ أن النمط المستخدم ھو نفس النمط السابق مع إضافة المجموعات بإستخدام األقواس

<HTML dir=rtl> <Title> البرید اإللیكتروني </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> </HTML>

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() );


تمرين

<HTML dir=rtl> <Title> التاریخ </Title> <HEAD> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD></HTML>

جافا سكربت المستوي الأول - elibrary

Documents