بسم الله الرحمن الرحيم
السلام علبكم ورحمة الله وبركاته
اخوانى الاعزاء اعضاء هذا المنتدى الرائع هذا هو الدرس الثالث من دروس الجافا سكريبت وانا اسف لتاخرى قليلا فى نشر هذا الدرس وذلك لظروف الدراسة ومشروع التخرج من فضلك اذا لم تكن قد درست الدرسين السابقين او على الاقل الدرس الاول فابدأ به ومن ثم تابع هذا الدرس
مع تمنياتى بالتوفيق للجميع
سنستكمل فى هذا الدرس ما كنا قد بدانا الحديث عنها فى الدرس السابق وهو موضوع كائنات جافا سكريبت
Jscript objects
والان مع العضو الثانى فى هذه الكائنات وهو مهم جداا جداا وهو المصفوفات
2-Array object
معظمنا طبعا سمع المصفوفات حيث هى من اهم هياكل البيانات فى اى لغة برمجة ولكن لمن لا يعلم المصفوفة هى مخزن لمجموعة من القيم تحت اسم واحد لو تذكر المتغير - راجع الدرس الاول - كان يحمل قيمة واحدة تحت اسم واحد اما المصفوفة فهى اقوى من ذلك بكثير فهى تجمع بداخلها عدد كبير من القيم تحت مسمى واحد وتاخذ ارقاما تبدا من الصفر تسمى فهرس ويمكن الوصول لاى عضو فى المصفوفة عن طريق اسم المصفوفة ورقم الفهرس الخاص به لنا خذ مثالا عمليا يوضح الموضوع تماما
لتعريف كائن مصفوفة
var names=new Array(5)
هذا الكود يعرف مصفوفة عدد عناصرها 5 عناصر ولتخزين القيم فيها كالتالى
ملحوظة
الترقيم فى المصفوفة يبدأ من الصفراى ان المصفوفة التى عدد عناصرها 5 يكون اخر عنصر فيها رقمه 4 والاول رقمه 0 كالتالى
names[0]="Ayman" names[1]="Ahmed" names[2]="Sami" names[3]="Ali" names[4]="Mohammed"
كما ترى الطريقة سهلة جدا وترى ايضا قوة المصفوفات التى يمكن استخدم جملة لووب واحدة لعرض جميع بياناتها او تخزين قيم جديدة كما سنرى
والان لنسترجع العضو رقم 3 مثل فى هذه المصفوفة
name3=names[0]
كما توجد طريقة اخرى لتخزين القيم داخل المصفوفة ويتم ذلك اثناء عملية الانشاء نفسها كما بالمثال
var names = new Array("Ayman","Ahmed","Sami","Ali","Mohammed")
[code]
كما ترى تم شحن المصفوفة بقيم مبدئية اثناء الانشاء وبالطبع يكون صول المصفوفة حسب عدد العناصر المخزنة فعليا
والان لناخذ مثالا على كيفية استخدام المصفوفات مع جمل التكرار وهى احد اوجة قوة المصفوفات لنقم مثلا بعرض جميع القيم المخزنة فى المصفوفة المنشاءة سابقا يكون الكود كالتالى
[code]
for (i=0; i<names.length; i++)
{
document.write(names + "
")
}هذا المثال يقوم بطباعة جميع قيم المصفوفة ونحن هنا لسنا فى حاجة الى معرفة طول المصفوفة اثناء كتابة البرنامج وهذا مفيد جدا حيث انه من الممكن ان يحدد المستخدم هذا الصول ولا يوثر ذلك اطلاقا على البرنامج طالما اننا نسنخدم هذه الخاصية
Length
وهى سى ممتاز جدا فى المصفوفات وكما ترى يا صديقى ان المصفوفات كلها اوجه قوة ويكون لها دور رئيسى فى اى برنامج ذو قيمة اية كانت لغة التصميم
وللمصفوفات مجموعة منالخائص والطرق البرمجية نذكرها هنا
length
تعيد صول المصفوفة
concat()
تعيد مصفوفة ناتجة من دمج مصفوفتين سويا
Join()
تعيد نص ناتج من دمج كل عناصر مصفوفة
<html>
<body>
<script type="text/javascript">
var famname = new Array("Ayman","Ahmed","Sami","Ali","Mohammed")
var me=famname.join()
document.write(me)
</script>
</body>
</html>slice()
تعيد جزء معين من المصفوفة
<html>
<body>
<script type="text/javascript">
var names = new Array("Ayman","Ahmed","Sami","Ali","Mohammed")
var me=names.slice(0,2)
document.write(me)
</script>
</body>
</html>sort()
تعيد مصفوفة مرتبة
<html>
<body>
<script type="text/javascript">
var numbers = new Array(3,5,4,1,2)
numbers.sort()
for(i=0;i<5;i++)
{
document.write(numbers +"
")
}
</script>
</body>
</html>وبذلك نكون قد انتهينا من هذا الكائن ولنا خذ كائن اخر لا تقلق لن اطيل عليك انه كائن بسيط ومشوق جدا ان تظهر اليوم او الساعة فى صفحتك اليس كذلك اعتقد انه كذلك اذن فهيا الى هذا الكائن
3-Date object
هذا الكائن خاص بالتعامل مع التاريخ والوقت كما سنرى الان وهذا مثال بسيط لانساء كائن تاريخ وعرض الوقت والتاريح
<html> <body> <script type="text/javascript"> var mydate=new Date() mydate.getDate() document.write(mydate) </script> </body> </html>
ويمكن ان تشحن متغير التاريخ الذى انشاته بقيمة مبديئة كالتالى
var my_date=new Date("October 12, 1988 13:14:00")
var my_date=new Date("October 12, 1988")ويوجد لهذ الكائن العديد من الدوال سنعرضها فيما يلى
getDay() , getMonth() , getFullYSear()
تستخدم لعرض اليوم والشهر والسنة بالارقام
<script type="text/javascript">
var d = new Date()
document.write(d.getDate())
document.write(".")
document.write(d.getMonth() + 1)
document.write(".")
document.write(d.getFullYear())
</script>فى الكود السابق تلاحظ الاتى
getMonth هذه الدالة ترجع قيم الشهور بداية من الصفر اى من صفر الى 11 ولضبط الشهور نضيف 1
وهنا فكرة
ماذا لو اردنا عرض اسم الشهر واسم اليوم من الممكن هنا بل والجيد جدا ان نستخدم المصفوفات لتخزين اسماء الايام واسماء الشهور واستخدان الرقم المرجع من الدوال السابقة كفهرس لهذه المصفوفة
مثـــــــال
<script type="text/javascript">
var d=new Date()
var weekday=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
var monthname=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
document.write(weekday[d.getDay()] + " ")
document.write(d.getDate() + ". ")
document.write(monthname[d.getMonth()] + " ")
document.write(d.getFullYear())
</script>getDate() لاحظ استخدام هذه الدالة التى تعيد رقم اليم داخل الاسبوع وتبدا ايضا من الصفر
getSeconds() , getMinutes() , getHours()
تستخدم هذه الدوال لعرض الوقت (ساعات دقائق ثوانى) جرب الكود التالى
<script type="text/javascript">
var d = new Date()
document.write(d.getHours())
document.write(".")
document.write(d.getMinutes())
document.write(".")
document.write(d.getSeconds())
</script>getUTCHours() , getUTCMinutes() , getUTCSeconds()
UTC تعيد هذه الدوال الوقت (ساعات دقائق توانى) بالنظام العالمى
وهذا مثال على استخدامها
<script type="text/javascript">
var d = new Date()
document.write(d.getUTCHours())
document.write(".")
document.write(d.getUTCMinutes())
document.write(".")
document.write(d.getUTCSeconds())
</script>والان بعد ان استعرضنا دوال التاريخ والوقت تسطتيع يا صديقى الان عرض التاريخ والوقت فى صفحتك اليس كذلك؟
نعم ولكن..................!!!
التاريخ سيعرض اما الوقت فانه سيعرض الوقت لحظة تحميل الصفحة مممممممم مشكلة
لكن لها حل..
Timer وذلك با ستخدام المؤقت
تسطتيع ام تحدث الوقت كل ثانية واحدة وبذلك نكون قد نجحنا فى عرض الوقت الحالى تماما
والى الامثلة الان لتضح الامور
لناخد مثالا يعرض الوقت الحالى فى مربع نص مثلا ويحدث كل ثانية ها هو
<html>
<head>
<script type="text/javascript">
var timer = null
function stop()
{
clearTimeout(timer)
}
function start()
{
var time = new Date()
var hours = time.getHours()
var minutes = time.getMinutes()
minutes=((minutes < 10) ? "0" : "") + minutes
var seconds = time.getSeconds()
seconds=((seconds < 10) ? "0" : "") + seconds
var clock = hours + ":" + minutes + ":" + seconds
document.forms[0].display.value = clock
timer = setTimeout("start()",1000)
}
</script>
</head>
<body onload="start()" onunload="stop()">
<form>
<input type="text" name="display" size="20">
</form>
</body>
</html>هذا المثال جيد جداا فيه استخدام لكثير من الاشياء التى سبق شرحها فى الدرسين السابقين
والان اصدقائى نكون قد وصلنا الى نهاية هذا الدرس اتمنى ان يكون قد وفقنى الله فى عرض هذا الجزء
ارجو من الجميع ان كان هناك اى شى غير واضح الرد فى المنتدى حالا او مراسلتى على
اللهم اجعلنا متعاونين دائما فى اخير
مع اطيب امنياتى للجميع بالتوفيق وبحياة سعيدة
اخوكم
ايمن مصطفى
والسلام عليكم ورحمة الله وبركاته