فى البدايه.... نفتح برنامج Notepad  

من قائمه ابدأ (start) نختار all programs  ثم نختار Accessories  ومنها نختار برنامج Notepad  وبكده اكون فتحت البرنامج اللى هنكتب فيه اكواد الجافا سكربت.
 كما تعلمنا سوف نبدأ بكتابه اكواد html  ونكتب بداخلها اكواد javascript  كالتالى

لتنفيذ الاوامر السابقه المكتوبه فى ملف Notepad .

·        يتم حفظ ملف Notepad   , نختار من file  كلمه save as  , سوف تظهر هذه النافذه

يتم كتابه اسم للملف كما هو موضح كمثال سنكتب اسم الملف lesson 1.html) ) ولابد من كتابه الامتداد وهو (.html)  أو (.htm)    ويتم كتابه هذا الامتداد لتحويل هذا الملف من ملف Notepad  إلى ملف ويب, وبعد ذلك نضغط على save  .

·        يتم فتح الملف المحفوظ باسم lesson 1  من المكان المحفوظ به وسوف نلاحظ ان شكل الملف اخد شكل المتصفح الافتراضى لجهازك.

·        بعد فتح الملف الويب سوف تظهر هذه الصفحه

ملحوظه

سوف اذكر بعض الاوامر وبعد ذلك سيتم تنفيذ هذه الاوامر مره واحده .

الان سوف نتحدث عن بعض اوامر الجافا سكربت..

أولا: أوامر الطباعه

يقصد به استخدام امر معين لكتابه او طباعه جمله او كلمه فى صفحه الويب , وهناك عده طرق لاوامر الطباعه سوف نذكرها الان.

1.     كتابه الامر بدون استخدام أى تأثيرات من html  كالتالى..

document.write("الجمله المراد طباعتها");

2.     كتابه الامر مع استخدام تأثيرات html  مثل كود (<h1>هنا تكتب الجمله</h1>) , هذا الكود يتم استخدامه لتغيير حجم الخط  والامر كالتالى...

document.write("<h1>الجمله المراد طباعتها</h1>");

 3.     كتابه الامر مع استخدام تأثير html  مع تأثير style  (بمعنى أنه سوف نستخدم تأثير html السابق لتغيير حجم الخط واستخدام تأثير style  لتغيير لو الخط ) كالتالى...

document.write("<h1 style=\"color:red\">الجمله المراد طباعتها</h1>");

4.     طباعه جمله فى سطرين وذلك باستخدام كود <br>  قبل الجمله المراد كتابتها فى سطر جديد.

document.write("الجمله الاولى <br>  الجمله الثانيه ");

هذا هو شكل الاوامر السابقه فى ملف Notepad

ملحوظه

عند كتابه أى أمر لابد من الحفظ بعده حتى نرى تأثيره فى صفحه الويبيتم حفظ هذه الاوامر من file   نضغط على save  وبعد ذلك نفتح ملف الويب كما تعلمنا فى البدايه وسوف تظهر هذه النافذه

ثانيا:عمل نافذه تخرج للمستخدم ويتم تحديد ما يكتب بها

تسمى هذه النافذه فى الجافا سكربت بـ alert   , ويكتب كودها بهذه الطريقه ...

window.alert("اهلا بكم فى موقعنا");

 وهذا هو شكل النافذه...

ملحوظه

     هناك بعض الاوامر التى تستخدم داخل كود alert

1.     أمر (\n): يستخدم لوضع كلمه او جمله فى سطر جديد

window.alert("welcome \n Mohammed");

2.      أمر (\t) :  يستخدم لترك مسافه بين كل كلمه واخرى لكى تظهر كجدول..

window.alert("welcome \t Mohammed \t in \t my site");

3.      أمر (\\)  : لكتابه الرمز(\)

window.alert("Eng \\ Mohammed");

4.      أمر (\")  : لكتابه الرمز (")

window.alert("hello \" Mohammed \" ");

5.     أمر (\') : لكتابه الرمز( ' )

window.alert("hello \' Mohammed \' ");

ثالثا:عمل نافذه تخرج للمستخدم يتم تحديد ما يكتب بها

تسمى هذه النافذه فى الجافا سكربت بـ (prompt)  , وهذه النافذه تختلف عن نافذه (alert) حيث ان هذه النافذه تسمح للمستخدم بادخال بيانات معينه , ويكتب كودها بهذه الطريقه...

window.prompt("please enter your name ","your name");

كما لاحظنا فى كود prompt  انه يأخذ قيمتين..

القيمه الاولى: يكتب بها ما سوف يظهر للمستخدم فى النافذه وهو كلام ثابت مثل (please enter your name)

القيمه الثانيه: يكتب بها اى قيمه ابتدائيه حيث أن هذه القيمه سوف تظهر فى صندوق الكتابه وهذه القيمه سوف تختفى بمجرد أن المستخدم يكتب مكانها أى كلام آخر هو يريده .

وهذا هو الشكل النهائى لملف Notepad  وبه كل الاوامر السابقه

شوفنا مع بعض فى الدرس الاول كيفيه عمل نافذه تظهر للمستخدم , يستطيع المستخدم ان يكتب بداخل هذه النافذه , هذه النافذه تسمى نافذه prompt  , تعالوا نعمل نافذه ونخلى المستخدم يكتب اسمه فيها.

<script language="javascript">
Window.prompt("please enter your name","your name");
</script>

