آموزش مقدماتی جاوا اسکریپت

JavaScript

توسط reza-irdev در 6 سال پیش
0 3.7k 17 6 سال پیش
reza-irdev
0

جاوااسکريپت چيست؟

قبل از هر چيز بايد به اطلاع شما برسانم که براي يادگيري جاوااسکريپت، شما نياز به دانستن زبان HTML و درک کاملي از طراحي و ساخت صفحات وب بايد داشته باشيد چون جاوااسکريپت يک زبان مجزا از اچ تي ام ال نيست و بايد همراه با کدهاي HTML در يک صفحه بکار رود تا کارآيي داشته باشد. با اين توضيح مي پردازيم به ادامه مطلب، همانطور که مي دانيد زبان اچ تي ام ال به تنهايي جوابگوي نياز بينندگان وب سايتها نمي باشد چون آنها علاقه خاصي به جذابيتها و ارتباط متقابل ميان خود و صفحات وب دارند که اچ تي ام ال نمي تواند جذابيت قابل توجهي به يک صفحه بدهد و يا با يک کاربر ارتباط برقرار کند. پس براي برطرف کردن اين مشکلات، صفحات وب نيازمند يک زبان قوي تر مي باشد که به همين منظور زبان جاوااسکريپت خلق شد.

جاوااسکريپت توسط شرکت Netscape اختراع شد و به عنوان اولين زبان اسکريپت نويسي در وب توسعه يافت که در حال حاضر پرکاربردترين و محبوب ترين زبان اسکريپت نويسي در دنيا مي باشد که يکي از دلايل آن، پشتيباني دو مرورگر معروف وب، Internet Explorer و Netscape Navigator از اين زبان مي باشد. نا گفته نماند که شرکت مايکروسافت هم براي اينکه از نت اسکيپ در اين زمينه عقب نماند، نسخه مربوط به خود را بنام Jscript توليد کرد.

