- محب منبجالمدير العام
عدد الرسائل : 72
تاريخ التسجيل : 02/05/2009
تعلیم الجافا سكربت 2
الخميس فبراير 14, 2013 2:33 am
تابع
لاتنزعج تستطیع أن تكتبه كما تعلمنا سابقا أي :
function output ( )
function cube ( y )
T = cube ( x ) ;
return y*y*y ;
٣٥
فقط أحببت أن أریك طریقة ثانیة من باب العلم بالشئ فقط لا غیر وقد تلجأ له عند الحاجه .
٤- معلومة مهمة جدا ...
عندما تكتب برنامجك بالجافا سكربت ویكون یحتوي فقط على دوال كما في مثالنا هذا فیجب علیك أن تذكر في
هذه العبارة : ( body ) ال
؟ ( body ) داخل ال ( onload ) قد تتساءل لماذا وضعنا
هو إستدعائها ( onload ) الجواب لان برنامجنا عبارة عن دوال والدوال لاتعمل الا عند إستدعائها فأعتبر ال
فهذا بسبب أن هذه الدالة هي الرئیسیة ( output ( ) ) " أي تشغیلها " أما لماذا ذكرنا أسم الدالة الاولى
وسوف ( form ) مثلا في حالة ال ( onload ) فهي التى تستدعي الدالة الثانیة . ولكن لیس دائما نضع
نتحدث عن هذا الموضوع لاحقا .
var z ;
z = y*y*y ;
return z ;
< body onload = " output ( ) " >
٣٦
: ( Arrays ) المصفوفات
هنا سوف نتطرق الى موضوع ذا أهمیة وهو المصفوفات فبإستعمالها نستطیع توفیر الوقت والجهد بالاضافة
الى جعل البرنامج أصغر حجما وأسرع تنفیذا .
وتكتب على أكثر من شكل منها :
١- هنا عرفنا متغیر هو عبارة عن مصفوفة تحتوي على ( 5 ) عناصر أما ماقیمة هذه العناصر فسوف نذكرها
داخل البرنامج .
٢- وهنا عرفنا المتغیر على أنه مصفوفة دون تحدید كم عنصرا تحتوي وهنا یجب أن نحدد كم عدد عناصر
او ما شابه " كأن نذكرها في حلقة التكرار مثلا أما ما ( for ) المصفوفة في داخل البرنامج " اقصد في ال
قیمة هذه العناصر فسوف نذكرها أیضا في البرنامج .
٣- وهنا عرفنا المتغیر على أنه مصفوفة تحتوي على ثلاثة عناصر فوضعنا في كل عنصر قیمة رقمیة معینة
. وعادة تستخدم تعریف المصفوفة بهذا الشكل عندما تكون المصفوفة تحتوي على أرقام .
على أنه مصفوفة تحتوي على ثلاثة عناصر وكانت قیمة كل عنصر مبینة منذ ( a ) ٤- هنا عرفنا المتغیر
البدایة أي ( 1,2,3 ) أو ( "محمود" ، "ثامر" ، "سامي" ) أما كیف عرفنا أن المصفوفة تحتوي على ثلاثة
عناصر فهو عدد مابداخلها إذا هي مصفوفة عدد عناصرها ثلاث أما ماهي قیمة عناصرها فهي ( 1,2,3 ) أو
أي ( string ) (محمود ، ثامر ، سامي ) . ولاحظ أنه عندما تحتوي المصفوفة على نص " إذا جاز التعبیر
أسم او ما شابه یجب وضع الكلمة بین ( " ) .
دعنا نتحدث عن المصفوفات بشكل عام :
المصفوفة نستطیع تشبیهها بعمارة . العمارة یحتوي كل طابق منها على شقة واحدة . لنفرض أن العمارة تتكون
من أربعة طوابق فكان الطابق الأول یسكن به محمد والطابق الثاني أیهم والطابق الثالث أشرف والطابق الرابع
عماد . إذا هنا لدینا عمارة تتكون من أربعة طوابق كل طابق یحتوي على شخص فهذا هو الحال بالنسبة
للمصفوفة فالعمارة هي أسم المصفوفة . وعدد الطوابق الأربعة هو عدد عناصر المصفوفة والتى هي أربعة
والاشخاص الذي كان كل شخص منهم یسكن بطابق هم قیمة كل عنصر في المصفوفة . أي كأننا نقول كل
طابق منه یحتوي شخص " فهنا نقول كل عنصر ماذا یحتوي " .
دعنا نطبق هذا المثال بشكل عملي برمجي . .
لنمثل ماقلناه : ( a ) كلمة عمارة لنختصرها ونسمیها
var a = new Array ( 5 ) ;
a = new Array ( 1, 2, 3 ) ;
a = new Array ( " ; ( " محمود " , " ثامر " , " سامي
a = [ 3, 14, 6 ] ;
a = new Array (" ; (" عماد "," أشرف "," أیهم "," محمد
var a = new Array ( ) ;
٣٧
إذا هنا الموقع الأول في المصفوفة یساوي محمد والموقع الثاني أیهم والموقع الثالث أشرف والموقع الرابع عماد
. ولكن عادة في المصفوفات نبدأ من الصفر ولیس من الواحد أي نقول موقع الصفر یساوي محمد و الموقع
الاول یساوي أیهم والموقع الثاني یساوي أشرف والموقع الثالث یساوي عماد .
عزیزي المتدرب لاتنزعج من ذلك أعتبر العمارة تتكون من طابق أرضي وطابق أول وطابق ثاني وطابق ثالث
إذا محمد سوف یسكن في الطابق الارضي وهو الصفر أي موقع رقم صفر في المصفوفة وأیهم في الطابق
الأول أیا الموقع الاول في المصفوفة وأشرف في الطابق الثاني أي الموقع الثاني في المصفوفة وعماد في
الطابق الثالث أي الموقع الثالث في المصفوفة .
فیكون بهذا الشكل... " Memory " أما تمثیل المصفوفة بداخل الجهاز اي ال
" سوف أضع رسمة توضیحیة لتوضح لك كل شئ " :
50
90
20
45
قبل أن نبدأ بمثال لابد أن أوضح لك شیئا مهم . . .
بما أن المصفوفة تحتوي على عدة مواقع إذا یجب علي أن أجعل برنامجي یمر على كل موقع إذا هنا بحاجة الى
حلقة تكرار لكي استطیع المرور على كل موقع وأطبعه او أنفذه .
أكثرنا الحدیث . . لنأخذ مثالا فالمثال التطبیقي والعملي هو الذي یوضح ما بهم لك .
مثال :
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var name = new Array (" ; ("حمد"," محمود "," أحمد "," محمد
var i ;
for (i = 0 ; i < name.length ; i ++ )
document.writeln ( name[i] + " <br /> ") ;
</script>
</head>
<body></body>
</html>
a[0]
a[1]
a[2]
a[3]
مقدار القیمة
المخزنة بداخل
Array ال
اسم ال
Array
رقم الموقع المسمى
Index
٣٨
دعنا نحلل المثال سویا . .
أول شئ عرفنا أسم المصفوفة ثم وضعنا بها أربعة قیم أذا هنا نحن متفقین أننا عرفنا مصفوفة أسمها
الذي ( i ) تحتوي على أربعة مواقع كل موقع یحتوي على إسم بداخله. ثم عرفنا المتغیر ( name )
فتعني أن تستمر ( name.lengt ) سنستخدمه في حلقة التكرار . أستخدمنا في حلقة التكرار هذه العبارة
حلقة التكرار الى أن ینتهي طول المصفوفة أي أن حلقة التكرار سوف تستمر أربعة مرات لأن المصفوفة
تحتوي على أربعة مواقع وبما أننا بدأنا حلقة التكرار من صفر أذا سوف یمشي 3 2 1 0 . أذا صیغة طول
المصفوفة التى تكتب بالتكرار تكتب كالتالي :
عزیزي المتدرب إذا أنزعجت منها تستطیع أن لاتضعها . تستطیع وضع رقم ( 4 ) .. بدلا منها فنحن في هذه
المصفوفة جعلناها تحتوي على أربعة مواقع . فبالتالي نجعل حلقة التكرار تمر على الاربعة مواقع . قد تتساءل
3 , 2 ) اى , كیف أضع ( 4 ) فنحن لدینا ( 4 ) عناصر إذا یجب أن یكون العد الى ( 3 ) أي ( 1 , 0
اربعة اسماء فهنا یعتبر العد لاربعة مواقع . . نعم كلامك صحیح 100 % ولكنني في حلقة التكرار بدأنا من
0 ) ثم قلت أصغر من ( 4 ) أي أن ( 4 ) لیست داخلة . فلم أقل أصغر أو تساوي ( 4 ) . كذلك الحال )
..( name.length ) بالنسبة لل
واعني بها أنني أرید طباعة مایحتویه كل موقع من مواقع ( name[i] ) ذكرت داخل جملة الطباعة
المصفوفة . أي كأنني أقول أرید طباعة أسم كل شخص یسكن في كل طابق من طوابق العمارة . . . تذكر كما
قلنا سابقا . إذا كیف أفعل ذلك . . أكتب أسم المصفوفة ثم أفتح القوس "]" أضع رقم الموقع . . ثم أغلق
فهذا یعني أرید أن أعرف مایحتوي علیه الموقع صفر في ( name[ القوس "[" كأن مثلا أقول ( [ 0
( i ) المصفوفة وطبعا هو محمد . وهذا ماسوف یحدث بحلقة التكرار فأول مرة سوف ترسل حلقة التكرار قیمة
أي أطبع مایحتویه الموقع صفر ( name [ إذا سوف یكون ( [ 0 ( name [i] ) صفرا وبما أنني واضع
قد زید علیها واحد ( i ) والذي هو محمد ثم ینزل سطرا ونعود مرة ثانیة الى حلقة التكرار وتكون قیمة ال
أي أطبع مایحتویه الموقع رقم ( 1 ) وهو أحمد . ( name [ لتصبح ( 1 ) فندخل حلقة التكرار وتكون ( [ 1
قد زادت واحد لتصبح ( 2 ) فتدخل قیمة ( i ) ثم ینزل سطر ویعود مرة ثانیة الى حلقة التكرار فتكون قیمة
أي أطبع قیمة الموقع الثاني التى هي محمود . ثم تعود قیمة ( name [ الى حلقة التكرار فتصبح ( [ 2 ( i )
أي أطبع قیمة الموقع الثالث ( name [ بعد أن زیدت بواحد أي ( 3 ) فتدخل حلقة التكرار فتصبح ( [ 3 ( i )
بعد أن زیدت بواحد الى حلقة التكرار فلا یتحقق الشرط والذي ( i ) في المصفوفة هو حمد . ثم تعود قیمة ال
أي أقل من ( 4 ) فإذا لایتحقق الشرط فنخرج من حلقة التكرار أي نتوقف . ( i < name.length ) هو
وهنا ینتهي البرنامج ویكون قد طبع لنا :
أسم المصفوفة . length
محمد
أحمد
محمود
حمد
٣٩
ملاحظة مهمة :
اسم المصفوفة ) نستعملها فقط عندما یكون طول المصفوفة معلوم لدینا عند تعریفنا . length ) صیغة
للمصفوفة . وهنا یمكن ان نعرف طولها على شكلین :
مثلا :
مثلا :
فهنا نعرف ان المصفوفة تتكون من ثلاثة مواقع .
ففي هذه الحالة .... ( a.length ) أما متى لا نستخدم
مثلا :
فنحن لا نعرف ( .length ) فهنا نحن اثناء تعریفنا للمصفوفة لم نحدد على كم موقع تحتوي إذا كیف نستخدم
طول المصفوفة أي عدد مواقعها . إذا هنا یجب علینا ان نحدد طول المصفوفة بحلقة التكرار أي بدلا من ان
نضع مثلا رقم ( 3 ) وهذا یدلنا كم موقع نرید بالمصفوفة . ( a.length ) نضع
مثال :
a = newArry (4) ;
a = newArry (2,4,6) ;
a = newArra ( ) ;
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var i ;
var number=new Array() ;
for (i=0 ; i<4 ; i++)
{
number[i] = i ;
document.writeln(number[i] + "<br>");
}
</script>
</head>
<body></body>
</html>
٤٠
تحلیل هذا المثال اتركه لك .... ولكن سوف اضع لك ملاحظتین تسهل علیك تحلیله ...
. " ( نعني بها اننا نرید المصفوفة تحتوي على اربعة مواقع " تذكر اننا بدأنا من ( 0 ( i<4 ) •
نعني بها ان المصفوفة عرفناها في البدایة ولم نضع بها قیم . فهنا نضع بها القیم ( number[i] = i )•
أي كأننا نقول موقع الصفر ضع به ( 0 ) وموقع الواحد ضع به ( 1 ) وهكذا . أي :
اذا نحن هنا قمنا بتعبئة مواقع المصفوفة بقیم ومن ثم طبعناها .
عزیزي المتدرب نكون هنا قد انهینا الحدیث عن المصفوفات ذات البعد الواحد المسماة :
. (1D) " One Dimension Array "
إذا بقي علینا الشكل الاخر للمصفوفة وهي المصفوفة المسماة :
. (2D) " Tow Dimension Array "
لنأخذ مثالا ونوضح ماهي ...
Number [0] = 0
Number [1] = 1
Number [2] = 2
Number [3] = 3
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var arr = [ [1,3,5,7] , [3,3,3,3] , [9,1,4,0] ] ;
document.writeln("<h طباعة مصفوفة ثنائیةالأبعاد< 2 </h2><tt>");
for (i=0 ;i< arr.length;++i)
{
for (j=0 ;j< arr[i].length;++j)
document.writeln(arr[i] [j] + " ");
document.writeln("<br />");
}
document.writeln("</tt> ");
</script>
</head>
<body></body>
</html>
٤١
لنحلل المثال سویا ...
أخي المتدرب شرحي في هذا المثال سوف یكون طویلا وقد أثقل علیك من كثرة ما سوف تقرأ ولكن ذلك من
أجل إیصال المعلومة لك بالتفصیل إلى أبعد الحدود فأعذرني فكما هو شاق علیك بالقراءة هو شاق علي بالكتابة
والشرح .....
هنا قمنا بتعریف المصفوفة وكانت هذه المصفوفة تحتوي بداخلها على ثلاثة مصفوفات لا تنزعج من ذلك فقد
كنا نقول في الماضي ان المصفوفة تحتوي على ثلاثة عناصر وهنا نقول تحتوي المصفوفه على ثلاثة
مصفوفات أي عملیة تداخلیة . الان یجب أن نعرف شیئا ...
وهنا طبعا (rows & columns ) ( هذه المصفوفة التي بداخلها مصفوفات هي ( كم عامودا في كل صف
4 ) كیف عرفنا ذلك ؟ x مصفوفتنا هذه سوف تتكون من أربعة أعمدة وثلاثة صفوف . إذا أبعادها ( 3
لاحظ أن المصفوفة الرئیسیة كانت تحتوي على ثلاثة مصفوفات بداخلها إذا المصفوفة الرئیسیة تحتوي على
ثلاثة صفوف وكان كلا من هذه المصفوفات یحتوي على اربعة عناصر إذا المصفوفة الرئیسیة أیضا سوف
تتكون من أربعة أعمدة وهي عدد العناصر في المصفوفات التي بداخلها فقد كانت كل مصفوفة من هذه
المصفوفات تحتوي على قیم بداخلها وكانت كل واحده تتكون من اربعة مواقع اذا . ..
الذي ( <tt> ) ثم كتبنا أمر طباعة جملة نصیة والتي هي " طباعة مصفوفة ثنائیة الأبعاد " ووضعنا هذا الوسم
سوف أغلقه بعد الانتهاء كلیا من البرنامج فقط لكي یطبع لي البرنامج كل الارقام التي تحتویها المصفوفة بشكل
الآلة الطابعة وتستطیع ان لا تضعه .
قبل الدخول الى حلقة التكرار أنت تعلم جیدا ان حلقة التكرار في كل مرة ندخل بها داخلها یجب العودة لها أكثر
من مرة حتى یفشل الشرط فنخرج منها " أي عدم تحقق الشرط " فماذا لو كان لدینا حلقة تكرار بداخلها حلقة
تكرار أخرى في هذه الحالة ندخل في حلقة التكرار الاولى أي الرئیسیة فنجد بداخلها حلقة تكرار أخرى وهنا
سوف ندخل بداخل هذه الحلقة ونستمر بتنفیذ ما بداخلها والعودة لها حتى یفشل شرطها وبالتالي الخروج منها
والعودة الى حلقة التكرار الاولى كدورة ثانیة لها فندخل بداخلها فنجد حلقة التكرار الثانیة مرة أخرى فنستمر
بتنفیذ ما بداخلها أي التكرار حتى یفشل الشرط " أي عدم تحققه " .
ثم نخرج من هذه الحلقة ونعود الى الحلقة الرئیسیة مرة أخرى وهكذا حتى یفشل شرط حلقة التكرار الرئیسیة
وبالتالي عدم الدخول بداخلها وعدم الدخول بحلقة التكرار التي بداخلها " أي الحلقة الثانیة " وبالتالي الخروج
تماما .
الان لندخل بحلقة التكرار ببرنامجنا ونشرحها ولكن قبل ذلك دعنا نتفق على مسمیات مجازیة " إذا جاز التعبیر
" استخدمها فقط من أجل التوضیح لا أكثر :
٤٢
ب " حلقة التكرار الرئیسیة " : ( i ) نسمي حلقة التكرار الاولى التي ببرنامجنا المحتویة على المتغیر
ب " حلقة التكرار : ( j ) وحلقة التكرار الثانیة أي التي بداخل حلقة التكرار الاولى المحتویة على المتغیر
الداخلیة " .
لنبدأ .....
وجعلنا حلقة التكرار تبدأ من ( 0 ) الى ( i ) عرفنا هنا ببرنامجنا حلقة التكرار الرئیسیة وعرفنا بداخلها المتغیر
طول المصفوفة الرئیسیة التي تحتوي بداخلها على المصفوفات . وبما أن لدینا بداخلها ثلاثة مصفوفات إذا
ابتداءا من ( 0 ) طبعا . أي ( i < هي ( 3 ) أي الشرط سوف یكون ( 3 ( arr.length ) سوف تكون قیمة
ان هذه الحلقة سوف تستمر بالتكرار ثلاثة مرات " أي الدخول بداخلها وتنفیذ ما بداخلها ثلاثة مرات " .
في بدایة ( i ) فأنا هنا فقط بدلا من أن أعرف المتغیر ( var i ) لاتنزعج لاني وضعت داخل حلقة التكرار
البرنامجي عرفته بداخل حلقة التكرار . طبعا تستطیع ان تعرفه في بدایة البرنامج أو تعرفه داخل حلقة التكرار
كما تشاء " فقط أحببت أن اریك عدة طرق لتعریفه لیس عبثا ولكن من باب العلم بالشيء " .
( j ) هي ( 0 ) ثم دخلنا حلقة التكرار الداخلیة وعرفنا المتغیر ( i ) هنا دخلنا حلقة التكرار الرئیسیة وقیمة
( هي ( 0 ( i ) وبما ان قیمة . ( j<arr[i].length ) هو ( j ) وجعلناه یبدأ من ( 0 ) ووضعنا شرط ال
ماذا تعني هذه الجمله ؟ ( arr[0].length ) إذا الشرط سوف یكون
تعني ماذا یحتوي الموقع ( 0 ) في المصفوفة الرئیسیة وطبعا یحتوي على مصفوفة تحتوي بداخلها على أربعة
عناصر .. أي كأننا نقول بهذه الجملة " كم تحتوي المصفوفة على عناصر بداخلها في الموقع ( 0 ) من
المصفوفة الرئیسیة " ...
تعني ( 4 ) إذا الشرط هو ( arr[0].length ) وبما أنها تحتوي على أربعة عناصر ، إذا هنا ترجمة
إذا سوف ننفذ ما بداخل الحلقة الداخلیة أربعة مرات إبتداءا من ( 0 ) وانتهاءا ب ( 3 ) وسنبقى ( j<4 )
مستمرین ولن نخرج منها حتى ننتهي " أي عدم تحقق الشرط " . فإذا حصل ذلك نخرج منها ونعود مرة أخرى
الى حلقة التكرار الرئیسیة . إذا لندخل بداخلها ...
( arr[i][j] ) تساوي ( 0 ) وهو أقل من ( 4 ) فعلا . فننتقل الى أمر الطباعة وبداخله ( j ) فقیمة
لنحللها سویا ...
نعني بذلك الموقع ( 0 ) في ( arr[0][ ایضا ( 0 ) إذا ( [ 0 ( j ) لدینا هي ( 0 ) وال ( i ) الان قیمة
عادة بالمصفوفة الرئیسیة أي التي تضم بداخلها على ( i ) المصفوفة والموقع ( 0 ) في المصفوفة الداخلیة فال
فهي خاصة بالمصفوفة الداخلیة أي الموجودة بداخل المصفوفة الرئیسیة . إذا توصلنا ( j ) ثلاثة مصفوفات أما
لنتیجة ...
أن حلقة التكرار الرئیسیة هي خاصة بالمصفوفة الرئیسیة ومواقعها .
وحلقة التكرار الداخلیة خاصة بالمصفوفات الداخلیة ومواقعها " أي المصفوفات التي بداخل المصفوفة الرئیسیة
. "
اذا یجب الذهاب الى الموقع ( 0 ) في المصفوفة الرئیسیة والموقع ( 0 ) في ( arr[0][ الان لدینا ( [ 0
المصفوفة الداخلیة الموجودة في الموقع ( 0) في المصفوفة الرئیسیة فهنا یطبع الرقم ( 1 ) فنعود مرة أخرى
أصبحت ( 1 ) " أي بعد الزیادة " فیسألنا الشرط هل ( 1 ) أقل من ( j ) الى حلقة التكرار الداخلیة وقیمة
أي هل ( 1 ) أقل من ( 0 ) طبعا یتحقق الشرط اذا سوف یدخل الى الحلقة فیطبع ( arr[0].length )
وتعني ذلك اطبع ما یحویه الموقع ( 0 ) من المصفوفة الرئیسیة والموقع ( 1 ) في المصفوفة ( arr[0][1] )
( j ) الداخلیة وبالتالي سوف یطبع الرقم ( 3 ) وبعد ذلك یعود مرة أخرى الى الحلقة الداخلیة وتكون قیمة
( والتي تعني الموقع ( 0 ( arr[0][ أصبحت ( 2 ) فیتحقق الشرط لان ( 2 ) أقل من ( 4 ) فیطبع قیمة ( [ 2
من المصفوفة الرئیسیة والموقع ( 3 ) في المصفوفة الداخلیة ، فیرجع مرة أخرى الى حلقة التكرار الداخلیة وقد
والتي ( arr[0][ تساوي ( 3 ) بعد الزیادة فیتحقق الشرط فندخل الحلقة فیطبع قیمة ( [ 3 ( j ) أصبحت
تعني ..
٤٣
الموقع ( 0 ) من المصفوفة الرئیسیة والموقع ( 3 ) من المصفوفة الداخلیة . أي أنه سیطبع الرقم ( 5 ) . فنعود
أصبحت ( 4 ) بعد الزیادة فیفشل الشرط لان ( 4 ) لیست أقل ( j ) مرة أخرى الى الحلقة الداخلیة وتكون قیمة
أي البدء بسطر جدید ... ونعود ( <br /> ) من ( 4 ) . فنخرج من الحلقة الداخلیة ونذهب الى أمر طباعة
هي ( 1 ) " أي بعد الزیادة فقد كانت ( 0 ) وبعد الانتهاء من ( i ) لحلقة التكرار الرئیسیة ، فتصبح قیمة
أي هل هي ( arr.length ) الدورة الاولى أصبحت ( 1 ) . فنفحصالشرط الذي هو " هل ( 1 ) أقل من
تساوي ( 0 ) ونفحصالشرط والذي ( j ) أصغر من ( 3 ) ... فیتحقق وندخل الى داخل الحلقة الداخلیة فنبدأ ب
وتعني طول الموقع ( 1 ) في ( arr[1].length ) والذي هو ( arr[i].length ) أقل من ( j ) هو هل
المصفوفة الرئیسیة وبالتالي فهو ( 4 ) لان الموقع رقم ( 1 ) في المصفوفة الرئیسیة یحتوي على مصفوفة
أي قیمة ( arr[1][ 0 ) فندخل بداخل الحلقة فنطبع قیمة ( [ 0 < بداخلها أربعة عناصر . فیصبح الشرط ( 4
( الموقع رقم ( 1 ) في المصفوفة الرئیسیة والموقع رقم ( 0 ) في المصفوفة الداخلیة أي سوف یطبع الرقم ( 7
قیمتها ( 1 ) " أي بعد الزیادة " فیتحقق الشرط ( j ) ثم نعود مرة أخرى الى حلقة التكرار الداخلیة وتصبح
والتي تعني الموقع رقم ( 1 ) في المصفوفة الرئیسیة والموقع ( arr[1][ فندخل بحلقة التكرار فنطبع قیمة ( [ 1
رقم ( 1 ) في المصفوفة الداخلیة والذي هو ( 9 ) ونعود مرة أخرى الى حلقة التكرار الداخلیة بعد أن اصبحت
والتي هي ( 11 ) فنعود مرة أخرى الى ( arr[1][ هي ( 2 ) فیتحقق الشرط فنطبع قیمة ( [ 2 ( j ) قیمة
والتي هي ( arr[1][ تساوي ( 3 ) فیتحقق الشرط وندخل بداخلها فیطبع ( [ 3 ( j ) الحلقة الداخلیة لتصبح قیمة
قیمتها ( 4 ) فلا یتحقق الشرط " أي یفشل " ( j ) 13 ) فنعود مرة أخرى لحلقة التكرار الداخلیة لتصبح )
أي البدء بسطر جدید ، ثم نعود مرة أخرى الى الحلقة ( <br / > ) فنخرج من الحلقة الداخلیة ونذهب الى أمر
هي ( 2 ) فیتحقق الشرط فندخل بداخل حلقة التكرار فنذهب الى حلقة التكرار ( i ) الرئیسیة لتصبح قیمة
فیتحقق الشرط لدینا فندخل الى ( j < Arr[2].length ) تساوي ( 0 ) ویصبح الشرط ( j ) الداخلیة فنبدأ ب
ثابتة ( i ) والتى هي ( 15 ) وهكذا تستمر مع بقاء قیمة ( Arr[2][ حلقة التكرار الداخلیة فنطبع قیمة ( [ 0
التى تزید بأستمرار حتى یفشل الشرط فنخرج من حلقة التكرار الداخلیة فنذهب ( j ) والتى هي ( 2 ) وقیمة
قیمتها ( 3 ) " أي ( i ) أي البدء في سطر جدید ثم نعود الى حلقة التكرار الرئیسیة لتصبح ( <br /> ) للأمر
بعد الزیادة " فیفشل الشرط فال ( 3 ) لیست أقل من ( 3 ) وبالتالي عدم الدخول لتنفیذ مابداخل حلقة التكرار
الرئسیسة " أي بمعنى أننا لن ندخل الى حلقة التكرار الداخلیة " إذا هنا نكون قد إنتهینا من الطباعة في حلقات
التكرار المتداخلة والصعبة بصراحة . . .
وهكذا نكون قد أنهینا البرنامج الشاق علینا ( </tt> ) وبعد خروجنا من حلقة التكرار الرئیسیة نغلق الوسم
وعلیك . .
مثال:
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var arr = [ [2,4] ,
[6] ,
[8,10,12] ] ;
for (i=0 ; i< arr.length ; ++i)
{
for (j=0 ; j< arr[i].length ; ++j)
document.writeln( arr[i] [j] + " " );
document.writeln( "<br />" );
}
</script>
</head>
<body></body>
</html>
٤٤
تحلیل هذا المثال نتركه لك . . وإذا لم تستطع تحلیله جیدا فلا تتردد في مراسلتي لمساعدتك . .
ملاحظة :
هنا تستطیع أستخدام أي شكل لحلقة التكرار في المصفوفة ولكن أنا أفضل أن تستخدم الشكل الأول . والذي
أستخدمه في برامجنا السابقة . فهو أكثر وضوحا لك ولكن هذا رأیي الشخصي ولیس بالضرورة أن تعمل به
فالامر متروك لك .
for (i=0 ; i< أسم المصفوفة .length ; ++i )
تكافئ
for (var i in ( أسم المصفوفة
-----------------------------------------------------------------------------
for ( var j=0 ; j< أسم المصفوفة الرئیسیة [i]. length ; ++j )
تكافئ
for ( var j in أسم المصفوفة الرئیسیة [i] )
٤٥
: Math Object
وهي كائنات او طرق اذا جاز التعبیر تقوم بالعملیات الحسابیة .. وطریقة استدعائعا او تطبیقها تكون على
الصیغة التالیة :
ثم بین قوسین یوضع ما هو مراد حسابه ( 0 ) .. واسم ( dot ) ثم نقطة ( Object ) اول شيء ذكر اسم ال
اي الطرق " mathematical calculation " من عبارة ( Math ) هنا هو ( Object ) ال
الحسابیة " اذا جاز التعبیر " اذا الصیغة العامه هنا هي :
مثال :
هنا كاننا نقول نرید الجذر التربیعي للعدد ( 9 ) اذا الجواب سوف یكون ( 3 ) وهذا ما سوف یخرجه لنا
الصیغة السابقة
ملاحظة :
اما ( capital letter ) یاتي بال ( M ) یجب هنا الالتزام بالحروف من كبیره وصغیره فركز حرف ال
( Math ) .... ( small letter ) البقیة تأتي في
الطریقة الوصف مثال
abs(7.2) = 7.2
abs(0.0) = 0.0
abs(-5.6) = 5.6
(x) القیمة المطلقة ل abs(x)
ceil(9.2) = 10.0
ceil(-9. = -9.0
التقریب لأكبر عدد حقیقي ceil(x)
cos(0.0) = 1.0 (x) جیب التمام (جتا) ل cos(x)
exp(1.0) = 2.71828
exp(2.0) = 7.38906
(ex) طریقة الأس exp (x)
floor (9.2) = 9.0
floor (-9. = -10.0
التقریب لأصغر عدد حقیقي floor (x)
log (2.718282) = 1.0
log (7.389056) = 2.0
(x) لوغارثم log (x)
max (2.3,9.7) = 9.7
max (-2.3,-9.7) = -2.3
(y) و (x) أكبر قیمة من max (x,y)
min (2.3,9.7) = 2.3
min (-2.3,-9.7) = -9.7
(y) و (x) أصغر قیمة من min (x,y)
pow(2.0,7.0) = 128.0
pow(9.0,0.5) = 3.0
(xy) تعني (y) مرفوع للأس (x) pow(x,y)
round(9.7) = 10
round(9.25) = 9
لأقرب عدد حقیقي (x) تقریب round(x)
sin(0.0) = 0.0 (x) جیب (جا ) ل sin(x)
sqrt(900.0) = 30.0
sqrt(9.0) = 3.0
(x) الجذر التربیعي ل sqrt(x)
tan(0.0) = 0.0 (x) قتا tan(x)
Math . ( الرقم او المتغیر) اسم العملیة الحسابیة
Math.sqrt(9)
٤٦
مثال :
في البرنامج الجافا سكربت .. ( Math Object ) بشكل عام هكذا تكتب ال
بمفرده في جملة ( <br /> ) فجملة الطباعة الاولى سوف تطبع الجذر التربیعي للعدد ( 9 ) ثم وضعت ال
طباعة لكي لا یختلط علیك الامر وذلك لكي ننزل سطرا جدیدا ثم تاتي جملة الطباعة الثالثة تطبع لنا الرقم
الاكبر بین الرقمین الذین وضعناهما ثم وضعنا جملة الطباعة الثالثة والتي هي نزول سطر جدید " بدایة سطر
جدید " ثم وضعنا جملة الطباعة الرابعة والتي سوف تطبع لنا جیب الرقم واحد ...
ملاحظة :
لو اردت ان تعمل مقارنه بین ثلاثة ارقام والخروج بالاكبر وقتها تكتب هكذا :
Math.max(Math.max(4,5), 6)
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
document.write(Math.sqrt(9));
document.write("<br />");
document.write(Math.max(10,2));
document.write("<br />");
document.write(Math.sin(1.0));
</script>
</head>
<body></body>
</html>
نخرج الاكبر من هنا
ویكون رقم ٥
١
نقارن بین
الرقمین ٥ و ٦
٢
الخطوة الاولى
الخطوة الثانیة
٤٧
( الذي في الداخل اي بین الرقمین ( 4 و 5 ( Math Object ) هنا كاننا نقول اخرج الرقم الاكبر في ال
الذي في الخارج وهو سوف یكون بین الرقمین ( 5 ) الذي خرج من ال ( Math Object ) ومن ثم طبق ال
في الخارج اي ( Math Object ) التي في الداخل وبین الرقم ( 6 ) الذي في ال ( Math Object )
الرئیسیة ..
- اذا اردنا ان نخرج الرقم الاكبر بین اربعة ارقام تكتب الصیغة هكذا :
- اي هنا ناخذ كل عملیة على حدى وكانها لوحدها ...
Math.max(Math.max(4,5),Math.max(11,20))
تمارین إضافیة على الدوال الریاضیة :
الثابت الوصف القیمة
قیمة ثابتة تقریبا تساوي 2.718 Math.E
اللوغاریثم الطبیعي ل ( 2) تقریبا تساوي 0.693 Math.LN2
اللوغاریثم لطبیعي ل ( 10 ) تقریبا تساوي 2.302 Math.LN10
تقریبا تساوي 1.442 Math.LOG2E
تقریبا تساوي 0.434 Math.LOG10E
تقریبا تساوي 3.141592653589793 Math.PI
تقریبا تساوي 0.707 Math.SQRT1_2
الجذر التربیعي ل ( 2.0 ) تقریبا تساوي 1.414 Math.SQRT2
: Methods of the String Object
الطریقة الوصف
(index) یرجع الحرف المحدد بال charAt(index)
(index) یرجع شیفرة الحرف المحدد بال charCodeAt(index)
المحدد قبل الامر (string) یدمج النص المحدد في ال
الذي (string) مع النص المحدد في ال (concat)
(concat) بین القوسین اي الذي بعد
concat(string)
یحول الارقام المحددة بین الاقواس الى قیمتها الحرفیة fromCharCode(value1,value2
,…)
من بعد (substring) البحث عن النص المحددة في
من النص المحدد في ال (index) الموقع رقم
المحدد قبل الأمر. (string)
ویرجع أول موقع یحتوي على أول حرف من النص
(string) من ال (substring) المحدد في
indexOf(substring,index)
من قبل (substring) البحث عن النص المحددة في
من النص المحدد في ال (index) الموقع رقم
lastIndexOf(substring, index)
٣
١
٢
٥
٢٠
ناتج العملیة ٢٠
رقم ١
ناتج العملیة
رقم ٣
ناتج العملیة
رقم ٢
٤٨
المحدد قبل الأمر. (string)
ویرجع أول موقع یحتوي على أول حرف من النص
(string) من ال (substring) المحدد في
من ال (end) الى (start) یرجع النص من الموقع
المحدد قبل الأمر (string)
slice(start,end)
الى مجموعة (string) تقسیم النص المحدد في
كلمات نحن نحدد كیفیتها .
split(string)
وعدد أحرفه (start) یرجع النص المحدد من الموقع
المحدد قبل الأمر . (string) من ال (length) substr(start,length)
الى الموقع (start) یرجع النص المحدد من الموقع
(end)
substring(start,end)
المحدد قبل الأمر الى حروف (string) یحول ال
انجلیزیة صغیرة .
toLowerCase()
المحدد قبل الأمر الى حروف (string) یحول ال
انجلیزیة كبیرة .
toUpperCase()
(string) یرجع نفس ال النص المحدد في ال toString()
(string) یرجع نفس ال النص المحدد في ال valueOf()
(<a> name </a>) یعمل عمل anchor(name)
(<blink>…</blink> ) یعمل عمل blink()
أي الكتابة على شكل آلة (<tt>…</tt>) یعمل عمل
طابعة
fixed()
(<a>…</a>) یعمل عمل link(url)
أي یضع خط (<strick>…</strick >) یعمل عمل
في وسط الكلام
strike()
أي الكتابة تحت (<sub>…</sub>) یعمل عمل
السطر
sub()
أي الكتابة فوق (<sup> … </sup>) یعمل عمل
السطر
sup()
مثال :
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var a ="samialr";
document.write("<p> اطبع الحرف الموجود في الموقع صفر " + a.charAt(0) );
</script>
</head>
<body></body>
</html>
٤٩
خاصه بالوقت والتاریخ : Date Object
وهي كائنات خاصه بالوقت اي تقوم بعملیات ذات علاقه بالوقت من جلب ووضع .
طریقة تعریفه :
var a = new Date( )
الطریقة الوصف
یعود بالارقام من ١ الى ٣١ حسب الیوم getDate()
یعود بالارقام من ١ الى ٣١ حسب الیوم getUTCDate()
یعود بالارقام من 0 " الأحد " الى 6 " السبت " getDay()
یعود بالارقام من 0 " الأحد " الى 6 " السبت " getUTCDay()
یعود بالسنة من أربعة أرقام getFullYear()
یعود بالسنة من أربعة أرقام getUTCFullYear()
یعود بالساعة من 0 الى 23 getHours()
یعود بالساعة من 0 الى 23 getUTSHours()
یعود بالمیلي ثانیة من 0 الى 999 getMilliseconds()
یعود بالمیلي ثانیة من 0 الى 999 getUTCMilliSecond()
یعود بالدقیقة من 0 الى 59 getMinutes()
یعود بالدقیقة من 0 الى 59 getUTCMinutes()
یعود بالشهر من 0 "ینایر" الى 11 " دیسمبر" getMonth()
یعود بالشهر من 0 "ینایر" الى 11 " دیسمبر" getUTCMonth()
یعود بالثانیة من 0 الى 59 getSeconds()
یعود بالثانیة من 0 الى 59 getUTCSeconds()
سوف نشرح بعض منها اثناء المثال وهذا لكي تصلك بشكل افضل وما یطبق على البعض یطبق على
البقیة ..
setDate(val)
setUTCDate(val)
setFullYear(y,m,d)
setUTCFullYear(y,m,d)
setHours(h,m,s,ms)
setUTCHours(h,m,s,ms)
٥٠
setMilliSeconds(ms)
setUTCMilliSeconds(ms)
setMinutes(m,s,ms)
setUTCMinutes(m,s,ms)
setMonth(m,d)
setUTCMonth(m,d)
setSeconds(s,ms)
setUTCSeconds(s,ms)
setTime(ms)
یعود بالوقت والتاریخ بالتفصیل toLocaleString()
یعود بالوقت والتاریخ بالتفصیل toUTCString()
لنتعرف كیف نتعامل مع ماذكرناه في الجدول :
. ( string ) ولكن قبل ذلك لنأخذ فكرة سریعة عن ماهو المتغیر النصي التالي
صیغته :
ونضع بداخله نص ولكي تخبر ان هذا نص نضعهبین ( " ) . ( a ) أي تعرف متغیر
ملاحظات على هذا المتغیر :
١- أي شي یسند للمتغیر ویكون بین ( " ) سوف نأخذه على أساس أنه نصحتى لو كان رقم .
مثال :
هذا لانأخذه كقیمة رقمیة إطلاقا بل نصلیس له قیمة رقمیة .
مثال آخر :
هذا عبارة عن نص كیف عرفنا ذلك لان الرقم جاء بین ( " ) حتى الاحرف .
تعتبر نصوأیضا الفراغ یعتبر حرف إذا جاز التعبیر . ( string ) ٢- العلامات او الرموز إذا جائت في ال
مثال :
هو موقع السادس إبتدائا من ( Memory ) هذى المسافة تعتبر حرف (" @) أي أنها تأخذ موقع في ال
الصفر .
إذا لننتقل الأن الى كیفیة التعامل مع ماذكرناه بالجدول .
var a = " thamer " ;
var a = " 123 " ;
var a = "ab12 " ;
var a = "ab c12@ " ;
٥١
صیغة كتابتها :
( string ) بما أننا نتحدث عن طرق تطبق على الكائنات النصیة إذا یجب أن نكون لدینا متغیر نصي أي
لنجري علیه مانرید من الطرق سالفة الذكر في الجدول إذا :
.( string ) ١- نعرف أول شي متغیر نصي
كیف ذلك : ( Methods ) ٢- الأ ن نطبق علیه ال
هنا تكون الصیغة التى ترید أن تطبقها على النص .
مثال :
.( string ) ( ذكر الفهرس أو المتغیر أو النص أو القیمة ) أسم الطریقة . أسم المتغیر النصي
لنأخذ شكلان ونرى :
١- نعرف متغیر نصي
( Methods of the string object ) ٢- نضیف ال
بطول ( 4 ) أي أطبع ( a ) أخبرناه أننا نرید أن یطبع لنا أحرف من الموقع صفر من المتغیر النصي
.( Java ) الحروف في الموقع ( 0 و 1 و 2 و 3 ) إذا سوف یطبع خمسة أحرف... وهي
لنأخذ الشكل الاخر الان : •
١- نعرف متغیر نصي
( Methods of the string object ) ٢- نضیف ال
ولكن بعد تحویل احرفها الى الأحرف الانجلیزیة ( javascript ) وفي هذه الحالة سوف یطبع لنا كلمة
( JAVASCRIPT ) الكبیره اذا سوف تظهر لنا بعد طباعتها بالشكل التالي
قیمة بداخل القوسین عزیزي المتدرب في البدایة أخبرتك ( toUpperCase ) قد تتسائل لماذ لم نضع بعد
أنك تضع إذا تطلب ذلك .. ولكن یوجد طرق لایستلزم وجود قیمة أي علیك الالتزام بالجدول.. منها مثلا :
نرید فقط أن نجعل النص یبدو بالحروف الكبیرة إذا كل الذي علینا ذكره أسم المتغیر النصي ونقطة ثم كلمة
( a ) إذا في المثال السابق بما أننا نرید أن نقول أننا نرید أن نجعل المتغیر النصي ( toUpperCase )
یطبع ولكن لیس بكل أحرفه بل ترید أن یطبع لنا أربع أحرف بدایة من الموقع صفر إذا هنا نحن بحاجة الى أسم
var a = " Javascript " ;
var a = "Javascript " ;
a . substring(0,4)
var a = "Javascript " ;
a . toUpperCase(0,4)
٥٢
المتغیر النصي وثاني شي من أي موقع یبدأ العد إذا هنا یجب أن نذكر صفر ثم یجب أن نكتب كم طول الذي
نریده من الموقع صفر إذا هنا نذكر ( 4 ) أي أربع خطوات بدایة من الصفر .
في هذا المثال لن نحتاج لنشرحه لك لان شرح كل امر او خطوه موجود داخل جملة الطباعة ما علیك سوى
قراءة المثال وتطبیقه وفهم ما تحتویه جمل الطباعة من اوامر وشرح .
أي كائنالتاریخ والوقت إذا جاز التعبیر . هنا تخصص الكائن ( Date object ) كیفیة التعامل مع •
ووضع في متغیر معین ومن ثم تطبیقه على المتصفح بخاصیة أو بطریقة من الخواص التي ( Date )
ذكرناه في الجدول،
إذا كیفیة كتابتها : •
بهذا الشكل : ( Date ) ١- نعرف متغیر نضع به الكائن
٢- نطبق مانریده من الخواص أو الطرق المذكوره في الجدول على هذا المتغیر الذي وضعناه .
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var a = " samialr ";
var b = " name ";
document.writeln("<p> سوف یطبع الحرف الذي في الموقع صفر " + a.charAt (0));
document.writeln("<p> سوف یطبع الكلمة التي في المتغیر بأحرف كبیرة " + a.toUpperCase () );
document.writeln("<p> دمج المتغیرین النصیین لیصبح نص واحد " + b.concat (a) );
</script>
</head>
<body></body>
</html>
var d = new Date();
d.getDay() +1
إسم المتغیر الذي خصصنا له
Date الكائن
الخاصیة المطلوب تطبیقها - وهنا نرید ان یطبع لنا الیوم
الذي سوف یطبعه لنا بالأرقام
٥٣
ملاحظة :
وضعنا ( + 1 ) لانه یطبع لنا الیوم من ٠ الى ٦ ولكننا نریده من ١ الى ٧
( getMonth() ) او ( getDate() ) مثل ( get ) ولكن الذي طبقنا علیه اي الكائن هو الخاصبالطرق
وهكذا ...
الخ ... ( setMonth(m,d) ) او ( setDate(value) ) مثل ( set ) ولكن ماذا عن
( getMonth ) وهكذا إذا هنا قد نحتاج ان نخبر المتصفح بان یحضر لنا الشهر من الجهاز ویطبعه لنا مثل
كأننا نقول أحضر الشهر من الجهاز ( get ) هذا یعني أن نقول للمتصفح أطبع لنا الشهر بعبارة أخرى
الحاسوب وأطبعه لنا .
أما لو أردنا نحن أن نضع الشهر الذي نریده ولیس الموجود بجهاز الحاسوب عندها نكتب
نضع بداخلها قیمتین كما عرفناها ( setMonth(m,d) ) وخاصیة أو طریقة ( setMonth(2,1) )
وتعني لنا الیوم مثل لو وضعنا ( d ) وتعني قیمة رقم الشهر المطلوب وقیمة ل ( m ) في الجدول ... قیمة ل
1 ) نعني به یوم الأحد وشریطة أن نضع ( + 1 ) الخاصیة لاننا ذكرنا سابقا أنه دائما في الكائن أو التاریخ )
كنا نقول أحضر كذا ( get ) یبدأ من الصفر و الصفر هو الذي یمثل یوم الاحد . إذا لاحظت أنه عندما نكتب
كأننا نقول ضع كذا وكذا ولكن كما نحدده لك نحن ولیس كما هو ( set ) وأطبعه كما هو وعندما نقول
موجود في الجهاز او الواقع الافتراضي .
ملاحظات :
١- دائما كل الخواص أو الطرق تبدأ من الصفر مثلا :
یمثل یوم الثلاثاء ، وهكذا ونفس الشي مع یمثل یوم الاثنین ، 2 یمثل یوم الاحد ، 1 0
الاشهر.
٢- هنا یطبع لنا دائما الأرقام التي تمثل الاشهر والایام وإذا أردنا أن یطبعها لنا كأسماء نضع الارقام في
ونجعله یطبعها لنا كأسماء وسوف نأخذ مثال ونرى لاحقا . ( switch )
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var d = new Date() ;
document.writeln("<p> طباعة رقم الیوم من الشهر <p>" + d.getDate());
document.writeln("<p> طباعة رقم الشهر <p>" + d.getMonth());
document.writeln("<p> طباعة السنة لنا بأربع أرقام <p>" + d.getFullYear());
</script>
</head>
<body></body>
</html>
أقصد بها قیمة انت تحددها
لتمثل الیوم
أقصد بها القیمة التي
سوف تحددها انت لتمثل
الشهرpar ٥٤
لنأخذ مثالا أخر ونحلله :
<html >
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var c = new Date (2004 , 9 ,29 , 1 , 7, 0 );
document.writeln("<b>Date :</b> + " c + "<br>");
c.setDate(11);
c.setMonth(9);
c.setHours(23);
c.setFullYear(2003);
c.setMinutes(50);
c.setSeconds(55);
document.writeln("<b>Dtae : </b>" + c);
</script>
</head>
<body></body>
</html>
٥٥
لنحلل المثال سویا ونرى :
إذا جاز التعبیر أي Array بشكل ( Date ) ووضعنا بداخله الكائن ( c ) أول شي عرفنا متغیر هو المتغیر
أننا وضعنا بداخله قیم سوف تسند إلى أمور خاصة بالتاریخ والوقت .
وبهذا نكون عبرنا عن السنة بالقیمة الاولى وهي 2004 وعبرنا عن الشهر بالقیمة الثانیة وهي 9 وعن الیوم
بالقیمة الثالثة وهي 29 وعن الساعة بالقیمة الرابعة وهي 1 وعن الدقیقة بالقیمة الخامسة وهي 7 وعن الثواني
بالقیمة السادسة وهي 0 . إذا هنا سوف بتعرف على القیم هكذا : سنة , شهر , یوم , ساعة , دقیقة , ثانیة .
ثم كتبنا جملة الطباعة :
أي بما یحتویه… ومنها سوف یطبع لنا التاریخ والوقت الذي حددناه في بدایة ( c ) وبها نكون قد طبعنا المتغیر
ولكن لنقل أننا أردنا أن نغیر القیم التي عرفناها في بدایة برنامجنا للمتغیر .( c ) برنامجنا عند تعریفنا للمتغیر
أي الوقت والتاریخ .لنرى كیف : ( c )
الى هذه القیم التى ذكرناها وهو سوف یغیرها ( c ) بهذه الطریقة نكون كأننا غیرنا كل قیمة في المتغیر
وبجانبها الشي الذي نرید تغیره سواءا یوم ( set ) مباشرتا فلا علیك سوي كتابة أسم المتغیر ثم نقطة ثم
وهكذا . ثم الان كتبنا جملة الطباعة وأخبرنا البرنامج أن یطبع هنا المتغیر ( FullYear ) أو سنة ( Date )
مرة أخرى. ( c )
ولكن هنا سوف یطبع المتغیر الذى سوف یعبر لنا عن التاریخ والوقت بالقیم الجدیدة التي حددناها قبلها .
- عزیزي المتدرب لقد وضعت لك في هذا البرنامج شكلین لتحدید الوقت والتاریخ بنفسك واحدة محددة من بدایة
برنامجنا من خلال تعریفنا للمتغیر والثانیة عندما أردنا تغییر القیم التى یحتویها المتغیر وهذا لكي تعم الفائدة
وتعرف أبعاد الخاصیة .
عند إستخدامها في التاریخ والوفت تحدد لنا القیم نفسها من ( get ) إذا في النهایة نستنتج شي واحد وهو أن
نحن من نحدد ونضعهما یدویا. ( set ) الجهاز أما ال
newDate (2004 , 9 , 29 , 1 , 7, 0 );
document.writeln("<b>Date : </b>" + C);
c.setDate(11);
c.setMonth(9);
c.setHours(23);
c.setFullYear(2003);
c.setMinuites(50);
c.setSeconds(55);
document.writeln("<b>Dtae : </b>" + c);
٥٦
مثال لنرى كیفیة تحویل أرقام الایام الى اسم الیوم كتابتا :
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var d = new Date() ;
switch( d.getDay()+1 )
{
case 1 :
document.writeln(" ;(" یوم الأحد
break ;
case 2 :
document.writeln(" ;(" یوم الأثنین
break ;
case 3 :
document.writeln(" ;(" یوم الثلاثاء
break ;
case 4 :
document.writeln(" ;(" یوم الأربعاء
break ;
case 5 :
document.writeln(" ;(" یوم الخمیس
break ;
case 6 :
document.writeln(" ;(" یوم الجمعة
break ;
case 7 :
document.writeln(" ;(" یوم السبت
break ;
}
</script>
</head>
<body></body>
</html>
٥٧
سابقا في الدرس الخاص به ولكن سوف ( switch ) المثال لا یحتاج الى تحلیل وذلك لاننا قمنا بشرح ال
اضع بعضالنقاط الرئیسیة التي بها تلخیصلشرح هذا البرنامج .
بهذا الشكل : ( Date ) - عرفنا متغیر ووضعنا به الكائن
وبعد ذلك ( switch( d.getDay()+ كود جلب الیومبالارقام ( ( 1 ( switch ) - وضعنا بداخل ال
الى جمل الطباعة لكي یطبع لنا الیوم باللغة العربیة ( switch ) سوف یقارن الرقم الذي سوف یسند الى ال
اي باحرف اللغة العربیة وكان بإمكاننا ان نعرف متغیر من ثم نسند له كود جلب الیوم بالارقام ومن ثم نضع
بهذه الطریقة ( switch ) هذا المتغیر في ال
. ( switch ) ولكنني اختصرت الطریق ووضعت كود جلب الیوم مباشرة في ال
var d = new Date();
var d = new Date();
var n = d.gateDay();
switch ( n )
{
58
معلومات تطبیقیة :
( forms ) نأتي هنا الى ذكر آخرموضوعین في الكتاب وهما كیفیة التعامل بالجافا سكربت مع النماذج
لكي لا أطیل علیك عزیزي المستخدم فأنا أعلم أن ( status ) والشيء الآخر هو ظهور الكتابة ضمن شریط
الكتاب أثقل علیك من كثر مایحتوي على شرح ولهذا سوف أذكر مثال ونحلله مباشرة فكل شيء یفهم من
خلال التطبیق ..
مثال :
وهو تعبئة نموذج من قبل المستخدم وبعد التعبئة یضغط على أیقونة موافق فیطبع بیاناته في صفحة الأنترنت
<html dir="rtl">
<head><title> java script </title>
<script type="text/javascript">
function information()
{
var name=info.name.value;
var job=info.job.value;
var add=info.address.value;
var comm=info.command.value;
document.writeln("<table cellspasing=\"0\"
cellpadding=\"5\" border=\"1\" width=\"80%\"
align=\"center\" dir=\"rtl\" bgcolor=\"#eaeaea\"
bordercolor=\"#000000\">");
document.writeln("<caption><h3>
المعلومات التي سجلتها لدینا </h3></caption>");
document.writeln("<tbody>");
document.writeln("<tr><td width=\"30\"><b> : الأسم
</b></td><td>" + name + "</td></tr>");
document.writeln("<tr><td width=\"30\"><b> المهنة
:</b></td><td> " + job + "</td></tr>");
document.writeln("<tr><td width=\"30\">
<b> العنوان :</b></td><td> " + add + "</td></tr>");
document.writeln("<tr><td width=\"30\">
<b> ملاحظات :</b></td><td> " + comm + "</td></tr>");
document.writeln("</tbody>");
document.writeln("</table>");
}
</script>
</head>
<body >
<form name="info" action="">
<table cellspacing="0" cellpadding="5" border="0" width="80%" align="center">
<tbody>
<tr>
<td> الأسم : </td>
<td><input type="text" name="name" value="" size="31"></td>
</tr>
<tr>
<td> العنوان :</td>
<td> <input type="text" name="address" value="" size="45"></td>
</tr>
<tr>
<td> المهنة :</td>
<td><input type="text" name="job" value="" size="20"></td>
</tr>
<tr>
<td> ملاحظات :</td>
<td><textarea name="command" rows="4" cols="50"></textarea></td>
</tr>
<tr>
<td colspan="2" align="center">
</br>
<input type="button" name="show" value=" "اعرض
onclick="information()"><input type="reset" name="del" value=" < "مسح
</td>
</tr>
</tbody> </table></body></html>
٥٨
59
عزیزي المتدرب لا تنزعج من طول الكود فالكود لیس بطوله بل بأوامره المستخدمه وتكنیكه ومن هنا لا ارید
ان احلل الكود لانه لا یحتاج تحلیل فلا علیك من رهبة كثرته وطوله ومن هنا سوف اشرح لك الامور التي بها
اختصارالشرح بالكود ..
اولا هذا الكود لیس به امور كثیره او اوامر كثیرا بل هو بسیط الى ابعد الحدود لننظر كیف ذلك :
لقد عرفت المتغیرات بالشكل التالي :
هنا سوف اتجاوز بشرحي قلیلا عن النمط البرمجي البحت لكي تصل المعلومه اكثر اذا سمحت لي ..
var name=info.name.value ;
var job=info.job.value ;
var add=info.address.value ;
٥٩
60
( add ) و ( job ) و ( name ) هنا عرفنا المتغیرات بالشكل الذي نعرفه مثل
ویكون هو عباره عن ( a ) وتذكر أخي المتدرب اننا كنا نعرف في الماضي... اي في المصفوفات متغیر مثلا
مصفوفه وكانت تكتب بشكل التالي :
ومنها كنا نعرف ان هذا المتغیر هو عباره عن مصفوفه ..
هو عباره عن قیمه سوف یدخلها المستخدم في النموذج ( ( name ) وهنا نفس الشيء قلنا مثلا المتغیر
بهذا ( name ) هو عباره عن مصفوفه .. لهذا كتبنا المتغیر ( a ) كما كنا نقول ان هذا المتغیر ( form
الشكل :
هو عباره عن قیمه سوف تكون مدخله من قبل المستخدم في حقل من ( name ) اي هنا نقول ان المتغیر
لكي تخزن بداخلها .. ( name ) والذي یحمل اسم ( form ) حقول النموذج اي ال
اذا هنا نأتي للتساؤلك عزیزي المتدرب ... ماذا یعني الكود التالي :
لنفسرها سویا :
( form ) ونعني بها اسم النموذج الذي سوف یدخل به المستخدم القیمه والذي یكتب في ال ( info )
النصیه یجب ان یحمل النموذج اسم اذا هنا یجب ان نضع نفس الاسم الذي ( html ) فكما تعرف في لغة
وهذا لكي نخبر ان هذا المتغیر متعلق بذلك النموذج .. ( name ) حددناه ..للمتغیر
ونعني بها الاسم الذي سوف نضعه بالحقل الذي سوف یدخل به المستخدم القیمه ومن ثم تخزن ( name )
والتي تكون في النموذج بهذا الشكل : ( name ) في المتغیر
والذي سوف یدخله المستخدم سوف یخزن في المتغیر ( input ) وهذا لكي نمیز ان الحقل هذا الذي في ال
اي انه خاص به . ( name ) الذي اسمه
ونعني به ان هذه القیمه سوف یدخلها المستخدم لذلك هي غیر معلومه الى الان .. ( value )
var a = new Array( ) ;
var name=info.name.value ;
info.name.value ;
< form name="info" action=" " >
< input type="text" name="name" value="" size="3” >
٦٠
61
وبهذا تكون الصیغة للمتغیر والقیمة التي سوف تخزن بها كتالي :
إذا عرفنا لماذا نضع المتغ&
لاتنزعج تستطیع أن تكتبه كما تعلمنا سابقا أي :
function output ( )
function cube ( y )
T = cube ( x ) ;
return y*y*y ;
٣٥
فقط أحببت أن أریك طریقة ثانیة من باب العلم بالشئ فقط لا غیر وقد تلجأ له عند الحاجه .
٤- معلومة مهمة جدا ...
عندما تكتب برنامجك بالجافا سكربت ویكون یحتوي فقط على دوال كما في مثالنا هذا فیجب علیك أن تذكر في
هذه العبارة : ( body ) ال
؟ ( body ) داخل ال ( onload ) قد تتساءل لماذا وضعنا
هو إستدعائها ( onload ) الجواب لان برنامجنا عبارة عن دوال والدوال لاتعمل الا عند إستدعائها فأعتبر ال
فهذا بسبب أن هذه الدالة هي الرئیسیة ( output ( ) ) " أي تشغیلها " أما لماذا ذكرنا أسم الدالة الاولى
وسوف ( form ) مثلا في حالة ال ( onload ) فهي التى تستدعي الدالة الثانیة . ولكن لیس دائما نضع
نتحدث عن هذا الموضوع لاحقا .
var z ;
z = y*y*y ;
return z ;
< body onload = " output ( ) " >
٣٦
: ( Arrays ) المصفوفات
هنا سوف نتطرق الى موضوع ذا أهمیة وهو المصفوفات فبإستعمالها نستطیع توفیر الوقت والجهد بالاضافة
الى جعل البرنامج أصغر حجما وأسرع تنفیذا .
وتكتب على أكثر من شكل منها :
١- هنا عرفنا متغیر هو عبارة عن مصفوفة تحتوي على ( 5 ) عناصر أما ماقیمة هذه العناصر فسوف نذكرها
داخل البرنامج .
٢- وهنا عرفنا المتغیر على أنه مصفوفة دون تحدید كم عنصرا تحتوي وهنا یجب أن نحدد كم عدد عناصر
او ما شابه " كأن نذكرها في حلقة التكرار مثلا أما ما ( for ) المصفوفة في داخل البرنامج " اقصد في ال
قیمة هذه العناصر فسوف نذكرها أیضا في البرنامج .
٣- وهنا عرفنا المتغیر على أنه مصفوفة تحتوي على ثلاثة عناصر فوضعنا في كل عنصر قیمة رقمیة معینة
. وعادة تستخدم تعریف المصفوفة بهذا الشكل عندما تكون المصفوفة تحتوي على أرقام .
على أنه مصفوفة تحتوي على ثلاثة عناصر وكانت قیمة كل عنصر مبینة منذ ( a ) ٤- هنا عرفنا المتغیر
البدایة أي ( 1,2,3 ) أو ( "محمود" ، "ثامر" ، "سامي" ) أما كیف عرفنا أن المصفوفة تحتوي على ثلاثة
عناصر فهو عدد مابداخلها إذا هي مصفوفة عدد عناصرها ثلاث أما ماهي قیمة عناصرها فهي ( 1,2,3 ) أو
أي ( string ) (محمود ، ثامر ، سامي ) . ولاحظ أنه عندما تحتوي المصفوفة على نص " إذا جاز التعبیر
أسم او ما شابه یجب وضع الكلمة بین ( " ) .
دعنا نتحدث عن المصفوفات بشكل عام :
المصفوفة نستطیع تشبیهها بعمارة . العمارة یحتوي كل طابق منها على شقة واحدة . لنفرض أن العمارة تتكون
من أربعة طوابق فكان الطابق الأول یسكن به محمد والطابق الثاني أیهم والطابق الثالث أشرف والطابق الرابع
عماد . إذا هنا لدینا عمارة تتكون من أربعة طوابق كل طابق یحتوي على شخص فهذا هو الحال بالنسبة
للمصفوفة فالعمارة هي أسم المصفوفة . وعدد الطوابق الأربعة هو عدد عناصر المصفوفة والتى هي أربعة
والاشخاص الذي كان كل شخص منهم یسكن بطابق هم قیمة كل عنصر في المصفوفة . أي كأننا نقول كل
طابق منه یحتوي شخص " فهنا نقول كل عنصر ماذا یحتوي " .
دعنا نطبق هذا المثال بشكل عملي برمجي . .
لنمثل ماقلناه : ( a ) كلمة عمارة لنختصرها ونسمیها
var a = new Array ( 5 ) ;
a = new Array ( 1, 2, 3 ) ;
a = new Array ( " ; ( " محمود " , " ثامر " , " سامي
a = [ 3, 14, 6 ] ;
a = new Array (" ; (" عماد "," أشرف "," أیهم "," محمد
var a = new Array ( ) ;
٣٧
إذا هنا الموقع الأول في المصفوفة یساوي محمد والموقع الثاني أیهم والموقع الثالث أشرف والموقع الرابع عماد
. ولكن عادة في المصفوفات نبدأ من الصفر ولیس من الواحد أي نقول موقع الصفر یساوي محمد و الموقع
الاول یساوي أیهم والموقع الثاني یساوي أشرف والموقع الثالث یساوي عماد .
عزیزي المتدرب لاتنزعج من ذلك أعتبر العمارة تتكون من طابق أرضي وطابق أول وطابق ثاني وطابق ثالث
إذا محمد سوف یسكن في الطابق الارضي وهو الصفر أي موقع رقم صفر في المصفوفة وأیهم في الطابق
الأول أیا الموقع الاول في المصفوفة وأشرف في الطابق الثاني أي الموقع الثاني في المصفوفة وعماد في
الطابق الثالث أي الموقع الثالث في المصفوفة .
فیكون بهذا الشكل... " Memory " أما تمثیل المصفوفة بداخل الجهاز اي ال
" سوف أضع رسمة توضیحیة لتوضح لك كل شئ " :
50
90
20
45
قبل أن نبدأ بمثال لابد أن أوضح لك شیئا مهم . . .
بما أن المصفوفة تحتوي على عدة مواقع إذا یجب علي أن أجعل برنامجي یمر على كل موقع إذا هنا بحاجة الى
حلقة تكرار لكي استطیع المرور على كل موقع وأطبعه او أنفذه .
أكثرنا الحدیث . . لنأخذ مثالا فالمثال التطبیقي والعملي هو الذي یوضح ما بهم لك .
مثال :
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var name = new Array (" ; ("حمد"," محمود "," أحمد "," محمد
var i ;
for (i = 0 ; i < name.length ; i ++ )
document.writeln ( name[i] + " <br /> ") ;
</script>
</head>
<body></body>
</html>
a[0]
a[1]
a[2]
a[3]
مقدار القیمة
المخزنة بداخل
Array ال
اسم ال
Array
رقم الموقع المسمى
Index
٣٨
دعنا نحلل المثال سویا . .
أول شئ عرفنا أسم المصفوفة ثم وضعنا بها أربعة قیم أذا هنا نحن متفقین أننا عرفنا مصفوفة أسمها
الذي ( i ) تحتوي على أربعة مواقع كل موقع یحتوي على إسم بداخله. ثم عرفنا المتغیر ( name )
فتعني أن تستمر ( name.lengt ) سنستخدمه في حلقة التكرار . أستخدمنا في حلقة التكرار هذه العبارة
حلقة التكرار الى أن ینتهي طول المصفوفة أي أن حلقة التكرار سوف تستمر أربعة مرات لأن المصفوفة
تحتوي على أربعة مواقع وبما أننا بدأنا حلقة التكرار من صفر أذا سوف یمشي 3 2 1 0 . أذا صیغة طول
المصفوفة التى تكتب بالتكرار تكتب كالتالي :
عزیزي المتدرب إذا أنزعجت منها تستطیع أن لاتضعها . تستطیع وضع رقم ( 4 ) .. بدلا منها فنحن في هذه
المصفوفة جعلناها تحتوي على أربعة مواقع . فبالتالي نجعل حلقة التكرار تمر على الاربعة مواقع . قد تتساءل
3 , 2 ) اى , كیف أضع ( 4 ) فنحن لدینا ( 4 ) عناصر إذا یجب أن یكون العد الى ( 3 ) أي ( 1 , 0
اربعة اسماء فهنا یعتبر العد لاربعة مواقع . . نعم كلامك صحیح 100 % ولكنني في حلقة التكرار بدأنا من
0 ) ثم قلت أصغر من ( 4 ) أي أن ( 4 ) لیست داخلة . فلم أقل أصغر أو تساوي ( 4 ) . كذلك الحال )
..( name.length ) بالنسبة لل
واعني بها أنني أرید طباعة مایحتویه كل موقع من مواقع ( name[i] ) ذكرت داخل جملة الطباعة
المصفوفة . أي كأنني أقول أرید طباعة أسم كل شخص یسكن في كل طابق من طوابق العمارة . . . تذكر كما
قلنا سابقا . إذا كیف أفعل ذلك . . أكتب أسم المصفوفة ثم أفتح القوس "]" أضع رقم الموقع . . ثم أغلق
فهذا یعني أرید أن أعرف مایحتوي علیه الموقع صفر في ( name[ القوس "[" كأن مثلا أقول ( [ 0
( i ) المصفوفة وطبعا هو محمد . وهذا ماسوف یحدث بحلقة التكرار فأول مرة سوف ترسل حلقة التكرار قیمة
أي أطبع مایحتویه الموقع صفر ( name [ إذا سوف یكون ( [ 0 ( name [i] ) صفرا وبما أنني واضع
قد زید علیها واحد ( i ) والذي هو محمد ثم ینزل سطرا ونعود مرة ثانیة الى حلقة التكرار وتكون قیمة ال
أي أطبع مایحتویه الموقع رقم ( 1 ) وهو أحمد . ( name [ لتصبح ( 1 ) فندخل حلقة التكرار وتكون ( [ 1
قد زادت واحد لتصبح ( 2 ) فتدخل قیمة ( i ) ثم ینزل سطر ویعود مرة ثانیة الى حلقة التكرار فتكون قیمة
أي أطبع قیمة الموقع الثاني التى هي محمود . ثم تعود قیمة ( name [ الى حلقة التكرار فتصبح ( [ 2 ( i )
أي أطبع قیمة الموقع الثالث ( name [ بعد أن زیدت بواحد أي ( 3 ) فتدخل حلقة التكرار فتصبح ( [ 3 ( i )
بعد أن زیدت بواحد الى حلقة التكرار فلا یتحقق الشرط والذي ( i ) في المصفوفة هو حمد . ثم تعود قیمة ال
أي أقل من ( 4 ) فإذا لایتحقق الشرط فنخرج من حلقة التكرار أي نتوقف . ( i < name.length ) هو
وهنا ینتهي البرنامج ویكون قد طبع لنا :
أسم المصفوفة . length
محمد
أحمد
محمود
حمد
٣٩
ملاحظة مهمة :
اسم المصفوفة ) نستعملها فقط عندما یكون طول المصفوفة معلوم لدینا عند تعریفنا . length ) صیغة
للمصفوفة . وهنا یمكن ان نعرف طولها على شكلین :
مثلا :
مثلا :
فهنا نعرف ان المصفوفة تتكون من ثلاثة مواقع .
ففي هذه الحالة .... ( a.length ) أما متى لا نستخدم
مثلا :
فنحن لا نعرف ( .length ) فهنا نحن اثناء تعریفنا للمصفوفة لم نحدد على كم موقع تحتوي إذا كیف نستخدم
طول المصفوفة أي عدد مواقعها . إذا هنا یجب علینا ان نحدد طول المصفوفة بحلقة التكرار أي بدلا من ان
نضع مثلا رقم ( 3 ) وهذا یدلنا كم موقع نرید بالمصفوفة . ( a.length ) نضع
مثال :
a = newArry (4) ;
a = newArry (2,4,6) ;
a = newArra ( ) ;
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var i ;
var number=new Array() ;
for (i=0 ; i<4 ; i++)
{
number[i] = i ;
document.writeln(number[i] + "<br>");
}
</script>
</head>
<body></body>
</html>
٤٠
تحلیل هذا المثال اتركه لك .... ولكن سوف اضع لك ملاحظتین تسهل علیك تحلیله ...
. " ( نعني بها اننا نرید المصفوفة تحتوي على اربعة مواقع " تذكر اننا بدأنا من ( 0 ( i<4 ) •
نعني بها ان المصفوفة عرفناها في البدایة ولم نضع بها قیم . فهنا نضع بها القیم ( number[i] = i )•
أي كأننا نقول موقع الصفر ضع به ( 0 ) وموقع الواحد ضع به ( 1 ) وهكذا . أي :
اذا نحن هنا قمنا بتعبئة مواقع المصفوفة بقیم ومن ثم طبعناها .
عزیزي المتدرب نكون هنا قد انهینا الحدیث عن المصفوفات ذات البعد الواحد المسماة :
. (1D) " One Dimension Array "
إذا بقي علینا الشكل الاخر للمصفوفة وهي المصفوفة المسماة :
. (2D) " Tow Dimension Array "
لنأخذ مثالا ونوضح ماهي ...
Number [0] = 0
Number [1] = 1
Number [2] = 2
Number [3] = 3
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var arr = [ [1,3,5,7] , [3,3,3,3] , [9,1,4,0] ] ;
document.writeln("<h طباعة مصفوفة ثنائیةالأبعاد< 2 </h2><tt>");
for (i=0 ;i< arr.length;++i)
{
for (j=0 ;j< arr[i].length;++j)
document.writeln(arr[i] [j] + " ");
document.writeln("<br />");
}
document.writeln("</tt> ");
</script>
</head>
<body></body>
</html>
٤١
لنحلل المثال سویا ...
أخي المتدرب شرحي في هذا المثال سوف یكون طویلا وقد أثقل علیك من كثرة ما سوف تقرأ ولكن ذلك من
أجل إیصال المعلومة لك بالتفصیل إلى أبعد الحدود فأعذرني فكما هو شاق علیك بالقراءة هو شاق علي بالكتابة
والشرح .....
هنا قمنا بتعریف المصفوفة وكانت هذه المصفوفة تحتوي بداخلها على ثلاثة مصفوفات لا تنزعج من ذلك فقد
كنا نقول في الماضي ان المصفوفة تحتوي على ثلاثة عناصر وهنا نقول تحتوي المصفوفه على ثلاثة
مصفوفات أي عملیة تداخلیة . الان یجب أن نعرف شیئا ...
وهنا طبعا (rows & columns ) ( هذه المصفوفة التي بداخلها مصفوفات هي ( كم عامودا في كل صف
4 ) كیف عرفنا ذلك ؟ x مصفوفتنا هذه سوف تتكون من أربعة أعمدة وثلاثة صفوف . إذا أبعادها ( 3
لاحظ أن المصفوفة الرئیسیة كانت تحتوي على ثلاثة مصفوفات بداخلها إذا المصفوفة الرئیسیة تحتوي على
ثلاثة صفوف وكان كلا من هذه المصفوفات یحتوي على اربعة عناصر إذا المصفوفة الرئیسیة أیضا سوف
تتكون من أربعة أعمدة وهي عدد العناصر في المصفوفات التي بداخلها فقد كانت كل مصفوفة من هذه
المصفوفات تحتوي على قیم بداخلها وكانت كل واحده تتكون من اربعة مواقع اذا . ..
الذي ( <tt> ) ثم كتبنا أمر طباعة جملة نصیة والتي هي " طباعة مصفوفة ثنائیة الأبعاد " ووضعنا هذا الوسم
سوف أغلقه بعد الانتهاء كلیا من البرنامج فقط لكي یطبع لي البرنامج كل الارقام التي تحتویها المصفوفة بشكل
الآلة الطابعة وتستطیع ان لا تضعه .
قبل الدخول الى حلقة التكرار أنت تعلم جیدا ان حلقة التكرار في كل مرة ندخل بها داخلها یجب العودة لها أكثر
من مرة حتى یفشل الشرط فنخرج منها " أي عدم تحقق الشرط " فماذا لو كان لدینا حلقة تكرار بداخلها حلقة
تكرار أخرى في هذه الحالة ندخل في حلقة التكرار الاولى أي الرئیسیة فنجد بداخلها حلقة تكرار أخرى وهنا
سوف ندخل بداخل هذه الحلقة ونستمر بتنفیذ ما بداخلها والعودة لها حتى یفشل شرطها وبالتالي الخروج منها
والعودة الى حلقة التكرار الاولى كدورة ثانیة لها فندخل بداخلها فنجد حلقة التكرار الثانیة مرة أخرى فنستمر
بتنفیذ ما بداخلها أي التكرار حتى یفشل الشرط " أي عدم تحققه " .
ثم نخرج من هذه الحلقة ونعود الى الحلقة الرئیسیة مرة أخرى وهكذا حتى یفشل شرط حلقة التكرار الرئیسیة
وبالتالي عدم الدخول بداخلها وعدم الدخول بحلقة التكرار التي بداخلها " أي الحلقة الثانیة " وبالتالي الخروج
تماما .
الان لندخل بحلقة التكرار ببرنامجنا ونشرحها ولكن قبل ذلك دعنا نتفق على مسمیات مجازیة " إذا جاز التعبیر
" استخدمها فقط من أجل التوضیح لا أكثر :
٤٢
ب " حلقة التكرار الرئیسیة " : ( i ) نسمي حلقة التكرار الاولى التي ببرنامجنا المحتویة على المتغیر
ب " حلقة التكرار : ( j ) وحلقة التكرار الثانیة أي التي بداخل حلقة التكرار الاولى المحتویة على المتغیر
الداخلیة " .
لنبدأ .....
وجعلنا حلقة التكرار تبدأ من ( 0 ) الى ( i ) عرفنا هنا ببرنامجنا حلقة التكرار الرئیسیة وعرفنا بداخلها المتغیر
طول المصفوفة الرئیسیة التي تحتوي بداخلها على المصفوفات . وبما أن لدینا بداخلها ثلاثة مصفوفات إذا
ابتداءا من ( 0 ) طبعا . أي ( i < هي ( 3 ) أي الشرط سوف یكون ( 3 ( arr.length ) سوف تكون قیمة
ان هذه الحلقة سوف تستمر بالتكرار ثلاثة مرات " أي الدخول بداخلها وتنفیذ ما بداخلها ثلاثة مرات " .
في بدایة ( i ) فأنا هنا فقط بدلا من أن أعرف المتغیر ( var i ) لاتنزعج لاني وضعت داخل حلقة التكرار
البرنامجي عرفته بداخل حلقة التكرار . طبعا تستطیع ان تعرفه في بدایة البرنامج أو تعرفه داخل حلقة التكرار
كما تشاء " فقط أحببت أن اریك عدة طرق لتعریفه لیس عبثا ولكن من باب العلم بالشيء " .
( j ) هي ( 0 ) ثم دخلنا حلقة التكرار الداخلیة وعرفنا المتغیر ( i ) هنا دخلنا حلقة التكرار الرئیسیة وقیمة
( هي ( 0 ( i ) وبما ان قیمة . ( j<arr[i].length ) هو ( j ) وجعلناه یبدأ من ( 0 ) ووضعنا شرط ال
ماذا تعني هذه الجمله ؟ ( arr[0].length ) إذا الشرط سوف یكون
تعني ماذا یحتوي الموقع ( 0 ) في المصفوفة الرئیسیة وطبعا یحتوي على مصفوفة تحتوي بداخلها على أربعة
عناصر .. أي كأننا نقول بهذه الجملة " كم تحتوي المصفوفة على عناصر بداخلها في الموقع ( 0 ) من
المصفوفة الرئیسیة " ...
تعني ( 4 ) إذا الشرط هو ( arr[0].length ) وبما أنها تحتوي على أربعة عناصر ، إذا هنا ترجمة
إذا سوف ننفذ ما بداخل الحلقة الداخلیة أربعة مرات إبتداءا من ( 0 ) وانتهاءا ب ( 3 ) وسنبقى ( j<4 )
مستمرین ولن نخرج منها حتى ننتهي " أي عدم تحقق الشرط " . فإذا حصل ذلك نخرج منها ونعود مرة أخرى
الى حلقة التكرار الرئیسیة . إذا لندخل بداخلها ...
( arr[i][j] ) تساوي ( 0 ) وهو أقل من ( 4 ) فعلا . فننتقل الى أمر الطباعة وبداخله ( j ) فقیمة
لنحللها سویا ...
نعني بذلك الموقع ( 0 ) في ( arr[0][ ایضا ( 0 ) إذا ( [ 0 ( j ) لدینا هي ( 0 ) وال ( i ) الان قیمة
عادة بالمصفوفة الرئیسیة أي التي تضم بداخلها على ( i ) المصفوفة والموقع ( 0 ) في المصفوفة الداخلیة فال
فهي خاصة بالمصفوفة الداخلیة أي الموجودة بداخل المصفوفة الرئیسیة . إذا توصلنا ( j ) ثلاثة مصفوفات أما
لنتیجة ...
أن حلقة التكرار الرئیسیة هي خاصة بالمصفوفة الرئیسیة ومواقعها .
وحلقة التكرار الداخلیة خاصة بالمصفوفات الداخلیة ومواقعها " أي المصفوفات التي بداخل المصفوفة الرئیسیة
. "
اذا یجب الذهاب الى الموقع ( 0 ) في المصفوفة الرئیسیة والموقع ( 0 ) في ( arr[0][ الان لدینا ( [ 0
المصفوفة الداخلیة الموجودة في الموقع ( 0) في المصفوفة الرئیسیة فهنا یطبع الرقم ( 1 ) فنعود مرة أخرى
أصبحت ( 1 ) " أي بعد الزیادة " فیسألنا الشرط هل ( 1 ) أقل من ( j ) الى حلقة التكرار الداخلیة وقیمة
أي هل ( 1 ) أقل من ( 0 ) طبعا یتحقق الشرط اذا سوف یدخل الى الحلقة فیطبع ( arr[0].length )
وتعني ذلك اطبع ما یحویه الموقع ( 0 ) من المصفوفة الرئیسیة والموقع ( 1 ) في المصفوفة ( arr[0][1] )
( j ) الداخلیة وبالتالي سوف یطبع الرقم ( 3 ) وبعد ذلك یعود مرة أخرى الى الحلقة الداخلیة وتكون قیمة
( والتي تعني الموقع ( 0 ( arr[0][ أصبحت ( 2 ) فیتحقق الشرط لان ( 2 ) أقل من ( 4 ) فیطبع قیمة ( [ 2
من المصفوفة الرئیسیة والموقع ( 3 ) في المصفوفة الداخلیة ، فیرجع مرة أخرى الى حلقة التكرار الداخلیة وقد
والتي ( arr[0][ تساوي ( 3 ) بعد الزیادة فیتحقق الشرط فندخل الحلقة فیطبع قیمة ( [ 3 ( j ) أصبحت
تعني ..
٤٣
الموقع ( 0 ) من المصفوفة الرئیسیة والموقع ( 3 ) من المصفوفة الداخلیة . أي أنه سیطبع الرقم ( 5 ) . فنعود
أصبحت ( 4 ) بعد الزیادة فیفشل الشرط لان ( 4 ) لیست أقل ( j ) مرة أخرى الى الحلقة الداخلیة وتكون قیمة
أي البدء بسطر جدید ... ونعود ( <br /> ) من ( 4 ) . فنخرج من الحلقة الداخلیة ونذهب الى أمر طباعة
هي ( 1 ) " أي بعد الزیادة فقد كانت ( 0 ) وبعد الانتهاء من ( i ) لحلقة التكرار الرئیسیة ، فتصبح قیمة
أي هل هي ( arr.length ) الدورة الاولى أصبحت ( 1 ) . فنفحصالشرط الذي هو " هل ( 1 ) أقل من
تساوي ( 0 ) ونفحصالشرط والذي ( j ) أصغر من ( 3 ) ... فیتحقق وندخل الى داخل الحلقة الداخلیة فنبدأ ب
وتعني طول الموقع ( 1 ) في ( arr[1].length ) والذي هو ( arr[i].length ) أقل من ( j ) هو هل
المصفوفة الرئیسیة وبالتالي فهو ( 4 ) لان الموقع رقم ( 1 ) في المصفوفة الرئیسیة یحتوي على مصفوفة
أي قیمة ( arr[1][ 0 ) فندخل بداخل الحلقة فنطبع قیمة ( [ 0 < بداخلها أربعة عناصر . فیصبح الشرط ( 4
( الموقع رقم ( 1 ) في المصفوفة الرئیسیة والموقع رقم ( 0 ) في المصفوفة الداخلیة أي سوف یطبع الرقم ( 7
قیمتها ( 1 ) " أي بعد الزیادة " فیتحقق الشرط ( j ) ثم نعود مرة أخرى الى حلقة التكرار الداخلیة وتصبح
والتي تعني الموقع رقم ( 1 ) في المصفوفة الرئیسیة والموقع ( arr[1][ فندخل بحلقة التكرار فنطبع قیمة ( [ 1
رقم ( 1 ) في المصفوفة الداخلیة والذي هو ( 9 ) ونعود مرة أخرى الى حلقة التكرار الداخلیة بعد أن اصبحت
والتي هي ( 11 ) فنعود مرة أخرى الى ( arr[1][ هي ( 2 ) فیتحقق الشرط فنطبع قیمة ( [ 2 ( j ) قیمة
والتي هي ( arr[1][ تساوي ( 3 ) فیتحقق الشرط وندخل بداخلها فیطبع ( [ 3 ( j ) الحلقة الداخلیة لتصبح قیمة
قیمتها ( 4 ) فلا یتحقق الشرط " أي یفشل " ( j ) 13 ) فنعود مرة أخرى لحلقة التكرار الداخلیة لتصبح )
أي البدء بسطر جدید ، ثم نعود مرة أخرى الى الحلقة ( <br / > ) فنخرج من الحلقة الداخلیة ونذهب الى أمر
هي ( 2 ) فیتحقق الشرط فندخل بداخل حلقة التكرار فنذهب الى حلقة التكرار ( i ) الرئیسیة لتصبح قیمة
فیتحقق الشرط لدینا فندخل الى ( j < Arr[2].length ) تساوي ( 0 ) ویصبح الشرط ( j ) الداخلیة فنبدأ ب
ثابتة ( i ) والتى هي ( 15 ) وهكذا تستمر مع بقاء قیمة ( Arr[2][ حلقة التكرار الداخلیة فنطبع قیمة ( [ 0
التى تزید بأستمرار حتى یفشل الشرط فنخرج من حلقة التكرار الداخلیة فنذهب ( j ) والتى هي ( 2 ) وقیمة
قیمتها ( 3 ) " أي ( i ) أي البدء في سطر جدید ثم نعود الى حلقة التكرار الرئیسیة لتصبح ( <br /> ) للأمر
بعد الزیادة " فیفشل الشرط فال ( 3 ) لیست أقل من ( 3 ) وبالتالي عدم الدخول لتنفیذ مابداخل حلقة التكرار
الرئسیسة " أي بمعنى أننا لن ندخل الى حلقة التكرار الداخلیة " إذا هنا نكون قد إنتهینا من الطباعة في حلقات
التكرار المتداخلة والصعبة بصراحة . . .
وهكذا نكون قد أنهینا البرنامج الشاق علینا ( </tt> ) وبعد خروجنا من حلقة التكرار الرئیسیة نغلق الوسم
وعلیك . .
مثال:
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var arr = [ [2,4] ,
[6] ,
[8,10,12] ] ;
for (i=0 ; i< arr.length ; ++i)
{
for (j=0 ; j< arr[i].length ; ++j)
document.writeln( arr[i] [j] + " " );
document.writeln( "<br />" );
}
</script>
</head>
<body></body>
</html>
٤٤
تحلیل هذا المثال نتركه لك . . وإذا لم تستطع تحلیله جیدا فلا تتردد في مراسلتي لمساعدتك . .
ملاحظة :
هنا تستطیع أستخدام أي شكل لحلقة التكرار في المصفوفة ولكن أنا أفضل أن تستخدم الشكل الأول . والذي
أستخدمه في برامجنا السابقة . فهو أكثر وضوحا لك ولكن هذا رأیي الشخصي ولیس بالضرورة أن تعمل به
فالامر متروك لك .
for (i=0 ; i< أسم المصفوفة .length ; ++i )
تكافئ
for (var i in ( أسم المصفوفة
-----------------------------------------------------------------------------
for ( var j=0 ; j< أسم المصفوفة الرئیسیة [i]. length ; ++j )
تكافئ
for ( var j in أسم المصفوفة الرئیسیة [i] )
٤٥
: Math Object
وهي كائنات او طرق اذا جاز التعبیر تقوم بالعملیات الحسابیة .. وطریقة استدعائعا او تطبیقها تكون على
الصیغة التالیة :
ثم بین قوسین یوضع ما هو مراد حسابه ( 0 ) .. واسم ( dot ) ثم نقطة ( Object ) اول شيء ذكر اسم ال
اي الطرق " mathematical calculation " من عبارة ( Math ) هنا هو ( Object ) ال
الحسابیة " اذا جاز التعبیر " اذا الصیغة العامه هنا هي :
مثال :
هنا كاننا نقول نرید الجذر التربیعي للعدد ( 9 ) اذا الجواب سوف یكون ( 3 ) وهذا ما سوف یخرجه لنا
الصیغة السابقة
ملاحظة :
اما ( capital letter ) یاتي بال ( M ) یجب هنا الالتزام بالحروف من كبیره وصغیره فركز حرف ال
( Math ) .... ( small letter ) البقیة تأتي في
الطریقة الوصف مثال
abs(7.2) = 7.2
abs(0.0) = 0.0
abs(-5.6) = 5.6
(x) القیمة المطلقة ل abs(x)
ceil(9.2) = 10.0
ceil(-9. = -9.0
التقریب لأكبر عدد حقیقي ceil(x)
cos(0.0) = 1.0 (x) جیب التمام (جتا) ل cos(x)
exp(1.0) = 2.71828
exp(2.0) = 7.38906
(ex) طریقة الأس exp (x)
floor (9.2) = 9.0
floor (-9. = -10.0
التقریب لأصغر عدد حقیقي floor (x)
log (2.718282) = 1.0
log (7.389056) = 2.0
(x) لوغارثم log (x)
max (2.3,9.7) = 9.7
max (-2.3,-9.7) = -2.3
(y) و (x) أكبر قیمة من max (x,y)
min (2.3,9.7) = 2.3
min (-2.3,-9.7) = -9.7
(y) و (x) أصغر قیمة من min (x,y)
pow(2.0,7.0) = 128.0
pow(9.0,0.5) = 3.0
(xy) تعني (y) مرفوع للأس (x) pow(x,y)
round(9.7) = 10
round(9.25) = 9
لأقرب عدد حقیقي (x) تقریب round(x)
sin(0.0) = 0.0 (x) جیب (جا ) ل sin(x)
sqrt(900.0) = 30.0
sqrt(9.0) = 3.0
(x) الجذر التربیعي ل sqrt(x)
tan(0.0) = 0.0 (x) قتا tan(x)
Math . ( الرقم او المتغیر) اسم العملیة الحسابیة
Math.sqrt(9)
٤٦
مثال :
في البرنامج الجافا سكربت .. ( Math Object ) بشكل عام هكذا تكتب ال
بمفرده في جملة ( <br /> ) فجملة الطباعة الاولى سوف تطبع الجذر التربیعي للعدد ( 9 ) ثم وضعت ال
طباعة لكي لا یختلط علیك الامر وذلك لكي ننزل سطرا جدیدا ثم تاتي جملة الطباعة الثالثة تطبع لنا الرقم
الاكبر بین الرقمین الذین وضعناهما ثم وضعنا جملة الطباعة الثالثة والتي هي نزول سطر جدید " بدایة سطر
جدید " ثم وضعنا جملة الطباعة الرابعة والتي سوف تطبع لنا جیب الرقم واحد ...
ملاحظة :
لو اردت ان تعمل مقارنه بین ثلاثة ارقام والخروج بالاكبر وقتها تكتب هكذا :
Math.max(Math.max(4,5), 6)
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
document.write(Math.sqrt(9));
document.write("<br />");
document.write(Math.max(10,2));
document.write("<br />");
document.write(Math.sin(1.0));
</script>
</head>
<body></body>
</html>
نخرج الاكبر من هنا
ویكون رقم ٥
١
نقارن بین
الرقمین ٥ و ٦
٢
الخطوة الاولى
الخطوة الثانیة
٤٧
( الذي في الداخل اي بین الرقمین ( 4 و 5 ( Math Object ) هنا كاننا نقول اخرج الرقم الاكبر في ال
الذي في الخارج وهو سوف یكون بین الرقمین ( 5 ) الذي خرج من ال ( Math Object ) ومن ثم طبق ال
في الخارج اي ( Math Object ) التي في الداخل وبین الرقم ( 6 ) الذي في ال ( Math Object )
الرئیسیة ..
- اذا اردنا ان نخرج الرقم الاكبر بین اربعة ارقام تكتب الصیغة هكذا :
- اي هنا ناخذ كل عملیة على حدى وكانها لوحدها ...
Math.max(Math.max(4,5),Math.max(11,20))
تمارین إضافیة على الدوال الریاضیة :
الثابت الوصف القیمة
قیمة ثابتة تقریبا تساوي 2.718 Math.E
اللوغاریثم الطبیعي ل ( 2) تقریبا تساوي 0.693 Math.LN2
اللوغاریثم لطبیعي ل ( 10 ) تقریبا تساوي 2.302 Math.LN10
تقریبا تساوي 1.442 Math.LOG2E
تقریبا تساوي 0.434 Math.LOG10E
تقریبا تساوي 3.141592653589793 Math.PI
تقریبا تساوي 0.707 Math.SQRT1_2
الجذر التربیعي ل ( 2.0 ) تقریبا تساوي 1.414 Math.SQRT2
: Methods of the String Object
الطریقة الوصف
(index) یرجع الحرف المحدد بال charAt(index)
(index) یرجع شیفرة الحرف المحدد بال charCodeAt(index)
المحدد قبل الامر (string) یدمج النص المحدد في ال
الذي (string) مع النص المحدد في ال (concat)
(concat) بین القوسین اي الذي بعد
concat(string)
یحول الارقام المحددة بین الاقواس الى قیمتها الحرفیة fromCharCode(value1,value2
,…)
من بعد (substring) البحث عن النص المحددة في
من النص المحدد في ال (index) الموقع رقم
المحدد قبل الأمر. (string)
ویرجع أول موقع یحتوي على أول حرف من النص
(string) من ال (substring) المحدد في
indexOf(substring,index)
من قبل (substring) البحث عن النص المحددة في
من النص المحدد في ال (index) الموقع رقم
lastIndexOf(substring, index)
٣
١
٢
٥
٢٠
ناتج العملیة ٢٠
رقم ١
ناتج العملیة
رقم ٣
ناتج العملیة
رقم ٢
٤٨
المحدد قبل الأمر. (string)
ویرجع أول موقع یحتوي على أول حرف من النص
(string) من ال (substring) المحدد في
من ال (end) الى (start) یرجع النص من الموقع
المحدد قبل الأمر (string)
slice(start,end)
الى مجموعة (string) تقسیم النص المحدد في
كلمات نحن نحدد كیفیتها .
split(string)
وعدد أحرفه (start) یرجع النص المحدد من الموقع
المحدد قبل الأمر . (string) من ال (length) substr(start,length)
الى الموقع (start) یرجع النص المحدد من الموقع
(end)
substring(start,end)
المحدد قبل الأمر الى حروف (string) یحول ال
انجلیزیة صغیرة .
toLowerCase()
المحدد قبل الأمر الى حروف (string) یحول ال
انجلیزیة كبیرة .
toUpperCase()
(string) یرجع نفس ال النص المحدد في ال toString()
(string) یرجع نفس ال النص المحدد في ال valueOf()
(<a> name </a>) یعمل عمل anchor(name)
(<blink>…</blink> ) یعمل عمل blink()
أي الكتابة على شكل آلة (<tt>…</tt>) یعمل عمل
طابعة
fixed()
(<a>…</a>) یعمل عمل link(url)
أي یضع خط (<strick>…</strick >) یعمل عمل
في وسط الكلام
strike()
أي الكتابة تحت (<sub>…</sub>) یعمل عمل
السطر
sub()
أي الكتابة فوق (<sup> … </sup>) یعمل عمل
السطر
sup()
مثال :
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var a ="samialr";
document.write("<p> اطبع الحرف الموجود في الموقع صفر " + a.charAt(0) );
</script>
</head>
<body></body>
</html>
٤٩
خاصه بالوقت والتاریخ : Date Object
وهي كائنات خاصه بالوقت اي تقوم بعملیات ذات علاقه بالوقت من جلب ووضع .
طریقة تعریفه :
var a = new Date( )
الطریقة الوصف
یعود بالارقام من ١ الى ٣١ حسب الیوم getDate()
یعود بالارقام من ١ الى ٣١ حسب الیوم getUTCDate()
یعود بالارقام من 0 " الأحد " الى 6 " السبت " getDay()
یعود بالارقام من 0 " الأحد " الى 6 " السبت " getUTCDay()
یعود بالسنة من أربعة أرقام getFullYear()
یعود بالسنة من أربعة أرقام getUTCFullYear()
یعود بالساعة من 0 الى 23 getHours()
یعود بالساعة من 0 الى 23 getUTSHours()
یعود بالمیلي ثانیة من 0 الى 999 getMilliseconds()
یعود بالمیلي ثانیة من 0 الى 999 getUTCMilliSecond()
یعود بالدقیقة من 0 الى 59 getMinutes()
یعود بالدقیقة من 0 الى 59 getUTCMinutes()
یعود بالشهر من 0 "ینایر" الى 11 " دیسمبر" getMonth()
یعود بالشهر من 0 "ینایر" الى 11 " دیسمبر" getUTCMonth()
یعود بالثانیة من 0 الى 59 getSeconds()
یعود بالثانیة من 0 الى 59 getUTCSeconds()
سوف نشرح بعض منها اثناء المثال وهذا لكي تصلك بشكل افضل وما یطبق على البعض یطبق على
البقیة ..
setDate(val)
setUTCDate(val)
setFullYear(y,m,d)
setUTCFullYear(y,m,d)
setHours(h,m,s,ms)
setUTCHours(h,m,s,ms)
٥٠
setMilliSeconds(ms)
setUTCMilliSeconds(ms)
setMinutes(m,s,ms)
setUTCMinutes(m,s,ms)
setMonth(m,d)
setUTCMonth(m,d)
setSeconds(s,ms)
setUTCSeconds(s,ms)
setTime(ms)
یعود بالوقت والتاریخ بالتفصیل toLocaleString()
یعود بالوقت والتاریخ بالتفصیل toUTCString()
لنتعرف كیف نتعامل مع ماذكرناه في الجدول :
. ( string ) ولكن قبل ذلك لنأخذ فكرة سریعة عن ماهو المتغیر النصي التالي
صیغته :
ونضع بداخله نص ولكي تخبر ان هذا نص نضعهبین ( " ) . ( a ) أي تعرف متغیر
ملاحظات على هذا المتغیر :
١- أي شي یسند للمتغیر ویكون بین ( " ) سوف نأخذه على أساس أنه نصحتى لو كان رقم .
مثال :
هذا لانأخذه كقیمة رقمیة إطلاقا بل نصلیس له قیمة رقمیة .
مثال آخر :
هذا عبارة عن نص كیف عرفنا ذلك لان الرقم جاء بین ( " ) حتى الاحرف .
تعتبر نصوأیضا الفراغ یعتبر حرف إذا جاز التعبیر . ( string ) ٢- العلامات او الرموز إذا جائت في ال
مثال :
هو موقع السادس إبتدائا من ( Memory ) هذى المسافة تعتبر حرف (" @) أي أنها تأخذ موقع في ال
الصفر .
إذا لننتقل الأن الى كیفیة التعامل مع ماذكرناه بالجدول .
var a = " thamer " ;
var a = " 123 " ;
var a = "ab12 " ;
var a = "ab c12@ " ;
٥١
صیغة كتابتها :
( string ) بما أننا نتحدث عن طرق تطبق على الكائنات النصیة إذا یجب أن نكون لدینا متغیر نصي أي
لنجري علیه مانرید من الطرق سالفة الذكر في الجدول إذا :
.( string ) ١- نعرف أول شي متغیر نصي
كیف ذلك : ( Methods ) ٢- الأ ن نطبق علیه ال
هنا تكون الصیغة التى ترید أن تطبقها على النص .
مثال :
.( string ) ( ذكر الفهرس أو المتغیر أو النص أو القیمة ) أسم الطریقة . أسم المتغیر النصي
لنأخذ شكلان ونرى :
١- نعرف متغیر نصي
( Methods of the string object ) ٢- نضیف ال
بطول ( 4 ) أي أطبع ( a ) أخبرناه أننا نرید أن یطبع لنا أحرف من الموقع صفر من المتغیر النصي
.( Java ) الحروف في الموقع ( 0 و 1 و 2 و 3 ) إذا سوف یطبع خمسة أحرف... وهي
لنأخذ الشكل الاخر الان : •
١- نعرف متغیر نصي
( Methods of the string object ) ٢- نضیف ال
ولكن بعد تحویل احرفها الى الأحرف الانجلیزیة ( javascript ) وفي هذه الحالة سوف یطبع لنا كلمة
( JAVASCRIPT ) الكبیره اذا سوف تظهر لنا بعد طباعتها بالشكل التالي
قیمة بداخل القوسین عزیزي المتدرب في البدایة أخبرتك ( toUpperCase ) قد تتسائل لماذ لم نضع بعد
أنك تضع إذا تطلب ذلك .. ولكن یوجد طرق لایستلزم وجود قیمة أي علیك الالتزام بالجدول.. منها مثلا :
نرید فقط أن نجعل النص یبدو بالحروف الكبیرة إذا كل الذي علینا ذكره أسم المتغیر النصي ونقطة ثم كلمة
( a ) إذا في المثال السابق بما أننا نرید أن نقول أننا نرید أن نجعل المتغیر النصي ( toUpperCase )
یطبع ولكن لیس بكل أحرفه بل ترید أن یطبع لنا أربع أحرف بدایة من الموقع صفر إذا هنا نحن بحاجة الى أسم
var a = " Javascript " ;
var a = "Javascript " ;
a . substring(0,4)
var a = "Javascript " ;
a . toUpperCase(0,4)
٥٢
المتغیر النصي وثاني شي من أي موقع یبدأ العد إذا هنا یجب أن نذكر صفر ثم یجب أن نكتب كم طول الذي
نریده من الموقع صفر إذا هنا نذكر ( 4 ) أي أربع خطوات بدایة من الصفر .
في هذا المثال لن نحتاج لنشرحه لك لان شرح كل امر او خطوه موجود داخل جملة الطباعة ما علیك سوى
قراءة المثال وتطبیقه وفهم ما تحتویه جمل الطباعة من اوامر وشرح .
أي كائنالتاریخ والوقت إذا جاز التعبیر . هنا تخصص الكائن ( Date object ) كیفیة التعامل مع •
ووضع في متغیر معین ومن ثم تطبیقه على المتصفح بخاصیة أو بطریقة من الخواص التي ( Date )
ذكرناه في الجدول،
إذا كیفیة كتابتها : •
بهذا الشكل : ( Date ) ١- نعرف متغیر نضع به الكائن
٢- نطبق مانریده من الخواص أو الطرق المذكوره في الجدول على هذا المتغیر الذي وضعناه .
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var a = " samialr ";
var b = " name ";
document.writeln("<p> سوف یطبع الحرف الذي في الموقع صفر " + a.charAt (0));
document.writeln("<p> سوف یطبع الكلمة التي في المتغیر بأحرف كبیرة " + a.toUpperCase () );
document.writeln("<p> دمج المتغیرین النصیین لیصبح نص واحد " + b.concat (a) );
</script>
</head>
<body></body>
</html>
var d = new Date();
d.getDay() +1
إسم المتغیر الذي خصصنا له
Date الكائن
الخاصیة المطلوب تطبیقها - وهنا نرید ان یطبع لنا الیوم
الذي سوف یطبعه لنا بالأرقام
٥٣
ملاحظة :
وضعنا ( + 1 ) لانه یطبع لنا الیوم من ٠ الى ٦ ولكننا نریده من ١ الى ٧
( getMonth() ) او ( getDate() ) مثل ( get ) ولكن الذي طبقنا علیه اي الكائن هو الخاصبالطرق
وهكذا ...
الخ ... ( setMonth(m,d) ) او ( setDate(value) ) مثل ( set ) ولكن ماذا عن
( getMonth ) وهكذا إذا هنا قد نحتاج ان نخبر المتصفح بان یحضر لنا الشهر من الجهاز ویطبعه لنا مثل
كأننا نقول أحضر الشهر من الجهاز ( get ) هذا یعني أن نقول للمتصفح أطبع لنا الشهر بعبارة أخرى
الحاسوب وأطبعه لنا .
أما لو أردنا نحن أن نضع الشهر الذي نریده ولیس الموجود بجهاز الحاسوب عندها نكتب
نضع بداخلها قیمتین كما عرفناها ( setMonth(m,d) ) وخاصیة أو طریقة ( setMonth(2,1) )
وتعني لنا الیوم مثل لو وضعنا ( d ) وتعني قیمة رقم الشهر المطلوب وقیمة ل ( m ) في الجدول ... قیمة ل
1 ) نعني به یوم الأحد وشریطة أن نضع ( + 1 ) الخاصیة لاننا ذكرنا سابقا أنه دائما في الكائن أو التاریخ )
كنا نقول أحضر كذا ( get ) یبدأ من الصفر و الصفر هو الذي یمثل یوم الاحد . إذا لاحظت أنه عندما نكتب
كأننا نقول ضع كذا وكذا ولكن كما نحدده لك نحن ولیس كما هو ( set ) وأطبعه كما هو وعندما نقول
موجود في الجهاز او الواقع الافتراضي .
ملاحظات :
١- دائما كل الخواص أو الطرق تبدأ من الصفر مثلا :
یمثل یوم الثلاثاء ، وهكذا ونفس الشي مع یمثل یوم الاثنین ، 2 یمثل یوم الاحد ، 1 0
الاشهر.
٢- هنا یطبع لنا دائما الأرقام التي تمثل الاشهر والایام وإذا أردنا أن یطبعها لنا كأسماء نضع الارقام في
ونجعله یطبعها لنا كأسماء وسوف نأخذ مثال ونرى لاحقا . ( switch )
<html>
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var d = new Date() ;
document.writeln("<p> طباعة رقم الیوم من الشهر <p>" + d.getDate());
document.writeln("<p> طباعة رقم الشهر <p>" + d.getMonth());
document.writeln("<p> طباعة السنة لنا بأربع أرقام <p>" + d.getFullYear());
</script>
</head>
<body></body>
</html>
أقصد بها قیمة انت تحددها
لتمثل الیوم
أقصد بها القیمة التي
سوف تحددها انت لتمثل
الشهرpar ٥٤
لنأخذ مثالا أخر ونحلله :
<html >
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var c = new Date (2004 , 9 ,29 , 1 , 7, 0 );
document.writeln("<b>Date :</b> + " c + "<br>");
c.setDate(11);
c.setMonth(9);
c.setHours(23);
c.setFullYear(2003);
c.setMinutes(50);
c.setSeconds(55);
document.writeln("<b>Dtae : </b>" + c);
</script>
</head>
<body></body>
</html>
٥٥
لنحلل المثال سویا ونرى :
إذا جاز التعبیر أي Array بشكل ( Date ) ووضعنا بداخله الكائن ( c ) أول شي عرفنا متغیر هو المتغیر
أننا وضعنا بداخله قیم سوف تسند إلى أمور خاصة بالتاریخ والوقت .
وبهذا نكون عبرنا عن السنة بالقیمة الاولى وهي 2004 وعبرنا عن الشهر بالقیمة الثانیة وهي 9 وعن الیوم
بالقیمة الثالثة وهي 29 وعن الساعة بالقیمة الرابعة وهي 1 وعن الدقیقة بالقیمة الخامسة وهي 7 وعن الثواني
بالقیمة السادسة وهي 0 . إذا هنا سوف بتعرف على القیم هكذا : سنة , شهر , یوم , ساعة , دقیقة , ثانیة .
ثم كتبنا جملة الطباعة :
أي بما یحتویه… ومنها سوف یطبع لنا التاریخ والوقت الذي حددناه في بدایة ( c ) وبها نكون قد طبعنا المتغیر
ولكن لنقل أننا أردنا أن نغیر القیم التي عرفناها في بدایة برنامجنا للمتغیر .( c ) برنامجنا عند تعریفنا للمتغیر
أي الوقت والتاریخ .لنرى كیف : ( c )
الى هذه القیم التى ذكرناها وهو سوف یغیرها ( c ) بهذه الطریقة نكون كأننا غیرنا كل قیمة في المتغیر
وبجانبها الشي الذي نرید تغیره سواءا یوم ( set ) مباشرتا فلا علیك سوي كتابة أسم المتغیر ثم نقطة ثم
وهكذا . ثم الان كتبنا جملة الطباعة وأخبرنا البرنامج أن یطبع هنا المتغیر ( FullYear ) أو سنة ( Date )
مرة أخرى. ( c )
ولكن هنا سوف یطبع المتغیر الذى سوف یعبر لنا عن التاریخ والوقت بالقیم الجدیدة التي حددناها قبلها .
- عزیزي المتدرب لقد وضعت لك في هذا البرنامج شكلین لتحدید الوقت والتاریخ بنفسك واحدة محددة من بدایة
برنامجنا من خلال تعریفنا للمتغیر والثانیة عندما أردنا تغییر القیم التى یحتویها المتغیر وهذا لكي تعم الفائدة
وتعرف أبعاد الخاصیة .
عند إستخدامها في التاریخ والوفت تحدد لنا القیم نفسها من ( get ) إذا في النهایة نستنتج شي واحد وهو أن
نحن من نحدد ونضعهما یدویا. ( set ) الجهاز أما ال
newDate (2004 , 9 , 29 , 1 , 7, 0 );
document.writeln("<b>Date : </b>" + C);
c.setDate(11);
c.setMonth(9);
c.setHours(23);
c.setFullYear(2003);
c.setMinuites(50);
c.setSeconds(55);
document.writeln("<b>Dtae : </b>" + c);
٥٦
مثال لنرى كیفیة تحویل أرقام الایام الى اسم الیوم كتابتا :
<html dir="rtl">
<head><title> الجافا سكربت </title>
<script type = "text/javascript">
var d = new Date() ;
switch( d.getDay()+1 )
{
case 1 :
document.writeln(" ;(" یوم الأحد
break ;
case 2 :
document.writeln(" ;(" یوم الأثنین
break ;
case 3 :
document.writeln(" ;(" یوم الثلاثاء
break ;
case 4 :
document.writeln(" ;(" یوم الأربعاء
break ;
case 5 :
document.writeln(" ;(" یوم الخمیس
break ;
case 6 :
document.writeln(" ;(" یوم الجمعة
break ;
case 7 :
document.writeln(" ;(" یوم السبت
break ;
}
</script>
</head>
<body></body>
</html>
٥٧
سابقا في الدرس الخاص به ولكن سوف ( switch ) المثال لا یحتاج الى تحلیل وذلك لاننا قمنا بشرح ال
اضع بعضالنقاط الرئیسیة التي بها تلخیصلشرح هذا البرنامج .
بهذا الشكل : ( Date ) - عرفنا متغیر ووضعنا به الكائن
وبعد ذلك ( switch( d.getDay()+ كود جلب الیومبالارقام ( ( 1 ( switch ) - وضعنا بداخل ال
الى جمل الطباعة لكي یطبع لنا الیوم باللغة العربیة ( switch ) سوف یقارن الرقم الذي سوف یسند الى ال
اي باحرف اللغة العربیة وكان بإمكاننا ان نعرف متغیر من ثم نسند له كود جلب الیوم بالارقام ومن ثم نضع
بهذه الطریقة ( switch ) هذا المتغیر في ال
. ( switch ) ولكنني اختصرت الطریق ووضعت كود جلب الیوم مباشرة في ال
var d = new Date();
var d = new Date();
var n = d.gateDay();
switch ( n )
{
58
معلومات تطبیقیة :
( forms ) نأتي هنا الى ذكر آخرموضوعین في الكتاب وهما كیفیة التعامل بالجافا سكربت مع النماذج
لكي لا أطیل علیك عزیزي المستخدم فأنا أعلم أن ( status ) والشيء الآخر هو ظهور الكتابة ضمن شریط
الكتاب أثقل علیك من كثر مایحتوي على شرح ولهذا سوف أذكر مثال ونحلله مباشرة فكل شيء یفهم من
خلال التطبیق ..
مثال :
وهو تعبئة نموذج من قبل المستخدم وبعد التعبئة یضغط على أیقونة موافق فیطبع بیاناته في صفحة الأنترنت
<html dir="rtl">
<head><title> java script </title>
<script type="text/javascript">
function information()
{
var name=info.name.value;
var job=info.job.value;
var add=info.address.value;
var comm=info.command.value;
document.writeln("<table cellspasing=\"0\"
cellpadding=\"5\" border=\"1\" width=\"80%\"
align=\"center\" dir=\"rtl\" bgcolor=\"#eaeaea\"
bordercolor=\"#000000\">");
document.writeln("<caption><h3>
المعلومات التي سجلتها لدینا </h3></caption>");
document.writeln("<tbody>");
document.writeln("<tr><td width=\"30\"><b> : الأسم
</b></td><td>" + name + "</td></tr>");
document.writeln("<tr><td width=\"30\"><b> المهنة
:</b></td><td> " + job + "</td></tr>");
document.writeln("<tr><td width=\"30\">
<b> العنوان :</b></td><td> " + add + "</td></tr>");
document.writeln("<tr><td width=\"30\">
<b> ملاحظات :</b></td><td> " + comm + "</td></tr>");
document.writeln("</tbody>");
document.writeln("</table>");
}
</script>
</head>
<body >
<form name="info" action="">
<table cellspacing="0" cellpadding="5" border="0" width="80%" align="center">
<tbody>
<tr>
<td> الأسم : </td>
<td><input type="text" name="name" value="" size="31"></td>
</tr>
<tr>
<td> العنوان :</td>
<td> <input type="text" name="address" value="" size="45"></td>
</tr>
<tr>
<td> المهنة :</td>
<td><input type="text" name="job" value="" size="20"></td>
</tr>
<tr>
<td> ملاحظات :</td>
<td><textarea name="command" rows="4" cols="50"></textarea></td>
</tr>
<tr>
<td colspan="2" align="center">
</br>
<input type="button" name="show" value=" "اعرض
onclick="information()"><input type="reset" name="del" value=" < "مسح
</td>
</tr>
</tbody> </table></body></html>
٥٨
59
عزیزي المتدرب لا تنزعج من طول الكود فالكود لیس بطوله بل بأوامره المستخدمه وتكنیكه ومن هنا لا ارید
ان احلل الكود لانه لا یحتاج تحلیل فلا علیك من رهبة كثرته وطوله ومن هنا سوف اشرح لك الامور التي بها
اختصارالشرح بالكود ..
اولا هذا الكود لیس به امور كثیره او اوامر كثیرا بل هو بسیط الى ابعد الحدود لننظر كیف ذلك :
لقد عرفت المتغیرات بالشكل التالي :
هنا سوف اتجاوز بشرحي قلیلا عن النمط البرمجي البحت لكي تصل المعلومه اكثر اذا سمحت لي ..
var name=info.name.value ;
var job=info.job.value ;
var add=info.address.value ;
٥٩
60
( add ) و ( job ) و ( name ) هنا عرفنا المتغیرات بالشكل الذي نعرفه مثل
ویكون هو عباره عن ( a ) وتذكر أخي المتدرب اننا كنا نعرف في الماضي... اي في المصفوفات متغیر مثلا
مصفوفه وكانت تكتب بشكل التالي :
ومنها كنا نعرف ان هذا المتغیر هو عباره عن مصفوفه ..
هو عباره عن قیمه سوف یدخلها المستخدم في النموذج ( ( name ) وهنا نفس الشيء قلنا مثلا المتغیر
بهذا ( name ) هو عباره عن مصفوفه .. لهذا كتبنا المتغیر ( a ) كما كنا نقول ان هذا المتغیر ( form
الشكل :
هو عباره عن قیمه سوف تكون مدخله من قبل المستخدم في حقل من ( name ) اي هنا نقول ان المتغیر
لكي تخزن بداخلها .. ( name ) والذي یحمل اسم ( form ) حقول النموذج اي ال
اذا هنا نأتي للتساؤلك عزیزي المتدرب ... ماذا یعني الكود التالي :
لنفسرها سویا :
( form ) ونعني بها اسم النموذج الذي سوف یدخل به المستخدم القیمه والذي یكتب في ال ( info )
النصیه یجب ان یحمل النموذج اسم اذا هنا یجب ان نضع نفس الاسم الذي ( html ) فكما تعرف في لغة
وهذا لكي نخبر ان هذا المتغیر متعلق بذلك النموذج .. ( name ) حددناه ..للمتغیر
ونعني بها الاسم الذي سوف نضعه بالحقل الذي سوف یدخل به المستخدم القیمه ومن ثم تخزن ( name )
والتي تكون في النموذج بهذا الشكل : ( name ) في المتغیر
والذي سوف یدخله المستخدم سوف یخزن في المتغیر ( input ) وهذا لكي نمیز ان الحقل هذا الذي في ال
اي انه خاص به . ( name ) الذي اسمه
ونعني به ان هذه القیمه سوف یدخلها المستخدم لذلك هي غیر معلومه الى الان .. ( value )
var a = new Array( ) ;
var name=info.name.value ;
info.name.value ;
< form name="info" action=" " >
< input type="text" name="name" value="" size="3” >
٦٠
61
وبهذا تكون الصیغة للمتغیر والقیمة التي سوف تخزن بها كتالي :
إذا عرفنا لماذا نضع المتغ&
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى