بررسی متغیر جاوا اسکریپت
هر زبان برنامه نویسی دارای قوانین و قواعد خاص خود است. جاوا اسکریپت نیز دارای مفاهیم و قواعدی است که برنامه نویسان جاوا اسکریپت باید آن ها را بیاموزند و مفاهیم آن را درک کنند. یکی از مهمترین مفاهیمی که باید به خوبی درک شود متغیر جاوا اسکریپت است. استفاده از متغیر جاوا اسکریپت دارای قواعد نوشتاری و نحوی خاص جاوا اسکریپت است که باید رعایت شوند.(توصیه می شود دوره آموزشی طراحی سایت و پکیج آموزش طراحی سایت را مشاهده کنید)
همانطور که گفته شد فقط آشنا بودن با کد ها کافی نیست و باید درک درستی از مفاهیم دستوراتی که توسط کد صادر می کنید داشته باشید. به همین دلیل امروز به بررسی متغیر جاوا اسکریپت خواهیم پرداخت. در ابتدا کمی بیشتر با مفهوم متغیر آشنا می شویم.
هر آنچه باید در مورد متغیر ها بدانید
تعریف های متفاوتی وجود دارد اما متغیر در زبان برنامه نویسی عنصری است که در طی روند برنامه نویسی در چند موقعیت مختلف و با مقادیر مختلف مورد استفاده قرار می گیرد. متغیر در Variable به نوعی همان چیزی است که قرار است تغییر و تحول بر روی آن انجام بگیرد تا نتیجه کار به دست آید. درک این مفهوم برای شروع برنامه نویسی جاوا اسکریپت بسیار مهم است.
مفهوم متغیر جاوا اسکریپت
متغیر جاوا اسکریپت به همان مفهومی که در بالا اشاره کردیم به کار گرفته می شود. متغیر جاوا اسکریپت را با var که از همان variable به زبان انگلیسی برداشت شده است. متغیر جاوا اسکریپت دارای مقادیری است که تعیین کننده وضعیت آن هستند. برای نشان دادن مقدار متغیر در جاوا اسکریپت می توان از مقادیر عددی، string یا رشته ای و Boolean استفاده کرد. به مثال زیر توجه کنید:
1 |
var lang = 'fa'; |
همانطور که می بینید مقادیر را با = بر متغیر اعمال می کنند. در زبان برنامه نویسی رعایت نکات ریز بسیار مهم است. برای مثال اگر مقادیر درون نقل قول قرار بگیرند ( فرقی نمی کند ” یا ‘) به عنوان مقادیر رشته ای محاسبه خواهند شد. اگر ما یک عدد را هم درون نقل قول قرار دهیم باز هم به صورت رشته ای خواهد بود و دیگر مقدار عددی آن محاسبه نخواهد شد.
تفاوت جمع عددی و رشته ای متغیر جاوا اسکریپت
حالا برای روشن شدن این موضوع باید توضیح بدهیم که این دو چه فرقی با هم دارند. در مقادیر رشته ای یا string مقادیر با هم جمع نمی شوند بلکه در کنار هم قرار می گیرند و مانند یک رشته در می آیند. به مثال زیر دقت کنید:
1 2 3 4 5 6 |
<script type="text/javascript"> var num_1 = '2'; var num_2 = '1'; var result = num_1 + num_2; alert(result); </script> |
نتیجه چنین کدی ۲۱ خواهد بود ولی اگر نقل قول را برداریم :
1 2 3 4 5 6 |
<script type="text/javascript"> var num_1 = 2; var num_2 = 1; var result = num_1 + num_2; alert(result); </script> |
نتیجه جمع دو عدد قبلی و عدد ۳ خواهد بود.
خوب حالا کمی مثال خود را کاربردی تر می کنیم. علامت + می تواند متغیر های جاوا اسکریپت را با هم جمع کند. اما جمع عددی یا رشته ای بستگی به این دارد که از نقل قول استفاده کرده باشیم یا نه . مثال زیر شامل سه متغیر مختلف است. با استفاده از جمع رشته ای این سه متغیر ما می توانیم آن ها را به صورت مختصر و در یک خط کد جمع کنیم. این کار می تواند در زمان سر و کار داشتن با چند متغیر که به هم مربوط اند بسیار مفید باشد:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>وبگو | تعریف و استفاده از متغیرها در جاوا اسکریپت</title> <!-- Webgoo.ir --> <style type="text/css"> body{ font-family:Tahoma, Geneva, sans-serif; text-align:justify; font-size:12px; direction:rtl; } </style> <script type="text/javascript"> var name, family, age; name = 'your name'; family = 'your family'; age = 22; document.write('Name: ' + name + ' | Family: ' + family + ' | Age: ' + age); </script> </head> <body> <noscript> جاوا اسکریپت در مرورگر شما غیر فعال است! </noscript> <hr> به کمک عملگر جمع (+) در جاوا اسکریپت می توانیم متغیرهای رشته ای را با متغیرهای عددی ترکیب کنیم. </body> </html> |
مقادیر Boolean
شما علاوه بر مقادیر رشته ای و عددی می توانید از مقادیر Boolean استفاده کنید. در Boolean دو مقدار وجود دارد : true و false. صرفا برای آشنایی شما با این مقادیر از مثال زیر استفاده می کنیم.
1 2 3 4 |
<script type="text/javascript"> var test = true; alert('var type is: ' + typeof(test) + ', var value is: ' + test); </script> |
مفهوم scope متغیر جاوا اسکریپت
هر متغیر جاوا اسکریپت دارای حدود دسترسی یا scope مشخصی است که در زمان برنامه نویسی جاوا اسکریپت باید به آن ها توجه کنیم. برای مشخص کردن scope ما از دو دسته بندی local و global استفاده می کنیم. این دو دسته بندی میزان دسترسی متغیر به قسمت های مختلف برنامه را مشخص می کند. متغیر های local فقط درون توابع معنی پیدا می کنند و فقط درون توابع قابل دسترسی هستند. در مقابل متغیر های global در تمام قسمت های یک برنامه تعریف می شوند و قابل دسترسی هستند. برای آشنایی شما با این مفهوم از مثال زیر استفاده کرده ایم:
1 2 3 4 5 6 7 8 9 10 |
<script type="text/javascript"> function func1(){ var test = 1; } function func2(){ alert(test); } func1(); func2(); </script> |
زمانی که از این کد استفاده کنید متوجه می شوید که متغیر test به درستی تعریف نشده و دسترسی به آن امکان پذیر نیست. زیرا ما متغیر test را برای function1 تعریف کرده ایم. با این کار این متغیر local خواهد بود و نمی توان در fuction2 آن را فراخوانی کرد. برای global کردن یک متغیر آن را باید خارج از تابع تعریف کنیم.به کد زیر توجه کنید
1 2 3 4 5 6 7 8 9 10 11 |
<script type="text/javascript"> var test; function func1(){ test = 1; } function func2(){ alert(test); } func1(); func2(); </script> |
جمع بندی
در این مقاله با هم متغیر جاوا اسکریپت را بررسی کردیم و با مفهوم متغیر، مقادیر و scope نیز آشنا شدیم. اگر جزو افرادی هستید که به تازگی شروع به یادگیری زبان جاوا اسکریپت کرده اید این مقاله می تواند کمک خوبی برای شما باشد تا با دید بهتری وارد دنیای جاوا اسکریپت شوید.
منبع : طراحی سایت