[color=#FF0000]تفاوت جاوااسکريپت با جاوا:[/color]

تقريباً در هر جا که آموزش جاوااسکريپت هست اين مطلب هم مشاهده مي شود چون خيلي ها فکر مي کنند که اين دو با هم يکي بوده يا حداقل اينکه جاوااسکريپت ساده شده زبان جاوا براي کاربرد در وب مي باشد که اصلاً اين چنين نيست.

همانطور که ميدانيد جاوااسکريپت متعلق به شرکت نت اسکيپ مي باشد اما زبان جاوا متعلق به شرکت Sun Microsystems است. جاوااسکريپت در اصل يک زبان اسکريپت نويسي است نه يک زبان برنامه نويسي کامپيوتر، شايد بتوان اسکريپتها را يک نوع زبان برنامه نويسي خيلي سبک و ساده ناميد اما جاوا يک زبان برنامه نويسي کاملاً پيچيده مانند زبان C است. تفاوت ديگر آنها اينست که جاوااسکريپت توسط يک برنامه مفسر يعني interpreter در مرورگر تعريف و تفسير شده تا قابل اجرا باشد و حتماً هم اين کار در مرورگر انجام مي شود اما برنامه هاي جاوا بايد توسط يک کامپايلر Compiler ، کامپايل شده که کامپايل شدن يعني جمع آوري اطلاعات مورد نظر و ترجمه آن اطلاعات به زبان قابل فهم براي کامپيوتر و تبديل آن به يک برنامه کاربردي واحد و مستقل براي کاربر را گويند. به همين دليل برنامه هاي جاوا را که اپلت applet مي نامند، مستقل اجرا مي شوند. البته اپلتهاي جاوا را مي توان در صفحات وب هم گنجاند.

در يک جمله مي توان گفت که جاوااسکريپت فقط در صفحات وب تأثيرگذار است اما زبان جاوا براي خلق برنامه هاي پيچيده در کامپيوتر ساخته شده است.

**قابليتهاي جاوااسکريپت: ** اکنون که يک مفهومي از زبان جاوااسکريپت را در ذهن داريد، بايد ببينيم که با آن چکار مي توانيم انجام دهيم يا بهتر بگويم که جاوااسکريپت چه کاري براي ما انجام مي دهد و چه قابليتهايي را در مرورگر ايجاد مي کند.

در حقيقت جاوااسکريپت يک ابزار براي طراحان وب و نويسندگان کدهاي HTML مي باشد. جاوااسکريپت داراي ترکيباتي ساده نسبت به زبانهاي برنامه نويسي است که براحتي مي توان آنها را داخل کدهاي اچ تي ام ال يک صفحه قرار داد و از آنها استفاده کرد. يکي از قابليتهاي ويژه جاوااسکريپت رايگان بودن آن است که اگر شما زبان HTML را بدانيد، مي توانيد با کمي دانستن جاوااسکريپت کدهاي آماده که بيش از 2000 نوع از آنها در وب وجود دارد را در صفحات خود بکار گيريد.

با استفاده از اين زبان مي توانيد متنهاي پويا و متحرک در صفحات و در نقاط مختلف مرورگرها مانند نوار وضعيت آنها خلق کنيد. يکي ديگر از قابليتهاي اين زبان عکس العمل نشان دادن به وقايع و اتفاقات مي باشد بطور مثال واکنش نسبت به کليک يکي از دکمه هاي موس يا فشردن يک کليد بر روي کيبورد و يا انجام عملي هنگام بسته شدن صفحه مرورگر.

جاوااسکريپت حتي مي تواند کدهاي اچ تي ام ال را بخواند و يا توليد کند که توسط اين خاصيت مي توانيد در هر زمان خاص يک متني را توليد يا تغيير دهيد و يا در زماني مشخص عکسي را جايگزين عکسي ديگر کنيد.

يکي از بهترين ويژگيهاي جاوااسکريپت، اعتبار بخشيدن به اطلاعات مي باشد مثلاً شما يک فرمي براي ارتباط با کاربر خود ساخته ايد و مي خواهيد قبل از اينکه آن اطلاعات به سرور فرستاده شود، بازبيني شده تا اگر مشکلي وجود داشته باشد به کاربر اطلاع داده شود تا در صدد رفع آن برآيد. چون جاوااسکريپت اصطلاحاً Client side است، يعني در سيستم کاربر اجرا شده و مستقل از وب سرور است مي تواند ترافيک روي سرور را کم کرده که اين موضوع يک امتياز مثبت براي ميزبانان وب محسوب مي شود.

iranw3.com

در فایل پیوست شده شما با جاوا اسکریپت آشنا میشید.

0

تگ اسکريپت

جاوااسکريپت هم مانند زبان HTML از يکسري دستور و گرامر خاص خود پيروي مي کند. البته اين زبان به سادگي اچ تي ام ال نيست و بسيار هم حساس است، مثلاً در اچ تي ام ال فاصله بين تگها اهميتي ندارد و مرورگر آنرا ناديده مي گيرد اما در جاوااسکريپت فاصله بايد متناسب باشد که اگر رعايت نشود با پيغام خطا روبرو خواهيد شد. در قسمت بعد با چگونگي پيغامهاي خطا در جاوااسکريپت آشنا مي شويد. همانگونه که اطلاع داريد کدهاي جاوااسکريپت را بايد در ميان تگهاي HTML قرار دهيد. به همين دليل يک تگ براي آن در نظر گرفته شده است:

<script> ... </script>

که کليه دستورات جاوااسکريپت بايد مابين آنها قرار گيرد. اين تگهاي اچ تي ام ال به مرورگر مي فهمانند که در کجا اين زبان آغاز شده تا مفسر جاوااسکريپت مرورگر فعال شود و در کجا پايان مي پذيرد که برنامه مفسر هم کار خود را خاتمه دهد.

language

اما تگ script مانند بقيه تگها داراي خصوصياتي مي باشد، يکي از آنها language است که مقدار آنرا بايد برابر با javascript قرار دهيد،

<script language="javascript">
</script>

براي مقدار javascript مي توانيد نسخه آن را هم بنويسيد. اين زبان هم مانند اچ تي ام ال داراي نسخه هاي مختلفي است که هر کدام آنها با قابليتهاي جديدي در وب توسعه يافتند. نسخه هاي اين زبان عبارتند از 1.0 ، 1.1 ، 1.2 ، 1.3 ، 1.4 و آخرين نسخه حال حاضر هم 1.5 مي باشد که هم اکنون اين نسخه با مرورگر مايکروسافت يعني اينترنت اکسپلورر سازگاري ندارد. فعلاً مرورگر اينترنت اکسپلورر از نسخه 1.3 اين زبان پشتيباني مي کند.

type

تگ اسکريپت خصوصيت type هم دارد که براي اين زبان بايد آنرا برابر با text/javascript قرار دهيد. نکته قابل توجه اينست که اگر اين خصوصيت را به اين تگ اضافه کنيد، مرورگر اينترنت اکسپلورر نسخه 1.5 اين زبان را ناديده مي گيرد و کد را اجرا مي کند. شما مي توانيد با اجراي کد زير هم اولين اسکريپت خود را تجربه کنيد و هم خصوصيت type را در IE امتحان کنيد.

خب مانند زبان اچ تي ام ال مي توانيد از يک ويرايشگر متن مانند برنامه Notepad استفاده کرده و کد زير را در آن وارد کنيد:

<html>
<head>
<title> My JavaScript </title>
</head>
<body>
<script language="javascript1.5" type="text/javascript">
document.write(" Hello my friends ")
</script>
</body>
</html>

اکنون اين فايل را با پسوند htm ذخيره کنيد و سپس آنرا در مرورگر اينترنت اکسپلورر اجرا کنيد که جمله Hello my friends را بايد در صفحه ببينيد. حالا خصوصيت type را حذف کنيد و دوباره فايل را ذخيره و مشاهده کنيد، هيچ متني در صفحه ديده نميشود که با تغيير نسخه 1.5 به 1.3 آن متن دوباره نمايان خواهد شد. نوشتن نسخه جاوااسکريپت اجباري نيست يعني مي توانيد آنرا ننويسيد.

حالا ببينيم که چه اتفاقي هنگام اجراي اين کد مي افتد. تگ اسکريپت و خصوصيات آن روشن است اما به عبارت زير دقت کنيد:

document.write(" Hello my friends ")

ببينيم در اينجا اين عبارت چگونه براي مرورگر تفسير مي شود. document يعني همان سند و فايل html که در آن اين عمليات بايد انجام شود و مرورگر به محض برخورد با اين عبارت آماده مي شود براي انجام کاري که بعد از يک نقطه نوشته مي شود. در اينجا بايد عمل write يعني نوشتن را انجام دهد اما چي بايد بنويسد، طبق قرارداد بايد هر چيزي که در بين پرانتز هست را بنويسد و چون محتواي داخل پرانتز مابين دو علامت نقل قول يعني " " قرار گرفته پس بايد بصورت يک string در بيايند. string يعني يک رشته کاراکتر که مي تواند هم حرف باشد هم عدد و هم علامت و خاصيت string در اين است که هرچيزي مابين دو علامت " " قرار گرفت عيناً بايد در صفحه نوشته شود.

در جاوااسکريپت به document يک object يعني شئ مي گويند و هنگامي که يک نقطه بعد از آن گذاشته مي شود آن شئ منتظر method خود مي شود که در اينجا همان write است. به عبارت ساده اين خط مي گويد که آن شئ را بردار و در آن توسط متد نوشتن چيزي بنويس.

ساده بود، نه؟ بقيه دستورات هم به همين راحتي است فقط بايد آنها را بنويسيد و تمرين کنيد تا در ذهنتان بمانند.

src

تگ script يک خصوصيت ديگر هم دارد که src است و با آن آشنا هستيد، بله همانطور که حدس زديد براي آدرس دهي است. کدهاي جاوااسکريپت را هم مانند استايل شيت مي توانيد در يک فايل جداگانه نوشته و با پسوند js ذخيره کنيد سپس با خصوصيت src آدرس آن فايل را مشخص کنيد. توجه داشته باشيد که در آن فايل نبايد ديگر تگ script را بنويسيد. معمولاً در اين حالت تگ اسکريپت در قسمت head گنجانده مي شود تا با شروع صفحه فايل جاوااسکريپت فراخواني شود.

<html>
<head>
<script language="javascript" src="jsfiles/name.js" type="text/javascript">
</script>
</head>

همانطور که گفته شد، جاوااسکريپت خيلي حساس بوده و از کوچکترين اشتباهي نخواهد گذشت. به خاطر اهميت اين موضوع در صفحه بعد چگونگي پيدايش خطا را توضيح مي دهم.

0

يکي از مواردي که در نوشتن کدهاي جاوااسکريپت ممکن است زياد با آن برخورد کنيد، دريافت پيغام هاي خطا هنگام اجراي کدها در مرورگر مي باشد، پس بهتر است در همين ابتداي کار با آنها آشنا شويد تا هنگام مشاهده خطا، تجربه کافي براي رفع آن داشته باشيد. خطاهاي جاوااسکريپت را به دو صورت متوجه مي شويد يکي ظاهر شدن مثلثي زرد با يک علامت تعجب در سمت چپ نوار وضعيت مرورگر مانند شکل زير:

[align=center][/align]

در بعضي از مرورگرها اين نوار مشاهده نمي شود که مي توانيد براي مشاهده آن به منوي View مرورگر رفته و روي گزينه Status Bar کليک کنيد. حالت ديگر ديدن پيغامهاي خطا، باز شدن يک پنجره در وسط مرورگر است که در اين حالت جزئيات خطاي ايجاد شده را هم مي توانيد مشاهده کنيد. مانند شکل زير:

[align=center][/align]

توجه داشته باشيد، در نسخه هاي جديد مرورگر اينترنت اکسپلورر اين پنجره مشاهده نميشود و ابتدا آنرا بايد فعال کنيد. براي فعال کردن آن به منوي Tools مرورگر رفته و گزينه Internet Options را انتخاب کنيد، در پنجره باز شده به قسمت Advanced رفته و گزينه Display a notification about script error را تيک بزنيد، سپس دکمه Ok را زده تا کار شما تأييد شود. بهتر است که قبل از شروع کد نويسي جاوااسکريپت اين عمل را انجام دهيد تا هنگام بروز خطا در صدد رفع آن برآييد که به اين کار اشکال زدايي يا Debugging مي گويند. اگر هم اين گزينه را فعال نکرديد، هنگام بروز خطا مي توانيد بر روي آن مثلث زرد رنگ در نوار وضعيت رفته و دوبار کليک کنيد که همان پنجره اعلان خطا باز خواهد شد.

انواع خطاها:

اساساً دو نوع خطا براي جاوااسکريپت وجود دارد، خطاهاي نحوي يا Syntax errors و خطاهاي زمان اجرا يا Run time errors که در خطاهاي نحوي يک مشکلي در ترکيبات کدها بوجود آمده مثلاً يک غلط املائي در يک دستور يا جا انداختن يک حروف يا علامت و در خطاهاي زمان اجرا احتمالاً يک دستور بطور اشتباه جاي يک دستور ديگر نوشته شده است که در هنگام اجراي کد، مفسر مرورگر نمي تواند اين دستور را تجزيه تحليل کند وخطا را اعلام مي کند.

ايجاد يک خطا:

خب حالا اجازه دهيد تا اين پيغامها را تجربه کنيم و ببينيد که به چه راحتي توسط آنها مي توانيد اشکال زدايي کرده و کد خود را به سرعت اصلاح کنيد. ممکن است که دهها بار با پيغام خطا روبرو شويد ولي نااميد نشويد چون حرفه اي ها هم بارها و بارها با آن مواجه مي شوند. حالا کد زير را با نام error.htm ذخيره کنيد:

<html>
<head>
<title> Error message </title>
</head>
<body>
<script language="javascript" type="text/javascript">
document.write("I'm ready for first error message.");
</script>
</body>
</html>

يکبار آنرا اجرا کنيد و نتيجه را مشاهده کنيد. حالا پرانتز دوم راحذف مي کنيم، بدين صورت:

document.write("I'm ready for first error message.";

سپس فايل را دوباره ذخيره کرده و اجرا مي کنيم. همانطور که انتظار داشتيم پنجره پيغام خطا باز شد، اگر جزئيات پيغام را نداريد روي دکمه Details يا Show Details کليک کنيد تا ببينيم که چه اطلاعاتي را مي توانيم بدست آوريم. در کادر جزئيات اولين گزينه Line مي باشد که اگر مطابق کد بالا عمل کرده باشيد بايد درجلوي آن عدد 7 نوشته شده باشد. اين خط به ما مي فهماند که ايراد در خط هفتم سورس کد است. دقت کنيد، تنها خطهاي مربوط به جاوااسکريپت را نبايد بخوانيد بلکه کليه خطوط از بالا به پايين خوانده مي شود، حتي خطهاي خالي هم بايد شمرده شوند.

دومين گزينه، کلمه Char است که بيانگر عدد شمارش شده کاراکتري که باعث بروز خطا شده است و در اينجا آن عدد 52 مي باشد. فراموش نکنيد که هر فاصله بين کلمات هم يک کاراکتر به حساب ميايد. شايد اينجا سؤالي برايتان پيش بيايد که چرا عدد 52 ؟ در صورتي که در اينجا پرانتز کاراکتر51 است. بايد يک نکته را خدمتتان عرض کنم که علامت ; در جاوااسکريپت يک کاراکتر اختياري است که نشان دهنده پايان يک خط از کد مي باشد و برنامه نويسان بر حسب عادتي که دارند از اين علامت استفاده مي کنند ، در اينجا مفسر جاوااسکريپت آنرا به عنوان يک کاراکتر قبل از کاراکتر اصلي خطا شناسايي کرده است.

گزينه بعدي Code ميباشد که ظاهراً بطور معمول عدد صفر جلوي آن ميباشد و هنوز نتوانستم کارآيي آنرا تشخيص بدهم و گزينه آخر هم URL است که آدرس فايل اچ تي ام ال است که در آن خطا توليد شده است.

در مجموع شما براي اشکال زدايي به سه گزينه اول نياز داريد که با توجه به آنها بلافاصله مي توانيد محل بروز اشکال را تشخيص دهيد. يک نکته را به خاطر بسپاريد که در کدهاي طولاني ممکن است با تعداد خطاهاي زيادي برخورد کنيد که در بيشتر مواقع برطرف کردن اولين خطا باعث رفع کليه اشکالات مي شود.

به عنوان جمله آخر اين قسمت، هميشه به پنجره هاي اعلان خطا با ديد مثبت نگاه کنيد چون آنها به ما کمک مي کنند تا اشکال را براحتي پيدا کنيم.

0

در حال حاضر شما ميدانيد که براي اجرا شدن کدهاي جاوااسکريپت بايد آنها را در ميان تگهاي اچ تي ام ال بکار بريد. شايد اين سؤال برايتان پيش بيايد که در کجا بايد آنها را بنويسيد، آيا جاي خاصي دارند يا در هر کجا مي توانيد اينکار را انجام دهيد. کدهاي جاوااسکريپت مي توانند در هر کجاي سورس کد باشند اما بايد ابتدا تشخيص دهيد که بکاربردن هر قسمت از اسکريپت در کجا مناسب تر مي باشد. بطور کل کدهاي جاوااسکريپت به سه دسته تقسيم ميشوند، يک سري از آنها در قسمت سر يعني head جاي مي گيرند و يک سري در قسمت بدنه کدهاي اچ تي ام ال و دسته سوم هم در يک فايل جداگانه و خارج از کدهاي html با پسوند js قرار مي گيرند که در ادامه به توضيح هر دسته خواهيم پرداخت.

نوشتن اسکريپت در قسمت head:

کليه کدهاي جاوااسکريپت به محض باز شدن يک صفحه وب در مرورگر اجرا مي شوند اما گاهي اوقات ما نياز داريم تا يک اسکريپت زودتر از کدهاي ديگر اجرا شده و يا آماده باشد تا در صورت لزوم فراخواني شود. که اينگونه کدها را بايد در قسمت سر و ما بين تگ head بنويسيم. بطور مثال شما نياز به اين داريد که به محض ورود کاربر به صفحه در همان ابتدا پيغامي ظاهر شود و تا کاربر آنرا تأييد نکرده است صفحه تکميل نشود. اسکريپتهاي قسمت سر هميشه آماده اجرا و يا آماده پاسخ به اتفاقي در صفحه وب هستند، که در اين مورد شما مطمئن هستيد اسکريپت مورد نظر قبل از هر چيزي در صفحه، اجرا خواهد شد. براي نوشتن کدهاي جاوااسکريپت بصورت زير عمل مي کنيد:

<html>
<head>
<title> ... </title>
<script language="javascript" type="text/javascript">
...... javascript codes ......
</script>
</head>

نوشتن اسکريپت در قسمت بدنه:

هنگاميکه نياز داشته باشيد تا کدهاي جاوااسکريپت در بدنه فايل html اجرا شود آنها را در قسمت body صفحه وارد مي کنيد،

<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
....... javascript codes ......
</script>
</body>
</html>

شما حتي مي توانيد توسط کدهاي جاوااسکريپت قسمتي از يک صفحه را بسازيد يعني با ترکيب جاوااسکريپت و تگهاي اچ تي ام ال در body يک عنصر در صفحه وارد کنيد. کدهاي زير را بنويسيد و اجرا کنيد:

<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
document.write("<h1 align='center'> Hello my friends! </h1>");
</script>
</body>
</html>

لازم بذکر است که شما مي توانيد براي نظم دادن و جلوگيري از شلوغي قسمت بدنه يک اسکريپت بصورت function در قسمت head تعريف کنيد و در قسمت بدنه آنرا فراخواني کنيد که در قسمت هاي بعد در اين مورد بيشتر توضيح خواهم داد.

فايل خارجي جاوا اسکريپت:

شما مي توانيد براي حفظ نظم تگهاي اچ تي ام ال در يک صفحه وب و يا براي جلوگيري از تکرار يک اسکريپت در صفحات يک وب سايت، کدهاي جاوااسکريپت را در يک فايل جداگانه نوشته و با پسوند js آنها را ذخيره کنيد سپس در هر قسمت و هر صفحه اي که لازم بود، وارد کنيد. خط زير را در برنامه Notepad نوشته و آنرا به اسم test.js ذخيره کنيد:

document.write(" JavaScript external file ")

حالا يک فايل اچ تي ام ال بسازيد و تگهاي زير را در آن وارد کنيد سپس با يک اسم دلخواه آنرا در همان پوشه که فايل جاوااسکريپت را ذخيره کرده ايد قرار دهيد:

<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript" src="test.js">
</script>
</body>
</html>

اگر مراحل را بدرستي انجام داده باشيد، جمله زير را در مرورگرتان مشاهده خواهيد کرد.

JavaScript external file

دقت کنيد که اگر فايل جاوااسکريپت را در پوشه اي جدا از فايل html قرار مي دهيد حتماً در خصوصيت src آدرس دقيق آنرا بنويسيد.

0

متغير چيست؟

متغيرها يکي از مباحث مهم در جاوااسکريپت هستند چون کاربرد زيادي در اين زبان دارند. متغيرها يا Variables مانند يک ظرف و مخزن براي ذخيره سازي اطلاعات هستند که اين اطلاعات مي تواند يک کلمه يا جمله ، عدد و يا حتي يک شئ باشد. متغيرها، کد نويسي را راحت تر کرده و نظم خاصي به اسکريپت ما مي بخشند. بطور مثال ما يک متن را مي خواهيم در چند نقطه از کد وارد کنيم که بجاي آن مي توانيم از يک کلمه کوتاه که اين متن در آن ذخيره شده استفاده کنيم تا از تکرار جلوگيري کرده و اسکريپت هم شلوغ نشود. به مثال زير توجه کنيد تا وظيفه يک متغير را ببينيد:

<script language="javascript" type="text/javascript">
var strTest = "This is an example for variable."
document.write(txtTest)
</script>

حالا مي پردازيم به جزئيات تعريف يک متغير در اين اسکريپت:

var strTest = "This is an example for variable."

اصطلاح var از کلمه variable مي آيد که نوشتن آن اختياري مي باشد، يعني مي توانيد يک متغير را بدون نوشتن آن هم تعريف کنيد ولي اگر مي خواهيد کد شما خوانا تر باشد بهتر است که از var استفاده کنيد. قسمت بعدي يعني strTest نامي است که شما براي آن متغير انتخاب مي کنيد و سپس علامت مساوي است که متغير را برابر با يک مقدار قرار مي دهد و در آخر هم مقدار تعيين شده براي متغير که در اينجا يک رشته متني است يا يک text string ميباشد که به همين دليل بايد آنرا بين دو علامت " " قرار دهيم تا عيناً محتويات آن در مرورگر نوشته شود.

انتخاب نام متغير:

بهتر است نام يک متغير را طوري انتخاب کنيد که در عين سادگي، گويا بوده و يادآور نکاتي براي شما باشد چون هميشه کدهاي شما به چند خط ختم نميشود، گاهي اوقات ممکن است مجبور شويد بيش از صد خط کد در يک صفحه قرار دهيد. بطور مثال چون مقدار متغيردر اينجا يک رشته يعني string بود من سه حرف str را به ابتداي نام متغير اضافه کردم.

اما براي انتخاب نام متغير بايد نکات زير را رعايت کنيد:

نام يک متغير مي تواند از مجموع حروف، اعداد و علامت underline يا زيرين خط يعني _ تشکيل شود، که آغاز کننده نام نبايد يک عدد باشد و همچنين هيچگونه فاصله اي هم در آن نبايد باشد. در جاوااسکريپت حروف کوچک با بزرگ متفاوت مي باشند يعني strTest با strtest کاملاً تفاوت دارد که اصطلاحاً مي گويند جاوااسکريپت case sensitive است.

انواع متغيرها:

دو نوع متغير وجود دارد که تفاوت اين دو مدل در محل استفاده از آنها مي باشد. متغيرهاي کلي و سراسري که به آنها global گفته مي شود. اين متغيرها در سراسر يک فايل اچ تي ام ال کاربرد دارند يعني يکبار آنرا در ابتداي اسکريپت تعريف و مقدار دهي مي کنيد ولي در هر کجا از کد که مورد نياز باشد از آنها بهره مي گيريد. نوع ديگر آن متغيرهاي محلي يا local هستند که فقط در يک قسمت از اسکريپت کارآيي دارند که ممکن است در قسمت ديگري همان متغير با يک مقدار ديگري تعريف شود. معمولاً متغير هاي محلي در توابع يا function ها کاربرد دارند که يک متغير در هر تابع مي تواند مقادير متفاوت داشته باشد بدون اينکه پيغام خطايي توليد کند که در قسمت مورد نظر function ها را ياد خواهيد گرفت.

به قسمتي از اسکريپت که يک متغير در آن کاربرد دارد، حوضه يا scope آن متغير گفته مي شود.

با درک مفهوم متغيرها در جاوااسکريپت مي توانيم در صفحه بعد با چگونگي نمايش تاريخ و زمان در صفحات وب آشنا شويم.

0

Date Object

يکي از ويژگي هايي که جاوااسکريپت دارد جمع آوري اطلاعات از سيستم کاربر و نمايش آنها در صفحات وب است. همانطور که ميدانيد زبان اچ تي ام ال به تنهايي قادر به انجام چنين کاري نيست اما با کمک زبانهاي ديگر تحت وب مانند Javascript ، مي تواند تا حدودي اين مشکل را برطرف کند. شئ هايي در جاوااسکريپت وجود دارند که توسط متدهاي مختلف، اطلاعات مورد نياز را از سيستم گرفته و در اختيار کاربران قرار مي دهند. يکي از اين object ها و شئ ها ، Date مي باشد که به کمک آن مي توانيم تاريخ و زمان سيستم را هنگام اجراي کد دريافت کنيم، سپس آنرا نمايش دهيم و يا اينکه در يک متغير ذخيره کنيم تا در صورت لزوم از آن بهره گيريم. اين object بصورت زير تعريف مي شود:

new Date():

به طرز نوشتن آن دقت کنيد که غير از اين باشد با پيغام خطا روبرو خواهيد شد چون جاوااسکريپت زبان حساسي است پس هر جا که حروف بزرگ است بايد بزرگ و هر جا کوچک است بايد کوچک نوشته شود. در آخر هم پرانتز مي گذاريد که در قسمتهاي بعدي همين صفحه کارآيي آنها را درک خواهيد کرد. اين شئ يک رشته متني شامل روز، ماه، سال، ساعت، دقيقه، ثانيه و اختلاف زماني با UTC را برميگرداند. UTC مخفف Coordinated Universal Time مي باشد که به آن Zulu time هم مي گويند و مطابق با استاندارد جهاني زمان است.

کد زير را در يک سند اچ تي ام ال وارد کنيد و پس از ذخيره، آنرا اجرا کنيد:

<script language="javascript" type="text/javascript">
document.write ( new Date() )
</script>

متدهاي شئ Date:

بعد از ساختن شئ جديد Date ، مي توانيد توسط متدهاي مربوط به آن جزئيات ديگري از اين شئ دريافت کنيد. اين شئ داراي هفت متد اصلي ميباشد که بيشترين کاربرد را دارند. اين متدها عبارتند از:

getDate(), getDay(), getMonth(), getYear(), getHours(), getMinutes(), getSeconds()

براي تعريف و استفاده از اين متدها بايد ابتدا شئ را نوشته، سپس يک نقطه بگذاريم و بعد از نقطه متد مورد نظر را بنويسيم.

براي درک بهتر مطالب گفته شده يک تمرين را با هم انجام مي دهيم. در يک صفحه وب، مي خواهيم زمان ورود يک کاربر به همان صفحه را اعلام کنيم. بطور مثال:

شما دقيقاً درساعت 11:1:41 وارد اين صفحه شديد.

که اسکريپت آن براي برگرداندن زمان مورد نظر به صورت زير مي باشد:

<script language="javascript" type="text/javascript">
var vorood = new Date()
document.write( vorood.getHours() + ":" + vorood.getMinutes() + ":" + vorood.getSeconds() )
</script>

ابتدا شئ Date را تعريف کرده و در يک متغير به نام vorood ذخيره مي کنيم تا بکار بردن آن در قسمتهاي بعدي راحت تر باشد، سپس از شئ document و متد write براي چاپ نتيجه در صفحه وب استفاده کرده و متدهاي لازم براي برگرداندن اطلاعات مورد نياز را مي نويسيم. دقت کنيد که براي ترکيب متدها از علامت + استفاده کرديم، اين علامت باعث ترکيب و پيوند بين اجزاي يک اسکريپت مي شود که خاصيت آنرا در بخش بعدي operator ها يعني عملگرها توضيح خواهم داد. ازعلامت : هم بين ساعت، دقيقه و ثانيه استفاده شده و چون مي خواستيم که اين علامت عيناً در صفحه نوشته شود آنرا بين علامت نقل قول يعني "" گذاشتيم. در ضمن مي توانيد از کدهاي اچ تي ام ال هم استفاده کنيد تا زمان به شکل دلخواه شما در صفحه چاپ شود. بطور مثال اگر بخواهيد که صورت Bold در صفحه نوشته شود، به شکل زير عمل مي کنيد:

document.write("<b>"+ vorood.getHours()+ ":"+ ...... + "</b>")

نکته: هنگاميکه از متد getMonth() براي برگرداندن عدد ماه استفاده مي کنيد بايد هميشه آنرا بعلاوه عدد يک کنيد چون جاوااسکريپت اولين ماه ميلادي را برابر با عدد صفر قرار مي دهد.

document.write( new Date().getMonth()+1 )

در مورد متد getYear() هم اگر مي خواهيد نتيجه کامل برگردد يعني سال بصورت چهاررقمي نوشته شود بايد از متد getFullYear() استفاده کنيد.

اگر هم بخواهيد تمام مقادير بر اساس UTC برگردانده شوند، بايد اين کلمه را در وسط متد مورد نظر وارد کنيد. بدين صورت:

getUTCFullyear(), getUTCDate(), getUTCHours(), getUTCMinutes()

تنظيم تاريخ و زمان:

شئ Date به غير از متدهاي ذکر شده در بالا، داراي متدهاي ديگري است که توسط آنها مي توانيد زمان و تاريخي را بصورت دلخواه تنظيم کنيد. در اينگونه متدها بجاي کلمه get بايد از set استفاده کنيد و مقدار معيني را در پرانتز وارد کنيد. بطور مثال مي خواهيم همين موقع را در سال 2008 داخل صفحه چاپ کنيم.

<script language="javascript" type="text/javascript">
var zaman = new Date()
zaman.setFullYear(2008)
document.write ( zaman )
</script>

نتيجه اي که اين اسکريپت برميگرداند بصورت زير است، به روز هفته در اول خط و سال در آخر خط توجه کنيد که براي سال 2008 تنظيم شده است.

Thu Jul 10 2008 11:01:41 GMT+0330 (Iran Standard Time)

0

يکي از مهمترين قابليت هاي زبان جاوااسکريپت، توانايي آن در انجام دادن عکس العملهاي متفاوت در شرايط مختلف است. بر اين اساس اين زبان قادر است که متغيرهاي مختلف را با هم مقايسه کند و شرطهايي را براي آنها تعيين کند تا به يک نتيجه دلخواه برسد.

**دستور if: ** اغلب اوقات هنگام نوشتن يک اسکريپت، شما نياز داريد که تصميم هاي متفاوتي در مقابل نتايج مختلف بگيريد. بطور مثال ميخواهيد هنگاميکه يک کاربر وارد سايت شما مي شود اگر ساعت قبل از 10 صبح بود يک متن در بالاي صفحه ظاهر شود و به کاربر صبح بخير بگويد. در اينجا دستور if به کمک ما مي آيد. اين دستور يکي از مهمترين دستور در کد نويسي است چون توسط آن مي توانيم شرط تعيين کنيم که اگر اينطور شد، نتيجه اين باشد. اين دستور هميشه دو قسمت دارد: يکي قسمت شرط و ديگري قسمت نتيجه شرط است. به کد زير توجه کنيد:

<script language="javascript" type="text/javascript">

var d = new Date()
var t = d.getHours()

if ( t < 10 )
{
document.write ( "<b> Good morning </b>")
}

</script>

حالا ببينيم که چه اتفاقي افتاده است، در خط سوم ما يک متغير بنام d تعريف کرديم که به آن شئ Date را نسبت داديم و در خط بعد از آن يک متغير ديگر که يکي از متدهاي آن شئ را مقدار دهي کرديم تا ساعت سيستم براي ما ذخيره شود، سپس با يک خط خالي قسمت شرط را جدا کرديم تا به خوانايي اسکريپت کمک کنيم. کلمه if را مي نويسيم، دقت کنيد که شرط را حتماً داخل پرانتز بايد نوشت و در آن هم همانطور که مشاهده مي کنيد از عملگر کوچکتر استفاده کرديم. در اينجا ساعت سيستم در متغير t ذخيره شده است و دستور if داره شرط کوچکتر بودن را بررسي مي کند. در خط بعدي هم علامت آکلاد { } را بکار برديم که در اينجا آنرا براي نظم و خوانايي بيشتر کد استفاده کرديم اما فراموش نکنيد که اين دستور ممکن است از چندين قسمت تشکيل شود که در آنصورت بکار بردن آکلاد لازم است تا بتوانيم هر قسمت را از هم جدا کنيم. در آخر هم دستور تايپ يک متن مناسب در صفحه را به عنوان نتيجه شرط نوشتيم.

دستور if...else:

در مثال بالا درستي يک شرط بررسي شد و يک نتيجه هم در بر داشت، اما حالا مي خواهيم در صورتي که شرط درست نبود هم يک نتيجه در بر داشته باشد، پس ما به يک قسمت ديگر در اين دستور نياز داريم که در حالت جديد مثال ما به اين صورت خواهد بود: اگر ساعت قبل يا برابر 10 بود پس جمله صبح بخير نمايش داده شود در غير اينصورت متن سلام دوستان ظاهر شود. در کد بجاي قسمت در غير اينصورت مي توانيم کلمه else را وارد کنيم تا به مفهوم مورد نظر برسيم.

if ( t < 10 || t == 10 ) {
document.write ( "<b> Good morning </b>" )
}
else
{
document.write ( "<b> Hello friends </b>")
}

دستور if...else if...else:

اين دستور را زماني مي توانيد استفاده کنيد که بخواهيد يک شرط در شرايط مختلف بررسي شود تا نتيجه هاي متفاوت هم بدست بيايد:

if ( t <= 10  ) {
document.write ( "<b> Good morning </b>" )
}
else if ( t > 10 && t < 13 ) {
document.write ( "<b> Hello friends </b>" )
}
else if ( t >= 13 && t < 18 ) {
document.write ( "<b> Good afternoon </b>" )
}
else {
document.write ( "<b> Good evening </b>" )
}

در دستورات شرطي جاوااسکريپت به غير از مجموعه دستورات if يک مورد ديگر هم هست بنام دستور switch که در پست بعد به توضيح آن مي پردازيم.

0

دستور switch يکي ديگر از دستورات شرطي جاوااسکريپت است که چندين شرط را براي متغيرها مقايسه مي کند تا نتايج مختلف بدست بيايد. در حقيقت دستور switch از تکرار if else جلوگيري مي کند. در مواردي که شرطها و نتايج آنها کم هستند مي توانيد از دستور if else استفاده کنيد اما براي شرطهاي زياد بهتر است switch را بکار بريد تا کد شما منظم تر باشد.

تنها مشکلي که اين دستور دارد اينست که از نسخه javascript 1.2 به بعد از آن پشتيباني شده که ممکن است بعضي از مرورگرهاي قديمي با اين دستور مشکل داشته باشند، ولي در ايران مشکلي نيست چون مطمئناً به علت استفاده رايگان از مرورگرها، ديگر کسي را پيدا نخواهيد کرد که مرورگر قديمي داشته باشد.

دستور سوئيچ مانند if داراي قسمتهايي است، که اجازه دهيد يک مثالي را بيان کنم و سپس به توضيح بخشهاي مختلف آن بپردازم.

مي خواهيم يک صفحه درست کنيم که به محض ورود کاربر به آن، آنروز هفته را در صفحه نمايش دهد:

<script language="javascript" type="text/javascript">

var d = new Date ()
var weekday = d.getDay ()

switch ( weekday )
 {
case 0 :
          document.write ("Sunday")
          break
case 1:
         document.write ("Monday")
          break
case 2:
         document.write ("Tuesday")
         break
case 3:
         document.write ("Wednesday")
         break
case 4:
         document.write ("Thursday")
          break
case 5:
         document.write ("Friday")
         break
default:
         document.write ("Saturday")
}
</script>

خب حالا بپردازيم به توضيح کد تا ببينيم که چه اتفاقي افتاده است. ابتدا توسط شئ Date ، تاريخ و زمان سيستم را در يک متغير بنام d ذخيره کرديم و سپس در خط بعدي توسط متد getDay اين شئ ، عدد روز هفته را از سيستم بدست آورديم و در متغير weekday ذخيره کرديم. دقت کنيد که اين متد عدد برميگرداند نه خود روزهاي هفته را و در نظر داشته باشيد که مفسر جاوااسکريپت روز اول هفته را يکشنبه ميداند و عدد 0 را به آن تعلق ميدهد و روز دوشنبه را عدد يک و به همين ترتيب تا آخرين روز هفته که شنبه باشد عدد 6 را ميدهد.

اکنون نوبت به بررسي شرط رسيده که مي خواهيم از دستور سوئيچ استفاده کنيم. ابتدا خود دستور را مي نويسيم يعني همان کلمه switch و سپس يک پرانتز باز مي کنيم تا متغيري که بايد در شرايط مختلف بررسي شود را در آن بنويسيم. براي نظم اسکريپت يک آکلاد هم باز مي کنيم ولي در آخر اين مجموعه آنرا مي بنديم.

case:

همانطور که مشاهده مي کنيد از کلمه case بجاي if else استفاده مي کنيم و حالت مختلف شرط را در جلوي آن مي نويسيم و سپس علامت : مي گذاريم. در حقيقت ما اينجا به مفسرجاوااسکريپت مي گوييم که اگر متغير ما که روزهاي هفته است برابر با صفر بود، نتيجه اين مي شود که بايد کلمه Sunday را در صفحه چاپ کني، در غير اينصورت برو حالت بعدي يعني case بعدي را مقايسه کن.

break:

دستور break يکي از بخشهاي switch است که به مفسر جاوااسکريپت مي فهماند که در کجا قسمت case تمام مي شود و يک قسمت ديگر شروع مي شود، در حقيقت از تداخل قسمتهاي مختلف جلوگيري مي کند. دقت کنيد که شما هم بايد آنرا قبل از شروع case بعدي بنويسيد.

:default

دستورات case را همينطور ادامه مي دهيد تا به جايي برسيم که کليه حالتها بررسي شده باشد و به عنوان آخرين حالت که ممکن است پيش بيايد ما يک نتيجه اي را در نظر مي گيريم، يعني در حقيقت else آخر مي باشد. در اينجا چون مثال ما روزهاي هفته است و از هفت روز عادي هفته نمي تواند خارج باشد، آخرين روز را که شنبه باشد براي اين حالت در نظر گرفتيم و مفهوم آن اينطور است که 6 روز هفته را بررسي کن اگر هيچ کدام از آنها نبود، روز شنبه را براي نتيجه اعلام کن.

و در آخر هم آکلاد باز شده را مي بنديم تا پايان اين مجموعه از دستور سوئيچ مشخص شود.

در نظر داشته باشيد که دستورات شرطي بسيار کاربرد دارند و حتي ممکن است در يک اسکريپت چندين بار از اين دستورات استفاده کنيد.

0

هر گاه بخواهيد يک مجموعه کد به دفعات مشخص و يا رسيدن به يک نتيجه مشخص تکرار شود، بايد از حلقه استفاده کنيد. حلقه ها در جاوااسکريپت دو نوع هستند، يکي حلقه for و ديگري حلقه while که هر کدام از آنها هم ممکن است بسته به موقعيت کد مدلهاي مختلفي داشته باشند که در ادامه با کار آنها آشنا خواهيد شد.

حلقه for:

در اين حلقه، مجموعه کد مورد نظر به تعداد مشخص تکرار مي شود که در ابتداي حلقه تعداد دفعات اجراي کد بايد اعلام شود. پس هرگاه مي دانستيد که چند بار قرار است کد اجرا شود از اين حلقه استفاده کنيد. بطور مثال مي خواهيم اعداد از 0 تا 10 در صفحه چاپ شوند:

<script language="javascript" type="text/javascript">

for ( i = 0; i <= 10; i++ )
{
document.write ( " Number " + i + "<br />")
}
</script>

خب براي اجراي اين مثال ابتدا کلمه for را نوشتيم تا شروع حلقه را به مفسر اعلام کنيم سپس يک پرانتز بايد باز کنيم تا پارامترهاي لازم براي تکرار در اين حلقه را وارد کنيم. اولين پارامتري که بايد وارد شود، يک متغير است با مقداردهي اوليه که به آن initial expression يا همان عبارت آغازين مي گويند. سپس دومين پارامتر که يک شرط است و مفهوم آن اينست که حلقه بايد ادامه پيدا کند تا متغير کوچکتر يا برابر با عدد 10 بشود. سومين پارامتر به عبارت افزاينده يا increment expression معروف است که در اينجا به اين مفهوم مي باشد که در هر بار اجراي حلقه يک واحد بايد به متغير افزوده شود. در انتهاي اعلام پارامترها پرانتز را مي بنديم. فقط دقت کنيد که در اين پرانتز هر پارامتري که نوشته شود بلافاصله بعد از آن بايد علامت ; قرار گيرد تا تداخلي بين آنها بوجود نيايد.

بطور ساده پارامترهاي داخل پرانتز را مي توانيم اينچنين بيان کنيم: مقدار اوليه متغير سپس مقدار نهايي و در آخر هم ترتيب افزايش متغير در هر تکرار حلقه. ناگفته نماند که حتماً نبايد مقدار افزايشي باشد، مي تواند به ترتيب کم شود که همه مقادير برعکس خواهند شد.

در خط بعد هم نتيجه را مابين آکلاد مي گذاريم تا به اسکريپت نظم دهيم و سپس دستور تايپ نتيجه که کلمه number را چون مي خواهيم عيناً در صفحه چاپ شود داخل " " گذاشتيم و بعد + که با پارامترهاي ديگه ترکيب بشود. البته در اينجا بجاي علامت بعلاوه مي توانيد کاما هم بگذاريد و بعد از آن متغير تعريف شده و در انتهاي آنها از تگ br استفاده کرديم تا هربار که حلقه تکرار مي شود نتيجه در يک خط جديد چاپ شود.

حلقه while:

نوع ديگر حلقه ها، حلقه while مي باشد که بر خلاف حلقه for لزومي ندارد که متغيرها را در داخل پرانتز به عنوان پارامتر حلقه اعلام کنيم و همچنين در مواردي هم که مقدار انتهايي حلقه مشخص نيست مي توانيم از اين نوع استفاده کنيم چون کد مورد نظر تا جايي که نتيجه دلخواه بدست بيايد تکرار خواهد شد. البته اين نوع حلقه را مي توانيم بجاي حلقه for هم بکار بريم يعني اگر مقدار نهايي متغير هم داشته باشيم اين حلقه کاربرد خواهد داشت. مثال بالا را در مورد اين حلقه مي توانيم به اين صورت ذکر کنيم:

var i = 0
while (i <= 10)
{
document.write(" Number " + i + "<br />")
i++
}

کلمه while را مي توانيم ترجمه کنيم به ماداميکه ، پس در اينجا ما متغير را جداگانه تعريف کرديم و حالا مي گوييم، ماداميکه شرط کوچکتر يا مساوي 10 بودن برقرار نيست حلقه را تکرار کن و يک واحد به آن اضافه کن تا بالاخره شرط ما درست دربيايد.

حلقه Do...while:

يک نوع حلقه ديگر در جاوااسکريپت وجود دارد که در حقيقت برعکس حلقه while مي باشد. در اين حلقه، شرط در آخر بدنه حلقه بررسي مي شود يعني يکسري دستور اجرا مي شود سپس شرط بررسي مي گردد که آيا به نتيجه مورد نظر رسيده است يا نه که اگر نتيجه درست نبود دوباره باز تکرار خواهد شد. فرق اين حلقه با حلقه while در اينست که حداقل يکبار دستورات اجرا خواهند شد ولي در حلقه while ممکن بود در صورت برقرار بودن شرط در همان ابتدا ديگر دستورات اجرا نشوند. حالا به مثال زير توجه کنيد تا کاملاً موضوع را درک کنيد:

var i=0
do
{
document.write(" Number " + i + "<br />")
i=i+1
}
while (i <= 10)

در اينجا همه چي مانند مثالهاي بالا است با اين تفاوت که کلمه do به ابتداي حلقه اضافه شده و بررسي شرط هم به انتهاي حلقه منتقل شده. همانطور که ميدانيد يکي از معني هاي do انجام دادن کاري است. مفهوم اين کد هم بدين گونه است که دستور چاپ را انجام بده و يک واحد به متغير اضافه کن ماداميکه متغير کوچکتر يا مساوي با عدد 10 بشود. پس اين دستورات حداقل يکبار اجرا مي شوند تا به شرط برسند، شما مي توانيد براي رسيدن به صحت اين گفته مقدار متغير را بجاي صفر به يک عدد ديگر تغيير دهيد مثلاً عدد 20 را بدهيد و يکبار کد را اجرا کنيد.

در اين مثال نوع ديگر افزايش هم نشان داده شده است که شما مي توانيد از اين مدل هم استفاده کنيد.

break:

مثالهايي که در بالا ذکر شد همگي ساده بودند اما هنگاميکه شما نياز به نوشتن حلقه هاي پيچيده تري داريد، بايد دقت کنيد که حلقه شما دچار حلقه بي نهايت يا همان حلقه نامتناهي نشود. بطور مثال يک مقدار اوليه براي متغير در نظر مي گيريد و يک شرطي هم تعيين مي کنيد اما هيچگاه شرط حلقه درست نخواهد شد که حلقه از تکرار باز ايستد و همينطور اجراي کد ادامه پيدا مي کند تا خود کاربر آن را با بستن مرورگر متوقف کند و گاهي حتي مجبور به راه اندازي مجدد کامپيوتر خواهد شد.

براي جلوگيري از همچين اتفاقي مي توانيد از دستور break استفاده کنيد و يک شرطي هم براي آن در نظر بگيريد تا از حلقه هاي بي نهايت جلوگيري شود.

var i = 11
while (i >= 10)
{
document.write(" Number " + i + "<br />")
i++
if ( i == 21 ) break
}

در اين حلقه هيچگاه شرط درست نخواهد بود و تا بي نهايت ادامه پيدا مي کند اما با استفاده از دستور break و شرطي که در نظر گرفتيم از تکرار نا محدود اين حلقه جلوگيري کرديم در حقيقت از حلقه خارج شديم. پس استفاده از اين دستور را براي حلقه هاي پيچيده در نظر داشته باشيد تا با مشکلات جدي مواجه نشويد.

0

آرايه چيست؟

آرايه يکي ديگر از دستورات جاوااسکريپت مي باشد که همانند بقيه دستورها يک وظيفه اي دارد و بهترين خاصيت اين دستور، کوتاه کردن اسکريپت ما است. شئ آرايه يا همان Array براي ذخيره کردن مقادير متفاوت در يک متغير بکار مي رود. همانطور که مي دانيد تا قبل از شناخت اين دستور براي هر متغير يک مقدار مشخص در نظر گرفته مي شد، اما توسط يک آرايه شما مي توانيد چندين مقدار را به يک متغير نسبت دهيد. بطور مثال مي توانيد اسامي روزهاي هفته را در يک متغير ذخيره کنيد. دستور آرايه داراي قسمتهايي است که با توجه به مثال زير به توضيح آنها مي پردازيم:

var weekdays = new Array(7)
weekdays[0] = "Shanbeh"
weekdays[1] = "Yekshanbeh"
weekdays[2] = "Doshanbeh"
weekdays[3] = "Seshanbeh"
weekdays[4] = "Chaharshanbeh"
weekdays[5] = "Panjshanbeh"
weekdays[6] = "Jomeh"

اول از همه يک متغير بنام weekdays تعريف کرديم و آنرا برابر با آرايه جديد قرار داديم، دستور آرايه را بايد با new Array شروع کنيد که به طرز نوشتن حروف بايد توجه کنيد، سپس پرانتزي باز کرده و تعداد مقادير را در آن مي نويسيم. به اين عدد داخل پرانتز index يا انديس مي گويند. انديس ها از صفر شروع مي شوند.

در خطوط بعد، نوبت به مقداردهي هر انديس مي رسد که متغير را مي نويسيم و هر انديس را بايد در کروشه [ ] بگذاريم و سپس آنها را برابر با يک مقدار قرار دهيم که اين مقادير هر چيزي مي توانند باشند مانند رشته هاي متني و يا اعداد.

مثال بالا را مي توان بصورت زير هم نوشت:

var weekdays = new Array ("Shanbeh","Yekshanbeh",...)

يعني بجاي نوشتن انديس کلي در پرانتز، مقادير هر انديس را بنويسيم و توسط کاما آنها را از هم جدا کنيم.

حالا مي خواهيم هنگام باز شدن صفحه وب، روزهاي هفته به ترتيب نمايش داده شوند. بعد از اينکه مقادير را در آرايه تعريف کرديم سپس بهترين دستوري که به ما در اينجا کمک مي کند يک حلقه است تا دستور چاپ کردن در صفحه را تکرار کند تا به آخرين روز هفته برسيم:

for ( i=0; i<7; i++ ) {
document.write ( weekdays[ i ] + "<br />" )
}

خصوصيت آرايه

آرايه هم داراي خصوصيت و متدهايي است که شما در صورت لزوم مي توانيد آنها را بکار بريد. براي تعريف کردن يک خصوصيت براي آرايه کافيست که بعد از متغير تعريف شده در آرايه، يک نقطه بگذاريد و سپس آن خصوصيت را بنويسيد.

خصوصيتي که بيشترين کاربرد را براي آرايه دارد، length مي باشد. وظيفه اين خصوصيت نمايش انديس کلي يک آرايه است. اگر بخواهيم در مثال بالا اين خصوصيت را بکار بريم، بايد خط زير را بعد يا قبل از حلقه for بکار بريم:

document.write ( weekdays.length + "<br />" )

بعد از وارد کردن اين کد و اجراي اسکريپت، عدد هفت در صفحه نوشته خواهد شد چون انديس ما در اينجا هفت بود. متدهاي آرايه

آرايه داراي متدهايي هم هست که نحوه تعريف کردن آنها همانند خصوصيت است و تنها فرقي که دارد بعد از نوشتن متد بايد پرانتز هم بگذاريد. متدهاي آرايه عبارتند از:

concat(), join(), pop(), shift(), push(), unshift(), reverse(), slice(), sort(), splice(), toString(), valueOf()

متد concat براي ترکيب مقادير دو يا سه آرايه بکار مي رود. اين متد هيچ چيزي را در آرايه ها تغيير نمي دهد و فقط مقادير تعريف شده را در صفحه چاپ مي کند. مثال

متد join تقريباً مانند متد قبلي عمل مي کند و کليه مقادير را بصورت يک رشته متني در صفحه نشان مي دهد با اين تفاوت که در اين متد مي توانيد يک علامت مانند نقطه، تعيين کنيد تا بين مقادير چاپ شده در صفحه قرار گيرد. بصورت پيش فرض اين علامت، کاما مي باشد. مثال

متد pop آخرين مقدار آرايه را جدا کرده و در صفحه نمايش مي دهد. دقت کنيد که اين متد در خصوصيت length تأثير مي گذارد يعني اگر بعد از اين متد خصوصيت length را بکار بريد، يک انديس کمتر نشان مي دهد. مثال

متد shift برعکس متد قبلي است يعني اين متد اولين مقدار آرايه را جدا مي کند و نشان مي دهد. مثال

متد push يک يا چند مقدار را به آخر يک آرايه اضافه مي کند و انديس جديد برمي گرداند. مثال

متد unshift يک يا چند مقدار به ابتداي يک آرايه اضافه مي کند و انديس جديد بر مي گرداند. دقت کنيد که اين متد در مرورگر اينترنت اکسپلورر بدرستي کار نمي کند. مثال

متد reverse ترتيب نمايش مقادير يک آرايه را برعکس کرده و در صفحه وب نمايش مي دهد. مثال

متد slice يکسري از مقادير موجود در يک آرايه را جدا مي کند که در اين متد شماره انديس مقداري که مي خواهيد از آنجا جداسازي شروع شود را بايد بنويسيد و همچنين مي توانيد آخرين مقدار هم مشخص کنيد که اگر آنرا معين نکنيد تا آخرين مقدار انتخاب خواهد شد. مثال

متد sort براي منظم کردن مقادير يک آرايه به ترتيب حروف الفباي انگليسي است. اگر هم مقادير يک آرايه، عدد باشند به ترتيب اعداد تنظيم خواهند شد که مفسر جاوااسکريپت به اولين عدد از سمت چپ نگاه مي کند و بعد از رديف کردن آنها سپس به اعداد بعدي نگاه مي کند. مثال

متد splice براي اضافه يا حذف يک مقدار در آرايه مي باشد که اين متد داراي پارامترهايي مي باشد که اين پارامترها را بايد در پرانتز مشخص کنيد. اولين پارامتر شماره انديس که در آنجا يک مقدار حذف يا اضافه خواهد شد و بايد عدد باشد. دومين پارامتر مقدار عددي است که معين مي کند چند تا مقدار از آن انديسي که در پارامتر قبل انتخاب کرديم، بايد حذف شود که اگر آنرا صفر در نظر بگيريد هيچ مقداري حذف نخواهد شد. اين دو پارامتر حتماً بايد نوشته شوند. در ضمن اگر مي خواهيد مقاديري هم اضافه شود بعد از اين پارامتر ها به عنوان پارامترهاي بعدي ذکر مي کنيد. مثال

متد toString مقادير يک آرايه را تبديل به يک رشته متني مي کند. مثال

اينها متدهايي هستند که کاربردشان در آرايه ها متداول است. شايد بنظرتان غير مفيد بيايند اما در بعضي جاها مي توانند به کمک شما بيايند و اسکريپت شما را خلاصه تر کنند.

0

تابع چیست؟

هنگاميکه شما شروع به نوشتن کد مي کنيد، بايد سعي کنيد که اسکريپت شما حتي الامکان خلاصه و منظم و خوانا باشد تا در مراجعت بعدي براي عيب يابي و يا تغييرات، مشکلي نداشته باشيد. هميشه کدهاي شما کوتاه نيست و گاهي اسکريپت شما ممکن است تا پنجاه خط برسد که در اين موقع نياز به يک سازمان دهي داريد.

توابع يا همان functions در جاوااسکريپت مي توانند کمک بزرگي به اين سازمان دهي کنند. شما مي توانيد يک مجموعه کد را که بايد در جاهاي مختلف تکرار شود را به صورت يک تابع تعريف کنيد و در هر جاي اسکريپت به آن نياز داشتيد آنرا فراخواني کنيد و از نوشتن مجدد بپرهيزيد. پس يک تابع، مجموعه کدي است که مي توان آنرا در جاهاي مختلف اسکريپت استفاده کرد بدون آنکه نياز به نوشتن مجدد آن کدها باشد. يک تابع مي تواند هر دستوري از جاوااسکريپت و يا حتي يک خط کد ساده باشد:

function message ( )
{
alert ( " Hello friends! " )
}

همانطور که مشاهده مي کنيد براي تعريف يک تابع از کلمه function استفاده مي شود و دقت کنيد که حروف آن بايد حتماً کوچک باشد. بعد از نوشتن دستور function نوبت به تعيين يک اسم واحد براي اين تابع است که بهتر است اين اسم متناسب با وظيفه اي که اين مجموعه قرار است انجام دهد باشد چون بخاطر آوردن آن هم راحتتر خواهد بود. سپس پرانتز مي گذاريم تا در صورت لزوم پارامترهايي را در آن مشخص کنيم که به اين پارامترها آرگومان و يا argument مي گويند. طبق معمول هم با گذاشتن علامت آکلاد مشخص مي کنيم که اين مجموعه در کجا شروع و در کجا ختم مي شود که در بين اين علامت هم کدهاي جاوااسکريپت را وارد مي کنيم. در اينجا يک دستوري نوشته شده که هنگام فراخواني اين تابع و اجراي کد، يک پنجره باز مي کند و عبارت متني داخل پرانتز را نمايش مي دهد که در بخشهاي بعدي در مورد اينگونه پيغامها و پنجره ها بيشتر توضيح خواهم داد.

شما يک تابع را در هر کجاي يک سند html مي توانيد بکار بريد. اگر دستوراتي است که هنگام باز شدن صفحه وب بايد اجرا شوند و يا آماده اجرا باشند پس بهتر است در قسمت head نوشته شوند. حتي مي توانيد يک تابع را در فايل خارجي جاوااسکريپت که با پسوند js ذخيره مي شود وارد کنيد تا در صفحات مختلف آنرا بکار بريد.

فراخواني يک تابع:

توابعي که در يک سند اچ تي ام ال تعريف مي شوند به خودي خود اجرا نخواهند شد. اگر شما يک تابع تعريف کنيد پس از باز کردن صفحه وب خواهيد ديد که هيچ اتفاقي نمي افتد.

توابع پس از تعريف بايد در جاي مورد نظر فراخواني شوند يعني آنها را صدا کنيم تا به کمک ما بيايند. در حقيقت آنها آماده هستند تا پس از فراخواني اجرا شوند. همانطور که با صدا کردن اسمتان شما پاسخ مي دهيد، يک تابع هم بايد اسمش را بکار بريد تا اجرا شود. پس هر کجا که نياز به دستورات آن تابع داشتيد، نامش را بنويسيد:

<html>
<head>
<title> Call function </title>

<script type="text/javascript" type="text/javascript">
function message ( )
{
alert ( " Hello friends! " )
}
</script>

</head>
<body>

<form>
<input type="button" onclick="message( )" value="Click me">
</form>

</body>
</html>

نگران دستور alert و onclick نباشيد چون در بخشهاي بعدي با آنها آشنا خواهيد شد. فقط به فراخواني تابع دقت کنيد که چگونه بکار برده مي شود.

آرگومان يک تابع

گاهي اوقات هنگام تعريف يک تابع، آرگومان و يا پارامتري را براي آن داخل پرانتز تعيين مي کنيد تا هنگام صدا زدن تابع، آن آرگومان مقداردهي شود. در کل مي توان گفت که يک آرگومان، متغيري است که هنگام صدا زدن تابع مقدار آن ارسال مي شود تا تابع از آن استفاده کند. مي توانيم مثال بالا را با يک آرگومان تعريف کنيم:

function message ( msg )
{
alert ( msg )
}
</script>

<input type="button" onclick="message( 'Hello friends!' )" value="Click me">

در اينجا يک آرگومان بنام msg تعيين کرديم تا هنگام فراخواني تابع، مقدارش به تابع فرستاده شود و نتيجه آن اجرا شود. در حقيقت عبارت Hello friends مقدار اين آرگومان مي باشد. تعيين آرگومان هيچ محدوديتي ندارد و فقط بايد آنها را با علامت کاما از هم جدا کنيد.

دقت کنيد که در دستورات جاوااسکريپت، بين دو علامت " " بايد از ' ' استفاده شود چون اگر مجدداً از خود علامت نقل قول يعني " " استفاده کنيد با پيغام خطا مواجه مي شويد.

بازگرداندن یک مقدار توسط دستور return:

توابع جاوااسکريپت داراي يک دستوري بنام return هستند که وظيفه اين دستور برگرداندن مقادير تعريف شده در آن تابع است.

function greeting ( ) {
return ( " Hello world! " )
}
.......

document.write ( greeting( ) )

اين مجموعه کد را اگر بدون استفاده از return اجرا کنيد، نتيجه درست نخواهيد گرفت. به يک مثال ديگر توجه کنيد:

<html>
<head>
<title> return statement </title>

<script type="text/javascript" type="text/javascript">
function total (a,b )
{
x = a * b
return x
}
</script>

</head>
<body>
<script type="text/javascript" type="text/javascript">
price = total ( 4, 15 )
document.write ( price )
</script>
</body>
</html>

همانطور که مشاهده مي کنيد دو آرگومان براي تابع total تعريف شده است که در متغير x ذخيره مي شوند و توسط دستور return مقدارشان به تابع ارسال خواهد شد.

در نظر داشته باشيد که توابع در جاوااسکريپت بسيار کاربرد دارند و شما هنگام نوشتن اسکريپت خود پي به اهميت آنها خواهيد برد مخصوصاً زماني که يک سري کد را بخواهيد در کليه صفحات يک وب سايت بکار بريد که مي توانيد آنها را بصورت يک تابع در يک فايل خارجي جاوااسکريپت ذخيره کنيد و سپس در هر صفحه آن تابع را فراخواني کنيد.

0

سه نوع پنجره در جاوااسکريپت وجود دارند که مي توانيد توسط آنها پيغامي را در صفحه براي کاربر نمايش دهيد و يا اطلاعاتي براي تأييد آنها بفرستيد و يا اينکه اطلاعاتي را از آنها بخواهيد. آنها پنجره هاي کوچکي هستند که چون خيلي سريع در صفحه بالا آمده و در مقابل کاربر ظاهر مي شوند، به آنها popup گفته مي شود.

اين پنجره ها عبارتند از:پنجره alert ، پنجره confirm و پنجره prompt .

پنجره Alert:

پنجره alert ، حاوي يک اخطاريه براي کاربر است که در آن هشداري داده مي شود تا کاربر متوجه کاري که مي کند باشد. دستور اين پنجره به صورت زير است:

alert (" text ")

اين پنجره فقط داراي يک دکمه OK است که کاربر بعد از خواندن آن اخطاريه با زدن دکمه ok ، پنجره را مي بندد.

<html>
<head>
<script type="text/javascript" type="text/javascript">
function alertbox ( ) {
alert ( " This is an Alert box! " )
}
</script>
</head>

<body>
<form>
<input type="button" onclick="alertbox ( )" value="Click here">
</form>
</body>

</html>

پنجره Confirm:

اين مدل پنجره ، همانطور که از اسمش پيداست براي گرفتن تأييد از کاربر اجرا مي شود. اين پنجره داراي دو دکمه OK و Cancel مي باشد که با زدن دکمه OK توسط کاربر مقدار true بازگردانده مي شود و با زدن Cancel مقدار false برگردانده مي شود. دستور اين پنجره به اين صورت است:

confirm ( " text " )

اين پنجره براي مواقعي خوب است که شما نياز به جواب کاربر براي ادامه مطلبي يا چيزي داريد، در صورتيکه کاربر تأييد کند آن مطلب ادامه پيدا مي کند و در غير اينصورت همانجا متوقف خواهد شد.

<html>
<head>
<script type="text/javascript" type="javascript">
function confirmbox ( )
{
var button = confirm (" press a button.")
if (button == true)
{
document.write (" You pressed OK button. ")
}
else
{
document.write (" You pressed Cancel button.")
}
}
</script>
</head>

<body onload="confirmbox()">

</body>

</html>

در اين اسکريپت ما ابتدا يک تابع در قسمت head تعريف کرديم سپس دستور confirm را در يک متغير بنام button ذخيره کرديم تا بتوانيم براي اين متغير شرطي را تعيين کنيم. همانطور که گفتيم اگر کاربر دکمه OK را بزند، مقدار true برگردانده مي شود پس شرط را بر اين روال گرفتيم که اگر مقدار true بازگردانده شد متني در صفحه چاپ شود و در غير اينصورت متني ديگر نوشته شود. سپس اين تابع را در تگ بدنه و در رويداد onload قرار داديم تا به محض باز شدن صفحه پنجره confirm اجرا شود. رويداد onload را در بخش بعدي ياد خواهيد گرفت.

پنجره prompt:

از اين پنجره زماني استفاده مي شود که شما نياز داشته باشيد تا اطلاعاتي را از کاربر دريافت کنيد و آنرا در جايي مناسب بازگردانيد. معمولاً اجراي اين پنجره هنگام باز شدن صفحه وب است و داراي دو قسمت يا دو پارامتر مي باشد:

prompt ( "text or question", " default value " )

در قسمت اول يک متن که معمولاً سؤال است را وارد مي کنيد تا در پنجره ظاهر شود و در قسمت دوم يک مقدار پيش فرض براي راهنمايي کاربر وارد مي کنيد که معمولاً آن قسمت را خالي مي گذارند تا کاربر آن مقدار را وارد نمايد. البته اگر هم شما مقدار پيش فرض را وارد نماييد، باز کاربر قادر به وارد کردن مقدار ميباشد.

<html>
<head>
<script type="text/javascript">
function promptbox ( )
{
var name=prompt("Please enter your name", "name...")
if (name!=null && name!="")
{
document.write("Hello " + name + " and welcome to this page.")
}
}
</script>
</head>

<body onload="promptbox()">

</body>
</html>

مانند مثال قبل عمل کرديم با اين تفاوت که اين بار از دستور prompt استفاده شده است. فقط به يک نکته دقت کنيد که در دستور شرط ما متغير name را نا مساوي با مقدار null قرار داديم. null به معني هيچ چيز ميباشد و در اينجا آنرا بکار گرفتيم تا اگر کاربر بعد از باز شدن پنجره دکمه cancel را زد و يا هيچ اسمي وارد نکرد تغييري در صفحه ايجاد نشود. شما مي توانيد يکبار آنرا حذف کنيد و نتيجه اجراي کد را ببينيد.

در حال حاضر شما سه نوع پنجره ارتباط با کاربر را فرا گرفتيد که دو مدل اول بيشترين کاربرد را در کدنويسي شما خواهند داشت.

0

رويدادها و يا حوادث در جاوااسکريپت، کدهاي کوتاهي هستند که بين اقدامات انجام شده توسط کاربر مانند کليک کردن موس و اسکريپت، ارتباط برقرار مي کنند. يعني هنگاميکه کاربر بر روي دکمه هاي موس فشار مي آورد، رويدادها به اسکريپت اين موضوع را مي فهمانند تا اسکريپت براي آن حرکت عکس العملي در نظر بگيرد.

اين اقدامات شامل حرکاتي است مانند کليک کردن دکمه هاي موس، قرار گرفتن نشانگر موس بر روي يک نقطه از صفحه، فشردن کليدهاي کيبورد، انتخاب يا تغيير در اجزاي يک فرم، فشردن دکمه هاي فرم و يا باز و بستن يک صفحه وب.

در کل رويدادها باعث مي شوند تا جاوااسکريپت اينگونه حرکات را شناسايي و درک کند.

رويدادها مانند بقيه خصوصيات تگهاي اچ تي ام ال هستند که بايد در ميان تگها قرار گيرند و آنها را برابر با يک کد کوتاه جاوااسکريپت و يا اسم يک تابع تعريف شده بايد قرار داد.

رويداد و کد استفاده شده به صورت زير است:

<span onMouseOver="alert('SoftAfzar.Net')">

در صفحات قبل با بعضي از رويدادها آشنا شديد و حالا در اينجا کليه آنها را ياد خواهيد گرفت. لازم بذکر است که، همه رويدادها در تمام مرورگرها اجرا نمی شوند.

رويدادهاي موس:

زمانيکه مي خواهيد جاوااسکريپت نسبت به حرکات موس، عکس العمل نشان دهد از اين رويدادها استفاده مي کنيد. به سورس کد مثالها دقت کنيد تا با کاربرد آنها بيشتر آشنا شويد.

onClick براي کليک کردن دکمه چپ موس توسط کاربر.

مثال:

<body onClick="alert('You clicked on your left mouse button!')">
<p align="center" dir="rtl">موس خود را بر روی اين صفحه قرار دهيد و بر روی دکمه 
چپ فشار دهيد</p>
</body>

onDblClick رويداد براي دوبار کليک دکمه چپ موس.

مثال:

<body onDblClick="alert('This is double click event')">

<p align="center" dir="rtl"><span dir="rtl">موس خود را بر روی اين متن قرار دهيد 
و دوبار کليک کنيد.</span></p>

</body>

onMouseDown فشار آوردن بر روي دکمه چپ موس.

مثال:

<form>
<p align="center">
<button id="testbutton" onMouseDown="alert('You pressed the left mouse button')"> press the left button </button>
</p>
</form>

onMouseUp رها کردن دکمه موس پس از فشردن آن.

مثال:

<form>
<p align="center">
<button id="testbutton" onMouseUp="alert('This is onMouseUp event.')"> press the left button then released </button>
</p>
</form>

onMouseOver قرار گرفتن نشانگر موس بر روي يک چيزي.

مثال:

<form>
<p align="center">
<button id="testbutton" onMouseOver="alert('This is onMouseOver event.')">move your mouse over here </button>
</p>
</form>

onMouseOut خارج شدن موس از روي يک چيزي.

مثال:

<img border="0" src="logo.jpg" alt="iranw3.com" width="250" height="111" onMouseOut="alert('This is onMouseOut event')" align="left">

رويدادهاي کيبورد:

در اين رويدادها، جاوااسکريپت نسبت به فشردن يک کليد بر روي کيبورد توسط کاربر، عکس العمل نشان خواهد داد.

onKeyPress فشردن يک کليد کيبورد.

مثال:

<body onKeyPress="alert('You pressed a key on the keyboard!')">
</body>

onKeyDown مانند رويداد بالا براي فشردن يک کليد.

مثال:

<body onKeyDown="alert('You pressed a key on the keyboard!')">
</body>

onKeyUp رها کردن يک کليد فشرده شده.

مثال:

<body onKeyUp="alert('You pressed a key then released!')">

<p align="center" dir="rtl">يک دکمه بر روی کيبورد را فشار دهيد و بعد از يک مکث 
آنرا رها کنيد.</p>

</body>

رويدادهاي فرم:

اين رويدادها مربوط به عملياتي است که کاربر بر روي اجزاي فرم انجام مي دهد. البته ممکن است بعضي از اين رويدادها بر روي متنهاي عادي در صفحه هم عکس العمل نشان دهند اما بيشترين کاربرد را در فرمها دارند.

**onFocus هنگاميکه توسط موس و يا دکمه Tab کيبورد بر روي يکي از اجزاي فرم متمرکز شويد. ** مثال:

<form>
<input type="text" name="field" size="30" value="Please enter your name..." onFocus="field.value=' ' ">
</form>

onBlur هنگاميکه تمرکز از روي يکي از اجزاي فرم خارج شود.

مثال:

<form>
1. <input type="text" name="field1" size="20" value="" onBlur="alert('Please fill out the textbox 1.') " />
<p>2. <input type="text" name="field2" size="20" value="" /></p>
</form>

**onSelect انتخاب کردن يک متن در صفحه يا در يک فرم. ** مثال:

<form>
<input type="text" name="field1" size="20" value="Highlight this text..." onSelect="alert('You selected the text.') " />
</form>

onChange تغيير در اجزاي فرم، مانند تغيير متن در کادر متني.

مثال:

<form>
<input type="text" name="field1" size="20" value="Type something..." onChange="alert('You changed the text.') " />
</form>

onSubmit فشردن دکمه تأييد يک فرم.

مثال:

<form  onSubmit="alert('Submit button is clicked!')">
<input type="text" name="field" size="20" value=""  />
<p><input type="submit" value="submit" />
</form>

onReset فشردن دکمه reset يا همان پاک کردن اطلاعات فرم.

مثال:

<form  onReset="alert('The textbox will be erased!')">
<input type="text" name="field" size="20" value=""  />
<p><input type="reset" value="reset" />
</form>

رويدادهاي يک صفحه:

يکسري از رويدادها هم مربوط به صفحات وب مي باشد، مانند لود شدن صفحه يا بستن آن.

onLoad تکميل شدن يک صفحه وب يا يک تصوير در مرورگر.

مثال:

<img alt="onLoad event" onLoad="alert('The image was loaded succesfully.')" border="0" src="onload.jpg" width="400" height="300">

onUnload بستن مرورگر يا خروج از يک صفحه وب.

مثال:

<body onUnload="alert('You closed the page!')">
</body>

onResize تغيير اندازه پنجره مرورگر.

مثال:

<body>
onResize="alert('You resized the page!')">
</body>

يک رويداد ديگر هست که مي توان هم براي يک صفحه و هم براي يک عکس بکار برد:

onError اين رويداد زماني اجرا مي شود که يک عکس به هر دليلي لود نشود يعني در جاي خود قرار نگيرد.

مثال:

<img alt="onError event" src="image.gif" width="100" height="100" onError="alert('Sorry, there is no image!')" />

معمولاً براي رويدادها، ابتدا يک تابع تعريف مي شود تا هنگام نوشتن رويداد در يک تگ اچ تي ام ال، نظم برقرار باشد و از شلوغي تگ جلوگيري شود. بيشترين کاربرد اين رويدادها در تأييد اعتبار فرمها و پرسشنامه ها مي باشند که در يک بخش مجزا آنرا توضيح خواهم داد.

0

در بخشهاي قبل با بعضي از object ها يا همان شئ هاي جاوااسکريپت مانند، شئ Date و آرايه ها آشنا شديد. در اين صفحه قصد داريم در مورد شئ هاي ديگر در جاوااسکريپت صحبت کنيم.

شئ جاوااسکريپت چيست؟

وظيفه شئ ها را مي توان شبيه به متغير ها دانست اما شئ ها بسيار کامل تر از متغيرها هستند چون آنها مي توانند اطلاعات بيشتري را در خود ذخيره کنند و همچنين تفاوت ديگري هم که با متغيرها دارند اينست که متغيرها بايد تعريف شوند تا جاوااسکريپت آنها را بشناسد اما بعضي از شئ ها در جاوااسکريپت ساخته و تعريف شده اند. اين شئ هاي از قبل تعريف شده را درون ساخت يا Built-in مي گويند مانند شئ Date . البته همانطور که ميدانيد بايد همين اشياء هم در ابتداي کد يکبار ديگر با دستور new تعريف شوند:

mydate = new Date ( )
name = new Array ( )

پس فراموش نکنيد که از اين دستور براي شروع يک object استفاده کنيد.

کليه شئ ها داراي خصوصيات و متدهاي شناخته شده براي جاوااسکريپت هستند که آنها را با گذاشتن يک نقطه بعد از خود شئ بکار مي بريم و مي توانيم مقادير مختلفي را براي آنها در نظر بگيريم.

انواع اشياء:

به غير از شئ هاي درون ساخت Date و Array که در صفحات قبل با آنها آشنا شديد، شئ هاي درون ساخت ديگر جاوااسکريپت عبارتند از شئ String و Math و شئ هايي که مربوط به HTML DOM مي شوند. در بخش هاي بعدي به ترتيب به توضيح هر کدام از اين اشياء خواهيم پرداخت. دستور with

در اين دستور شما مي توانيد يک شئ را به همراه خصوصيات و متدهايش بصورت پيش فرض در اسکريپت خود تعريف کنيد. اين دستور به نوعي کد شما را راحت تر و خلاصه تر مي کند و مانند توابع فقط اسم تعيين شده را در کدها بکار مي بريد که جاوااسکريپت کليه خصوصيات و متدهاي آنرا برايش در نظر خواهد گرفت. قالب دستور with به شکل زير است:

with ( name ) {
  .... javascript code ....
}

روش ساخت يک شئ:

در بالا صحبت از يک سري اشياء شد که جاوااسکريپت از قبل با آنها آشناست اما گاهي اوقات نياز هست که يک شئ را خودتان تعريف کنيد تا بهتر بتوانيد اسکريپت خود را مديريت کنيد. البته توسط دستور with هم مي توانيد اينکار را انجام دهيد، به اين صورت که اسم شئ مورد نظر را بجاي name در الگوي بالا بنويسيد و خصوصيت و متد آنرا در خطوط بعدي بين { } تعريف کنيد.

اما اگر بخواهيد يک شئ را در اسکريپت خود بسازيد نياز به دو چيز داريد، ابتدا يک تابع سازنده که به آن Constructor مي گويند و در آن نوع شئ تعيين مي شود، سپس به نمونه شئ که از آن تابع استفاده مي کند و به آن Instance مي گويند که توسط دستور new تعريف مي شود. اين مطلب ممکن است کمي گيج کننده باشد اما به مثال زير توجه کنيد تا کاملاً به ساخت شئ توسط خودتان تسلط پيدا کنيد.

مي خواهيم يک شئ براي اتومبيل تعريف کنيم که خصوصياتي مانند اسم، رنگ و مدل را داشته باشد. براي اينکار ابتدا يک تابع بايد تعريف کنيم بنام car و خصوصيات آنرا به عنوان پارامترهايش در پرانتز بنويسيم و سپس اين پارامترها را بر اساس خصوصياتش مقداردهي مي کنيم:

function Car ( name, model, color ) {
this.name = name
this.model = model
this.color = color
}

به عبارت this دقت کنيد، اين يک دستور جاوااسکريپت است و به شئ که در حال تعريف آن هستيم، اشاره دارد و در حقيقت به مفسر جاوااسکريپت مي فهماند که اين خصوصيت شئ تعريف شده با اين مقدار است و شما بايد از اين دستور استفاده کنيد تا خصوصيت يک شئ را برايش تعريف کنيد و مقدار آنها را هم مانند بالا مشخص کنيد.

حالا بايد يک شئ جديد براي آن بسازيد که اين شئ جديد را در متغيري بنام mycar ذخيره مي کنيم:

mycar = new Car ( "Corvette", "Z06", "Red" )

اين خط کد به جاوااسکريپت مي فهماند که يک شئ بنام mycar داراي خصوصيات اسم که Corvette و مدل Z06 و رنگ Red مي باشد. شما مي توانيد هر شئ ديگر که بخواهيد با دستور new بسازيد:

thecar = new Car ( "BMW", "Z4", "Silver" )

الان مي خواهيم از شئ اول اسم ماشين و از شئ دوم رنگ را در صفحه چاپ کنيم:

document.write ( mycar.name + "<br />" )
document.write ( thecar.color )

بعد از اينکه خصوصياتي براي يک شئ تعريف کرديد حالا نوبت به متدهاي شئ ساخته شده، مي رسد. در اينجا متدي که تعريف مي کنيم براي کليه ماشينها مي توانيم بکار بريم. الگوي کلي يک متد به شرح زير است:

object.methodname( ) = function_name

object شئ است که ساختيم، methodname نام متدي است که شما در نظر مي گيريد و function name هم اسم تابعي که بايد بسازيد. سپس هر کجا که لازم بود از متد استفاده کنيد ابتدا شئ و سپس با گذاشتن يک نقطه متد را به همراه پرانتز مي نويسيد که اگر اين متد پارامتري هم داشت بايد آنرا داخل پرانتز معين کنيد.

متدي که مي خواهيم براي شئ Car بسازيم را بايد ابتدا بصورت يک تابع تعريف کنيم:

function displaycar ( ) {
var result = " I like " + this.name + " " +  this.model + " with " + this.color + " color."
document.write ( result )
}

حالا با استفاده از دستور this اين تابع را به عنوان متد شئ Car تعريف مي کنيم:

function Car ( name, model, color ) {
this.name = name
this.model = model
this.color = color
this.displaycar = displaycar
}

بعد از تعريف توابع، شئ را توسط دستور new مي سازيم و متد را اجرا مي کنيم:

mycar = new Car ( "Corvette", "Z06", "Red" )
mycar.displaycar ( )

دستور prototype:

در طول اسکريپت شما، ممکن است به جايي برسيد که نياز داشته باشيد يک خصوصيت و يا يک متد ديگر براي شئ ساخته شده در خارج از آن توابع تعريف شود که با استفاده از دستور prototype مي توانيد آنها را تعريف کنيد. الگوي اين دستور به اين صورت مي باشد:

object.prototype.method or property = value

کليه دستورات بالا را توسط توابع و آرايه مي توانيد انجام دهيد اما تعريف کردن شئ در اسکريپت هاي طولاني بسيار راحت تر و سريع تر از نوشتن بقيه دستورات مي باشد.

در صفحات بعدي، با شئ هاي درون ساخت string ، math و همچنين شئ هاي مربوط به HTML DOM آشنا خواهيد شد.

0

شئ رشته يا String:

شئ String يکي ديگر از شئ هاي درون ساخت جاوااسکريپت ميباشد و براي کار کردن روي متنها استفاده مي شود. رشته هاي متني عبارتند از کليه کاراکترهايي که بتوان توسط کيبورد تايپ کرد و تا زماني که اين کاراکترها بين دو علامت " " قرار بگيرند، جاوااسکريپت آنها را در شئ String ذخيره خواهد کرد.

البته شما مي توانيد يک رشته متني را بصورت خيلي ساده در يک متغير ذخيره کنيد و نيازي هم به اين شئ نداشته باشيد، مانند کد زير:

mytxt = "This is a string."

شئ String داراي خصوصيات و متدهايي است که توسط آنها مي توانيد تسلط بيشتري روي رشته هاي متني داشته باشيد.

مطابق تمام اشياء در جاوااسکريپت، ابتدا بايد اين شئ را توسط دستور new تعريف و در يک متغير ذخيره کنيد:

mytxt = new String ( "This is a string." )

** خصوصيت شئ String: ** اين شئ داراي خصوصيت length مي باشد که اشاره به طول يک رشته دارد و توسط اين خاصيت، شما مي توانيد تعداد کاراکترهاي بکار رفته در يک رشته متني را بدست آوريد. توجه داشته باشيد که براي استفاده از خصوصيات و متدهاي اين شئ، تفاوتي نمي کند که شما به چه شکلي يک رشته را تعريف کنيد.

اگر بخواهيم طول شئ بالا را محاسبه کنيم، بايد بصورت زير عمل کنيم:

document.write ( mytxt.length )

بعد از اجراي اين کد بايد عدد 17 در صفحه چاپ شود. ناگفته نماند که جاوااسکريپت فضاي خالي بين کلمات را هم به عنوان يک کاراکتر، محاسبه مي کند. متدهاي شئ String

همانطور که ميدانيد براي تعريف يک متد، ابتدا شئ را نوشته سپس يک نقطه مي گذاريم و متد مورد نظر را به همراه پرانتز مي نويسيم که اگر اين متد پارامتري هم داشت بايد آنرا داخل پرانتز بنويسيم. الگوي کلي تعريف متد براي شئ String بصورت زير است:

object.methodname ( )

اکنون مي پردازيم به معرفي متدهاي اين شئ. دقت کنيد بعضي از اين متدها در مرورگر اينترنت اکسپلورر اجرا نمي شوند. فراموش نکنيد که به سورس کد مثالها هم دقت کنيد.

anchor اين متد رشته را بصورت آنکر در صفحه در مي آورد که کد اچ تي ام ال آن به اين صورت خواهد بود:

<a name="anchor_name" />

** big متن را بصورت ضخيم و بزرگ ذخيره مي کند.**

<script type="text/javascript">
var mytxt="Hello my friends!"
document.write(mytxt.big( ))
</script>

** blink اين متد، متن را بصورت چشمک زن در مي آورد ولي در مرورگر IE اجرا نمي شود. **

<script type="text/javascript">
var mytxt="Hello my friends!"
document.write(mytxt.blink( ))
</script>

bold يک رشته را بصورت bold در مي آورد.

<script type="text/javascript">
var mytxt="Hello my friends!"
document.write(mytxt.bold( ))
</script>

** charAt توسط اين متد، مي خواهيد که بطور مثال کاراکتر پنجم از يک رشته را اعلام کند. دقت کنيد که اولين کاراکتر در يک رشته شماره صفر است.**

<script type="text/javascript">
var str="Hello my friends!"
document.write("The first character is: " + str.charAt(0) + "<br />")
document.write("The second character is: " + str.charAt(1) + "<br />")
document.write("The fifth character is: " + str.charAt(4))
</script>

charCodeAt شماره موقعيت کاراکتر در يک رشته را ميدهيد و جاوااسکريپت يونيکد آن را برميگرداند. اولين کاراکتر مانند بالا صفر ميباشد.

<script type="text/javascript">
var str="Hello my friends!"
document.write("The unicode of first character is: " + str.charCodeAt(0) + "<br />")
document.write("The unicode of second character is: " + str.charCodeAt(1))
</script>

concat دو يا چند رشته را به هم پيوند ميدهد.

<script type="text/javascript" type="text/javascript">
var str1="This is string one."
var str2="This is string two."
document.write(str1.concat(str2))
</script>

fixed متن چاپ شده در صفحه بصورت حروف تايپي خواهد بود.

<script type="text/javascript">
var str="This is a teletype text."
document.write(str.fixed( ))
</script>

** fontcolor تغيير رنگ فونتها که اسم رنگ يا کد هگز را به عنوان پارامتر در پرانتز بايد معين کنيد.**

<script type="text/javascript">
var str="This is a green text."
document.write(str.fontcolor("#00ff00" ))
</script>

fontsize تعيين سايز فونت ها که سايز را بايد در پرانتز بنويسيد.

<script type="text/javascript">
var str="This is a text with 6 font size."
document.write(str.fontsize(6))
</script>

fromCharCode يونيکد را ميدهيد و جاوااسکريپت کاراکتر برميگرداند.

<script type="text/javascript" type="text/javascript">
document.write(String.fromCharCode(1587,1604,1575,1605))
</script>

پایان بخش اول

0

شئ رشته يا String -بخش دوم:

indexOf اين متد دو پارامتر دارد که الگوي آن به صورت زير است:

StringObject.indexOf ( searchvalue, fromindex )

توسط اين متد مي توانيد يک حرف و يا يک کلمه را در داخل يک رشته جستجو کنيد که اگر يک حرف باشد شماره موقعيت آنرا در رشته برميگرداند و اگر کلمه باشد، فقط شماره موقعيت اولين کاراکتر آن کلمه را برميگرداند. اگر هم پيدا نکند عدد منفي يک را برميگرداند. حرف و کلمه مورد نظر براي جستجو را در پارامتر اول بايد معين کنيد و مشخص کردن اين پارامتر هم اجباري است و مي توانيد از جايي که جاوااسکريپت جستجو را بايد شروع کند در پارامتر دوم معين کنيد که اين پارامتر اختياري است. فراموش نکنيد که موقعيت کاراکتر اول هر رشته عدد صفر ميباشد و همچنين حروف بزرگ با حروف کوچک هم فرق دارند.

<script type="text/javascript">

var mytxt = "Hello my friends!"

document.write( mytxt.indexOf("friends") + "<br />")

document.write( mytxt.indexOf("e", 3) + "<br />" )

document.write( mytxt.indexOf("z") )

</script>

italics کاراکترهاي يک رشته به صورت ايتاليک نوشته مي شوند.

<script type="text/javascript">

var mytxt = "This is an italic text."

document.write( mytxt.italics( ) )

</script>

link براي ساختن لينک بکار مي رود.

<script type="text/javascript">

var mytxt = "Free HTML and Web design learning"

document.write( mytxt.link("http://softafzar.net" ) )

</script>

match مانند متد indexOf عمل مي کند با اين تفاوت که هر کلمه را جستجو کنيد، اگر پيدا کند همان کلمه را برميگرداند و اگر پيدا نکند مقدار null برميگرداند.

<script type="text/javascript">

var mytxt = "Hello my friends!"

document.write( mytxt.match("Hello") + "<br />")

document.write( mytxt.match("MY") )

</script>

replace اين متد کاراکترهايي را جستجو مي کند و به محض پيدا کردن اولين کاراکترهاي همانند، کاراکترهاي ديگري را جايگزين مي کند. اين متد داراي دو پارامتر مي باشد، در پارامتر اول کلمه يا کاراکتري که لازم است پيدا شود را مشخص مي کنيد و سپس در پارامتر دوم جايگزين آنرا تعيين مي کنيد. الگوي اين متد به صورت زير است:

Stringobject.replace( /findString/ , "newString" )

اين متد هم مانند بقيه متدها به حروف بزرگ و کوچک حساس است که اگر مي خواهيد جاوااسکريپت تفاوتي قائل نشود بايد به اين صورت عمل کنيد:

Stringobject.replace( /findString/i , "newString" )

اگر مي خواهيد کلمه يا کاراکتر را در کل رشته پيدا و جايگزين کند، بايد به صورت زير عمل کنيد:

Stringobject.replace( /findString/g , "newString" )

در صورت نياز مي توانيد از مخلوط آن دو استفاده کنيد:

Stringobject.replace( /findString/gi , "newString" )

search اين متد فقط در رشته جستجو مي کند و به محض پيدا کردن کلمه مورد نظر عدد موقعيت اولين کاراکتر آن کلمه را بر ميگرداند و اگر پيدا نکند عدد منفي يک را نمايش ميدهد. داراي يک پارامتر هست که کلمه مورد نظر براي جستجو را در آن مشخص مي کنيد و اگر هم مانند مثال بالا حرف i اضافه کنيد از بزرگي و کوچکي حروف صرفنظر مي کند.

Stringobject.search( /findString/i )

slice توسط اين متد مي توانيد يک قسمت از رشته را جدا کنيد. اين متد داراي دو پارامتر ميباشد که پارامتر اول بايد نوشته شود و در آن عدد کاراکتري را که جداسازي از آنجا بايد شروع شود را معين مي کنيد و در پارامتر دوم عدد کاراکتر پاياني را و اگر آنرا مشخص نکنيد جاوااسکريپت تا انتهاي رشته را در نظر ميگيرد.

Stringobject.slice( start, end )

** small اندازه حروف کوچک مي شود.**

<script type="text/javascript" type="text/javascript">

var mytxt = "Welcome to my website!"

document.write( mytxt.small( ) )

</script>

split تبديل يک رشته به آرايه. يعني بين کلمات يک رشته علامت کاما گذاشته و آنها را مانند آرگومان هاي آرايه مرتب مي کند. داراي دو پارامتر است که در پارامتر اول مدل علامت گذاري معين مي شود. اگر از "" استفاده کنيد بدون فاصله، مابين کليه کاراکترهاي رشته، کاما مي گذارد و اگر از " " با فاصله استفاده کنيد، در آن رشته بدنبال فاصله ها مي گردد و علامت گذاري ميکند يعني بين کلمات کاما مي گذارد. در پارامتر دوم هم که اختياري است مي توانيد تعداد تکرار کاما را تعيين کنيد.

<script type="text/javascript" type="text/javascript">

var mytxt = "Welcome to my website!"

document.write( mytxt.split("") + "<br />" )

document.write( mytxt.split(" ") + "<br />" )

document.write( mytxt.split(" ", 2)  )

</script>

strike بر روي رشته خط مي کشد.

<script type="text/javascript" type="text/javascript">

var mytxt = "This is a strike( ) method."

document.write( mytxt.strike( )  )



</script>

sub رشته مورد نظر را پايين تر از خط نشان ميدهد.

<script type="text/javascript" type="text/javascript">

var mytxt = "This is a subscript."

document.write( mytxt.sub( )  )
</script>

sup رشته مورد نظر را بالاتر از خط نشان ميدهد.

<script type="text/javascript" type="text/javascript">

var mytxt = "This is a superscript."

document.write( mytxt.sup( )  )
</script>

substr تقريباً مانند متد slice عمل ميکند که در پارامتر اول عدد کاراکتر را براي شروع جداسازي معين مي کنيد ولي در پارامتر دوم تعداد انتخاب کاراکتر بعد از نقطه شروع را مشخص ميکنيد که اگر آن را ننويسيد تا انتهاي متن انتخاب خواهد شد و اگر مقادير پارامترها را منفي دهيد نقطه شروع از انتهاي رشته تعيين ميشود.

<script type="text/javascript" type="text/javascript">

var mytxt = "Welcome to my website!"

document.write( mytxt.substr(8,5 ) + "<br />" )

document.write( mytxt.substr(14,3 ) )

</script>

toLowerCase کليه حروف انگليسي داخل يک رشته را به حروف کوچک انگليسي تبديل مي کند.

<script type="text/javascript" type="text/javascript">

var mytxt = "WELCOME TO MY WEBSITE!"

document.write( mytxt.toLowerCase( ) )

</script>

toUpperCase کليه حروف تبديل به حروف بزرگ خواهد شد.

<script type="text/javascript" type="text/javascript">
var mytxt = "welcome to my website!"
document.write( mytxt.toUpperCase( ) )
</script>

خب دوستان با کليه متدهاي يک رشته هم آشنا شديد. بعضي از آنها کاربرد زيادي دارند و بعضي از آنها هم شبيه به يکديگر هستند که براي راحتي کار همه آنها بيان شده است. در صفحه بعد مي پردازيم به يکي ديگر از شئ هاي درون ساخت جاوااسکريپت.

0

شئ Math هم يکي ديگر از اشياي درون ساخت جاوااسکريپت است که شامل يکسري مقادير ثابت و همچنين توابعي براي انجام عمليات رياضي در صفحات وب ميباشد.

براي ساختن اين شئ نيازي به دستور new نيست چون اين شئ براي مفسر جاوااسکريپت، کاملاً شناخته شده است.

اين شئ هم مانند بقيه اشياء داراي خصوصيات و متدهايي است که ابتدا به معرفي چند متد پرکاربرد از اين شئ مي پردازيم و سپس با بقيه آنها آشنا خواهيم شد.

** خلق اعداد تصادفي، Random number: ** شئ Math داراي يک متد مفيد براي خلق اعداد تصادفي بنام random است که الگوي آن بصورت زير ميباشد:

Math.random ( )

در متد بالا، جاوااسکريپت بين عدد يک و صفر، يک عددي را انتخاب مي کند که اين عدد اعشاري است.

<script type="text/javascript" type="text/javascript">

document.write(Math.random())

</script>

هرگاه نياز داشتيد که اين متد بين صفر و يک عدد بزرگتر از يک، عدد تصادفي پيدا کند بايد طبق الگوي زير عمل کنيد:

Math.random ( ) * num

که بجاي num عدد مورد نظر را مي نويسيد.

<script type="text/javascript" type="text/javascript">
document.write(Math.random()* 10)
</script>

** گرد کردن اعداد اعشاري:**

همانطور که از اسم اين متد پيداست، براي گرد کردن يک عدد اعشاري استفاده مي شود که البته همين متد را به سه مدل مي توان تعريف کرد:

براي گرد کردن يک عدد اعشاري به عدد صحيح بعد از خود بايد به شکل زير عمل کنيد:

Math.ceil ( num )
<script type="text/javascript" type="text/javascript">
document.write(Math.ceil( 4.25))
</script>

براي گرد کردن يک عدد اعشاري به عدد قبل:

Math.floor ( num )
<script type="text/javascript" type="text/javascript">
document.write(Math.floor( 4.80))
</script>

و براي گرد کردن عدد اعشاري به نزديک ترين عدد:

Math.round ( num )
<script type="text/javascript" type="text/javascript">
document.write(Math.round( 6.49))
</script>

بهتر است براي خلق اعداد تصادفي، اين دو متد گفته شده را با هم ترکيب کنيد تا اعداد صحيح بدست بيايند.

<script type="text/javascript" type="text/javascript">
document.write(Math.round( Math.random( )*10) )
</script>

دو متد ديگر وجود دارد که مي توانند بين اعداد تعيين شده، بزرگترين و کوچکترين عدد را پيدا کنند:

Math.max ( num, num, ... )
Math.min ( num, num, ... )
<script type="text/javascript" type="text/javascript">

document.write( Math.max ( 5, 8, 12 ) + "<br />" )

document.write( Math.min ( 5, 8, 12 ) ) 

</script>

خصوصيات شئ Math

اين شئ داراي خصوصيات و ثابتهايي است که براي محاسبات عمليات پيچيده رياضي بکار مي رود:

Math.E اين خصوصيت مقدار ثابت عدد Euler را بر ميگرداند که تقريباً برابر است با 2.7182 . اين عدد به عدد E معروف است.

Math.PI مقدار ثابت عدد پي که تقريباً برابر است با 3.14

Math.LOG2E لگاريتم عدد Euler بر مبناي دو. تقريباً برابر است با 1.4426

Math.LOG10E لگاريتم E بر مبناي ده. تقريباً برابر است با 0.4342

Math.LN2 لگاريتم دو بر مبناي E. تقريباً برابر است با 0.6931

Math.LN10 لگاريتم ده بر مبناي E. تقريباً برابر است با 2.3025

Math.SQRT2 جذر عدد دو. تقريباً برابر است با 1.4142

Math.SQRT1_2 جذر يک دوم. تقريباً برابر است با 0.7071

توسط اين خصوصيات ديگر لازم نيست که شما اين اعداد را به خاطر بسپاريد و فقط کافي است در صورت نياز، اين خصوصيات را در اسکريپت خود وارد کنيد.

** متدهاي شئ Math: ** متدهايي هم که در زير ليست شده اند، کاربرد کمتري نسبت به متدهاي ذکر شده در ابتداي اين بخش دارند.

abs قدرمطلق بر ميگرداند.

<script type="text/javascript" type="text/javascript">

document.write( Math.abs ( 7 ) + "<br />" )

document.write( Math.abs( -4.67) ) 

</script>

acos آرک کسينوس نقطه x که يک عدد ميان منفي يک و يک بايد باشد؛ خارج از اين اعداد مقدار NaN بر گردانده مي شود. آرک کسينوس عدد يک برابر با صفر است و منفي يک برابر با عدد پي.

<script type="text/javascript" type="text/javascript">

document.write(Math.acos(0.35) + "<br />")

document.write(Math.acos(0) + "<br />")

document.write(Math.acos(-1) + "<br />")

document.write(Math.acos(1) + "<br />")

document.write(Math.acos(2))</script>

asin آرک سينوس نقطه x که يک عدد ميان منفي يک و يک ؛ خارج از آن مقدار NaN بر گردانده مي شود.

<script type="text/javascript" type="text/javascript">

document.write(Math.asin(0.35) + "<br />")

document.write(Math.asin(0) + "<br />")

document.write(Math.asin(-1) + "<br />")

document.write(Math.asin(1) + "<br />")

document.write(Math.asin(2))
</script>

atan آرک تانژانت نقطه x .

<script type="text/javascript" type="text/javascript">

document.write(Math.atan(0.50) + "<br />")

document.write(Math.atan(-0.50) + "<br />")

document.write(Math.atan(5) + "<br />")

document.write(Math.atan(10) + "<br />")

document.write(Math.atan(-5) + "<br />")

document.write(Math.atan(-10))
</script>

atan2 آرک تانژانت زاويه تتا بين دو نقطه x و y .

<script type="text/javascript" type="text/javascript">

document.write(Math.atan2(0.50,0.50) + "<br />")

document.write(Math.atan2(-0.50,-0.50) + "<br />")

document.write(Math.atan2(5,5) + "<br />")

document.write(Math.atan2(10,20) + "<br />")

document.write(Math.atan2(-5,-5) + "<br />")

document.write(Math.atan2(-10,10))
</script>

cos کسينوس يک زاويه را بر ميگرداند.

<script type="text/javascript" type="text/javascript">

document.write(Math.cos(3) + "<br />")

document.write(Math.cos(-3) + "<br />")

document.write(Math.cos(0) + "<br />")

document.write(Math.cos(Math.PI) + "<br />")

document.write(Math.cos(2*Math.PI))
</script>

exp مقدار Ex را بر ميگرداند که E همان عدد ثابت Euler است و x هم يک مقدار عددي.

<script type="text/javascript" type="text/javascript">

document.write(Math.exp(1) + "<br />")

document.write(Math.exp(-1) + "<br />")

document.write(Math.exp(5) + "<br />")

document.write(Math.exp(10) )
</script>

log لگاريتم يک عدد بر مبناي عدد E .

<script type="text/javascript" type="text/javascript">

document.write(Math.log(2.7183) + "<br />")

document.write(Math.log(2) + "<br />")

document.write(Math.log(1) + "<br />")

document.write(Math.log(0) + "<br />")

document.write(Math.log(-1))
</script>

pow اين متد توان را براي يک عدد محاسبه مي کند و داراي دو پارامتر است که در اولي عدد مشخص مي شود و در پارامتر دوم مقدار عددي توان را تعيين مي کنيد.

<script type="text/javascript" type="text/javascript">

document.write(Math.pow(0,0) + "<br />")

document.write(Math.pow(0,1) + "<br />")

document.write(Math.pow(5,3) + "<br />")

document.write(Math.pow(1,10) + "<br />")

document.write(Math.pow(2,3) + "<br />")

document.write(Math.pow(-2,3) + "<br />")

document.write(Math.pow(2,4) + "<br />")

document.write(Math.pow(-2,4) )

</script>

sin سينوس يک مقدار عددي را محاسبه مي کند.

<script type="text/javascript" type="text/javascript">

document.write(Math.sin(3) + "<br />")

document.write(Math.sin(-3) + "<br />")

document.write(Math.sin(0) + "<br />")

document.write(Math.sin(Math.PI) + "<br />")

document.write(Math.sin(Math.PI/2))
</script>

sqrt جذر يک عدد را برمي گرداند.

<script type="text/javascript" type="text/javascript">

document.write(Math.sqrt(0) + "<br />")

document.write(Math.sqrt(1) + "<br />")

document.write(Math.sqrt(9) + "<br />")

document.write(Math.sqrt(0.64) + "<br />")

document.write(Math.sqrt(-9))
</script>

tan عددي بر مي گرداند که نشان دهنده تانژانت يک زاويه است.

<script type="text/javascript" type="text/javascript">

document.write(Math.tan(0.50) + "<br />")

document.write(Math.tan(-0.50) + "<br />")

document.write(Math.tan(5) + "<br />")

document.write(Math.tan(10) + "<br />")

document.write(Math.tan(-5) + "<br />")

document.write(Math.tan(-10))
</script>
0

قسمت مقدماتي آموزش جاوااسکريپت به پايان رسيد و همانطور که مشاهده کرديد دستورات اين زبان، توضيح داده شد تا با استفاده از آنها بتوانيد اسکريپتهايي براي صفحات وب خود بنويسيد و يا اگر با اسکريپتي برخورد کرديد، کاملاً آنرا درک کنيد و مطابق نياز خود آن را اصلاح کنيد. فراموش نکنيد که اين دستورات و کدها را مرتب تمرين کرده و اسکريپتهاي جديد و ساده براي خود بسازيد تا اين زبان در ذهن شما قرار گيرد. بهترين راه به خاطر سپردن دستورات جاوااسکريپت خلق کدهايي براي خودتان و ديگران است.

هرگاه خواستيد که اسکريپتي خلق کنيد، ابتدا آنرا در ذهن خود بررسي کنيد که اين اسکريپت چه کاري بايد انجام دهد و چه نتيجه اي را مي خواهيد از آن بگيريد، سپس افکارتان را روي کاغذ پياده کنيد با جزئيات کامل که چه اطلاعاتي را بايد دريافت کنيد و توسط چه دستوراتي آنرا پيش ببريد و در آخر چه نتيجه اي بايد بدهد.

هنگام خلق يک اسکريپت نکاتي را بايد در نظر داشته باشيد:

بعد از هر خط علامت ; را بگذاريد تا پايان آن خط مشخص شود.

document.write ( " text string " );
document.write ( myFunction ) ;

جاوااسکريپت case sensetive است يعني به حروف کوچک و بزرگ حساس است و بين آنها فرق مي گذارد. در جاوااسکريپت myFunction با myfunction تفاوت دارد.

دقت کنيد کليه علامتها مانند پرانتز، آکلاد و کروشه در هر جا که مي نويسيد بايد دوباره آنها را ببنديد.

( { [ ..... ] } )

جاوااسکريپت فاصله هاي اضافي را در نظر نمي گيرد، پس شما مي توانيد براي خوانا بودن کد خود فاصله هايي را اضافه کنيد. دو خط زير تفاوتي با هم ندارند:

var name="value";
var name = " value " ;

در نظر داشته باشيد که يک خط کد جاوااسکريپت حتماً بايد در يک خط نوشته شود و نمي توانيد ادامه آنرا در خط بعدي بنويسيد، مگر اينکه به انتهاي صفحه برسيد و خود به خود به ابتداي خط بعد هدايت شويد. اما در ميان رشته هاي متني با گذاشتن علامت \ مي توانيد به خط بعد رفته و ادامه دهيد.

document.write ( " Hello \
my friends! " ) ;

شما مي توانيد جلوي کدهاي خود يک توضيح و يا يک نظريه را وارد کنيد تا براي مراجعتهاي بعدي يک سر نخي داشته باشيد و سريع متوجه بشويد که آن قسمت از اسکريپت، چه کاري را انجام مي دهد و يا اينکه شما يک اسکريپت براي يک فرد مبتدي مي سازيد و مي خواهيد بعضي از قسمتهاي کد را توضيح دهيد که براي اين منظور ها مي توانيد در هر خط از اسکريپت که مي خواهيد علامت // گذاشته و سپس آن توضيح را بنويسيد.

document.write( " text " ) ;   //  your comment

اگر هم نظريه يا توضيح شما بيشتر از چند کلمه است مي توانيد به صورت زير عمل کنيد:

/* This is a comment
block. It contains
several lines */

لازم بذکر است که اين توضيحات و نظريات در صفحه نمايش داده نمي شوند.

در حال حاضر کليه مرورگرها از جاوااسکريپت پشتيباني مي کنند ولي بعضي ممکن است از مرورگرهاي قديمي استفاده کنند و يا مرورگرهايي که قابليت جاوااسکريپت را نداشته باشند، بکار برند. در اين حالت شما يک تگ بعد از مجموعه اسکريپت خود به تگهاي اچ تي ام ال صفحه اضافه مي کنيد به اسم noscript و متني را داخل آن مي نويسيد تا به آن کاربر نشان داده شود و کاربر از کدهاي جاوااسکريپت آن صفحه با خبر شود.

<script language="javascript" type="text/javascript">
javascript code......
</script>

<noscript> Your browser does not support javascript.</noscript>

خوش آمدید

برای طرح سوال، ایجاد بحث و فعالیت در سایت نیاز است ابتدا وارد حساب کاربری خود شوید. در صورتی که هنوز عضو سایت نیستید میتوانید در عرض تنها چند ثانیه ثبت نام کنید.

لطفا ابتدا لاگین کنید