وهذا هو شكل النافذه

وهنا المستخدم ادخل اسمه ... لمعرفه كيفيه اظهار الاسم بعد ذلك , لابد من معرفه جزء بسيط وهى المتغيرات.

كيفيه تعريف المتغير فى الجافا سكربت

يتم تعريف المتغير كالتالى

var name;

لإعطاء قيمه للمتغير هناك

1. قيمه ثابته كالتالى

var name;
name="Ahmed";

OR

var name="Ahmed";

    2. قيمه يدخلها المستخدم كالتالى

var pass;
pass=window.prompt("enter password","your password");

     وهنا القيمه التى سيدخلها المستخدم فى النافذه سوف يخزن فى المتغير (pass) 

كيفيه طباعه متغير

تتم طباعه المتغير من خلال الامر التالى

var name="Asmaa";
document.write(name);

ويمكن طباعه متغير بجانبه كلمه ثابته كالتالى

document.write("welcome "+name);

الآن يمكننا كتابه كود اظهار اسم المستخدم بعدما ادخله المستخدم

العمليات الحسابيه

مثال على العمليات الحسابيه

var number=4;
number=number+5;

OR

number+=5;

هنا تم جمع قيمه 5 على القيمه الموجوده فى المتغير number ليصبح الناتج يساوى 9 , وللتأكد من صحه العمليه الحسابيه يمكننا طباعه الناتج كالتالى..

var number=4;
number+=5;
document.write("الناتج يساوى "+number);

ولكن فى البداية لابد من معرفه العمليات المنطقيه.

العمليات المنطقيه

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

الجمل الشرطيه

تستخدم للتحقق من شئ ما إذا كان صحيح أم لا , فهى عباره عن مقارنه بين قيمتين إذا تطابقوا يتم تنفيذ أوامر معينه , وإذا لم يتطابقوا سيؤدى إلى تنفيذ أوامر أخرى.

 أنواع الجمل الشرطيه

1. الدالة الشرطيه (if)

if (الشرط)
{
     إذا تحقق الشرط - تنفذ الاوامر المكتوبه هنا
}
     أوامر خارج الدالة

هذه الداله تقوم بالتأكد من الشرط , فإذا تحقق هذا الشرط يتم الدخول إلى داخل الداله أى إلى الاوامر المكتوبه بين القوسين { } وتنفيذ هذه الاوامر وبعد ذلك يتم تنفيذ الاوامر خارج الداله

أما إذا لم يتحقق الشرط يتم تنفيذ الأوامر التى بخارج الدالة فقط.

مثال على ما سبق

التأكد من أن الرقم السرى صحيح ام لا

فى هذ المثال قمنا بتعريف متغير اسمه (pass)  ووضعنا بداخله قيمه (java90) , ثم قمنا بتعريف متغير آخر وهو (user_pass)  ولم نحدد قيمته حيث أن القيمه (كلمه السر) ستحدد من خلال القيمه التى سيدخلها المستخدم من خلال نافذه prompt 

أما فى جمله if   هناك شرط للتأكد من أن كلمه السر التى ادخلها المستخدم مطابقه لكلمه السر المخزنه فى المتغير pass , إذا تطابقوا سيتم طباعه جمله (welcome to our site) , وإذا لم يتطابقوا لا يطبع شئ.

وعند تنفيذ هذا البرنامج سيظهر الآتى

  2. الدالة الشرطيه (if/else)

if (الشرط)
{
إذا تحقق الشرط - نفذ هذه الاوامر
}
else
{
نفذ هذه الاوامر - اذا لم يتحقق الشرط
}
تنفيذ الاوامر الخارجيه

فى هذه الداله يتم التأكد من الشرط وسوف يكون هناك حالتين وهما..

• الأولى

 تحقق الشرط فى دالة if  والدخول إلى الداله وتنفيذ ما بداخل الداله من اوامر وبعد ذلك يتم تنفيذ الاوامر الخارجيه.

• الثانيه

عدم تحقق الشرط فى داله  if  وبالتالى الانتقال إلى جمله else  وتنفيذ الاوامر التى بداخلها ثم الانتقال إلى تنفيذ الاوامر الخارجيه.

مثال اخر للتأكد من الرقم السرى باستخدام (if/else)

فى هذ المثال قمنا بتعريف متغير اسمه (pass)  ووضعنا بداخله قيمه (java90) , ثم قمنا بتعريف متغير آخر وهو (user_pass)  ولم نحدد قيمته حيث أن القيمه (كلمه السر) ستحدد من خلال القيمه التى سيدخلها المستخدم من خلال نافذه prompt 

فى جمله if اذا تحقق الشرط وهو أن كلمه السر التى ادخلها المستخدم تطابق كلمه السر المخزنه , يتم الدخول إلى الداله وطباعه جمله (اهلا بك) , وبعد ذلك يتم تنفيذ الامر الذى بخارج الداله وهو طباعه جمله    ( عالم البرمجه )

 وفى حاله عدم تحقق الشرط أى ان المستخدم ادخل كلمه سر غير مطابقه لكلمه السر المخزنه , يتم تنفيذ الامر بداخل (else) وهو طباعه جمله ( كلمه السر غير صحيحه ) , وبعد ذلك يتم تنفيذ الاوامر الخارجيه وهو طباعه كلمه (عالم البرمجه).

عند تنفيذ هذا البرنامج سيظهر التالى