Java Script

بخش اول

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

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

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

 

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

 

 

                                                                                                                                                                

 

تفاوت جاوااسکریپت با جاوا

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

 

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

 

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

 

 

 

 

 

 

 

 

قابلیتهای جاوااسکریپت

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

 

 

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

 

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

 

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

 

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

آغازاسکریپت نویسی

 

 

تگ اسکریپت

جاوااسکریپت هم مانند زبان 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 است. به عبارت ساده این خط می گوید که آن شئ را بردار و در آن توسط متد نوشتن چیزی بنویس.

 

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

 

 

 

 

csr

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

 

 

 

                                                                                                                                                            

                                                                                                                                                                   <html> 

              

                                                                                                                                                                  <head> 

                                                                                                                                                                                 

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

                                                                                                                                                               < /script>

                                                                                                                                                                 < /head>  

 

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

 

پیغامهای خطا در جاوااسکریپت

 

 

چگونگی دریافت پیغام خطا

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

 

توجه داشته باشید، در نسخه های جدید مرورگر اینترنت اکسپلورر این پنجره مشاهده نمیشود و ابتدا آنرا باید فعال کنید. برای فعال کردن آن به منوی 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/javascri pt>                            

    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 است که آدرس فایل اچ تی ام ال است که در آن خطا تولید شده است.

 

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

 

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

در کجا باید کدهای جاوااسکریپت را نوشت

 

 

در حال حاضر شما میدانید که برای اجرا شدن کدهای جاوااسکریپت باید آنها را در میان تگهای اچ تی ام ال بکار برید. شاید این سؤال برایتان پیش بیاید که در کجا باید آنها را بنویسید، آیا جای خاصی دارند یا در هر کجا می توانید اینکار را انجام دهید. کدهای جاوااسکریپت می توانند در هر کجای سورس کد باشند اما باید ابتدا تشخیص دهید که بکاربردن هر قسمت از اسکریپت در کجا مناسب تر می باشد. بطور کل کدهای جاوااسکریپت به سه دسته تقسیم میشوند، یک سری از آنها در قسمت سر یعنی 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 آدرس دقیق آنرا بنویسید.

 

متغیرها در جاوااسکریپت

 

متغیر چیست؟

متغیرها یکی از مباحث مهم در جاوااسکریپت هستند چون کاربرد زیادی در این زبان دارند. متغیرها یا 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 آن متغیر گفته می شود.

 

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

 

تاریخ و زمان در جاوااسکریپت

 

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

 

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

 

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

 

شما دقیقاً درساعت 17:42:16 وارد این صفحه شدید.

 

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

                                                                                                                                                              

 

<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 تنظیم شده است.

 

Sun Jan 6 17:42:16 UTC+0330 2008

 

  

 

 

 

 

 

                                                                                                                                                                       

 

عملگرها در جاوااسکریپت

 

عملگر چیست؟  

 

 

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

 

 

 

انواع عملگرها

 

عملگرها در جاوااسکریپت به چند دسته تقسیم می شوند:

 

عملگرهای ریاضی یا Arithmetic Operators: این نوع عملگرها چهار عمل اصلی در ریاضی را انجام می دهند. علاوه بر آنها یک عملگر وظیفه نمایش خارج قسمت یک تقسیم را بعهده دارد و دو عملگر دیگر هر کدام به ترتیب یک واحد اضافه و یک واحد کم می کنند که در جدول زیر مشخص شده اند.

 

نتیجه مثال توصیف عملگر

 4  x = 2, y = 2

 x+y

  جمع +

2  x = 5 , y = 3

 x - y  تفریق -

20  x = 5 , y = 4

 x * y  ضرب *

5  x = 20 , y = 4

 x / y  تقسیم /

3  x = 19 , y = 4

 x % y  خارج قسمت %

x = 6  x = 5

 x++  افزودن ++

x = 4  x = 5

 x--  کم کردن --

 

 

 

عملگرهای زیر به نام Assignment Operators معروف هستند که یک مقداری را به یک متغیر نسبت می دهند.

 

برابر است با مثال عملگرها

 x = y  x = y =

 x = x + y  x + = y + =

 x = x - y  x - = y - =

 x = x * y  x * = y * =

 x = x / y  x /= y /=

 x = x % y  x %= y %=   

 

 

 

 

عملگرهای مقایسه ای: این نوع عملگرها مقدارهای دو متغیر را با هم مقایسه می کنند و نتیجه این مقایسه یا درست است یا غلط که در دستورات شرطی جاوااسکریپت بسیار کاربرد دارند.

 

مثال توصیف عملگرها

 x = 5 , y = 5

 x == y  مقادیر اگر برابر باشند نتیجه درست خواهد بود.

 ==

 x = 5

 y = "5"

 x === y  مقایسه بین مقادیر و جنس متغیر که در مثال روبرو نتیجه غلط بازگردانده می شود ===

 5 != 8  اگر مقادیر برابر نباشند نتیجه درست است !=

 8 > 5  بزرگتر >

 8 < 10  کوچکتر <

 5 >= 8  بزرگتر یا مساوی که در این مثال نتیجه غلط است >=

 5 <= 8  کوچکتر یا مساوی که در این مثال نتیجه درست است <=

 

 

 

عملگرهای منطقی: در این مدل سه نوع عملگر وجود دارند که در حقیقت یک یا چند نتیجه را بررسی می کنند و جواب را بازمی گردانند. این عملگرها به این شکل می باشند:

 

&& , || , !

 

عملگر && در حقیقت مانند حرف اضافه " و " در فارسی عمل می کند:

x = 5

y = 3

( x < 10 && y > 1)

 

در اینجا اگر مقدار متغیر x کوچکتر از عدد 10 باشه و y بزرگتر از 1 باشه، نتیجه true بازگردانده می شود. چون حرف و آمده است پس باید دو طرف عملگر جواب درست باشد تا در مجموع نتیجه درست در بیاید.

 

عملگر || مانند کلمه " یا " در فارسی است:

 

x = 6

y = 3

( x == 5 || y == 5 )

 

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

 

( x == 5 || y < 5 )

 

عملگر ! در حقیقت یک عملیات و معادله را بررسی می کند اگر جواب آن معادله درست نباشد نتیجه true یا همان درست را برمیگرداند:

 

x = 5

y = 4

! ( x == y )

 

 

                                                                                                                                                              

 

در اینجا در کل نتیجه درست است. حالا ببینیم که چه اتفاقی افتاده است، اول یک نگاهی به داخل پرانتز بیاندازید. شرط درستی در این است که x برابر با y باشد، اما اینچنین نیست چون مقادیر با هم متفاوت هستند ولی چون عملگر ! آمده است پس شرط درستی در اینست که نتیجه داخل پرانتز غلط باشد چون گاهی اوقات ما نیاز داریم که در اسکریپت دو چیز را با هم مقایسه کنیم و اگر نتیجه غلط بود ادامه دهیم که این علامت بکار ما می آید.