آموزش طراحی سایت-آموزش متغیرها در جاوا اسکریپت

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

• قسمت اول آموزش جاوا اسکریپت
• آموزش Syntax متغیرها در جاوا اسکریپت
• کلید واژه های جاوا اسکریپت
• آموزش عملگرهای جاوا اسکریپت
• آموزش کلیدواژه های جاوا اسکریپت
• آموزش توضیحات در جاوا اسکریپت

حال با ادامه دوره آموزش طراحی سایت همراه باشید

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

متغیرها Variables ظرف هایی برای ذخیره ی مقادیر داده ها (data values) محسوب می شوند.
در این مثال x، y و z هر سه متغیر هستند.

مثال:

var x = 5;

      var y = 6;

      var z = x + y;

      document.getElementById(&quotdemo&quot) = z;

از مثال بالا می توانیم نتیجه بگیریم.
X مقدار 5 را درخود ذخیره می کند.
Y مقدار 6 را ذخیره می کند.
Z مقدار 11 را نگه می دارد.
در این مثال price1، price2 و total هر سه متغیر هستند.

مثال:

< script >

    var price1 = 5;

    var price2 = 6;

    var total = price1 + price2;

    document.getElementById(&quotdemo&quot) =

    &quotThe total is: &quot + total;

< /script >

در برنامه نویسی، درست مثل جبر، برنامه نویس به منظور ذخیره سازی مقادیر از متغیرها استفاده می کند (مانند price1 که مقدار 5 را نگه می دارد).
در برنامه نویسی، مانند جبر، متغییرها را در عبارات (expression) بکار می بریم (total = price1 + price2).
از مثال بالا می توان حاصل متغیر سوم را محاسبه کرد که 11 می باشد.

شناسه های جاوا اسکریپت در آموزش طراحی سایت

تمامی متغیرهای جاوا اسکریپت را باید با اسم های منحصر به فرد شناسایی کرد.
این اسامی منحصر به فرد / identifier شناسه اطلاق می گردند (نامیده می شوند).
شناسه ها می توانند اسم های کوتاه (مثل x و y) یا کلمات توصیفی از قبیل age، sum، totalVolumeباشند.
قوانین کلی برای ساخت اسامی ویژه ی متغیرها به شرح زیر هستند.

1. در اسامی متغیرها می توان از حروف، اعداد، خط های زیرین (underscore_) و همچنین علامت دلار استفاده کرد.
2. اسم متغیر حتماً باید با یک حرف آغاز شود.
3. اسم همچنین می تواند با علامت های $ و _ آغاز شود.
4. اسامی متغیرها به کوچک و بزرگی حروف حساس هستند.(به عنوان مثال y و Y با هم تفاوت دارند)
5. کلمات رزرو یا ذخیره شده (reserved words) مانند کلید واژه های جاوا اسکریپت را نمی توان به عنوان اسم بکار برد.

نکته:

شناسه ها در جاوا اسکریپت به کوچک بزرگی حروف حساس هستند.

عملگر جایگزین (Assignment Operator)

در زبان جاوا اسکریپت، علامت مساوی (=) یک عملگر جایگزین (تخصیص مقدار) محسوب می شود و نه یک عملگر مساوی مانند ریاضی (برابر با).
مثال زیر در علم جبر هیچ معنا و کاربردی خاصی ندارد.

x = x + 5‎

اما همین نمونه در جاوا اسکریپت کاملاً استاندارد و متعارف تلقی می گردد : مقدار x + 5 را به x تخصیص می دهد.
(مقدار x + 5 را محاسبه کرده و نتیجه را در x قرار می دهد. مقدار x به اندازه ی 5 افزایش می یابد.
عملگر مساوی در جاوا اسکریپت اینگونه نوشته می شود : ==.

نوع داده در جاوا اسکریپت (data type)

متغیرها در جاوا اسکریپت قادر هستند مقادیر عددی و همچنین مبتنی بر نوشته مانند 100 و "John Doe" را در خود ذخیره کنند.
در برنامه نویسی، مقادیر مبتنی بر متن/ text values، رشته های متنی (text strings) خوانده می شوند.
جاوا اسکریپت می تواند نوع داده های مختلفی را پذیرفته و مدیریت کند، اما فعلاً به همان نوع های عددی و رشته ی بسنده می کنیم.
رشته (string) داخل علامت های " " یا ' ' قرار داده می شوند. اعداد بدون علامت نقل و قول نوشته می شوند.
در صورت قرار دادن علامت نقل و قول اطراف یک عدد، با آن به عنوان یک رشته ی متنی (text string) برخورد می شود.

مثال:

var pi = 3.14;

var person = &quotJohn Doe&quot

var answer = 'Yes I am!';

ایجاد (تعریف) متغیر در جاوا اسکریپت در آموزش طراحی سایت

اعلان یا تعریف یک متغیر در برنامه نویسی همان فرایند ایجاد متغیر است.
متغیر را در زبان جاوا اسکریپت با استفاده از کلید واژه ی var تعریف می کنیم

var carName; ‎

پس از تعریف، متغیر تهی است و هیچ مقداری ندارد.
به منظور تخصیص / assign یک مقدار به متغیر دلخواه کافی است از علامت = استفاده کنید.

carName = &quotVolvo&quot‎

همچنین می توان مقداردهی یک متغیر را هنگام تعریف آن انجام داد.

var carName = &quotVolvo&quot‎

در مثال زیر، متغیری به نام carName ایجاد کرده و "Volvo" را به عنوان مقدار به آن تخصیص داده ایم، سپس مقدار را داخل یک پاراگراف HTML با شناسه ی "demo"به عنوان خروجی قرار می دهیم.

مثال:

< script >

    var carName = &quotVolvo&quot

    document.getElementById(&quotdemo&quot) = carName;

< /script >

توصیه می شود تمامی متغیرها را در ابتدای اسکریپت تعریف کنید.

تعریف متغیرهای متعدد در تنها یک دستور

این امکان وجود دارد که چندین متغیر را در یک دستور واحد ایجاد کنید.
کافی است دستور را با کلید واژه ی var آغاز کرده و متغیرها را با ویرگول از هم جدا کنید

< script >

    var person = &quotJohn Doe&quot, carName = &quotVolvo&quot, price = 200;

    document.getElementById(&quotdemo&quot) = carName;

< /script >

یک تعریف (declaration) همچنین می تواند چندین خط ادامه داشته باشد (پوشش داده یا دربرگیرد).

< script >

    var person = &quotJohn Doe&quot,

    carName = &quotVolvo&quot,

    price = 200;

    document.getElementById(&quotdemo&quot) = carName;

< /script >

Value = undefined

در برنامه های رایانه ی، متغیرها اغلب بدون یک مقدار مشخص تعریف می شوند. مقدار می تواند چیزی باشد که باید آن را تعریف یا اعلان کرد و یا چیزی که بعده ها ارائه می گردد مانند ورودی کاربر (user input).
متغیری که بدون مقدار معینی اعلان شود، مقدار آن undefined خواهد بود.
متغیر carName پس از اجرای این دستور مقدار تعریف نشده یا undefined را خواهد داشت.

مثال:

< script >

    var carName;

    document.getElementById(&quotdemo&quot) = carName;

< /script >

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

در صورت تعریف مجدد یک متغیر جاوا اسکریپت، به خاطر داشته باشید که متغیر مقدار خود را از دست نخواهد داد.
متغیر carName هنوز مقدار اولیه ی خود "Volvo" را پس از اجرا این دستورات حفظ خواهد کرد.

مثال:

< script >

    var carName = &quotVolvo&quot

    var carName;

    document.getElementById(&quotdemo&quot) = carName;

< /script >

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

می توان در جاوا اسکریپ با متغیرها و به وسیله ی عملگرهای = و + محاسبات انجام داد.

مثال:

< script >

    var x = 5 + 2 + 3;

    document.getElementById(&quotdemo&quot) = x;

< /script >

همچنین می توان رشته ها را در محاسبه بکار برد، اما باید توجه داشته باشید که رشته ها به هم متصل یا الحاق می شوند.

مثال:

< script >

    var x = &quotJohn&quot + &quot &quot + &quotDoe&quot

    document.getElementById(&quotdemo&quot) = x;

< /script >

مثالی دیگر

< script >

    var x = &quot5&quot + 2 + 3;

    document.getElementById(&quotdemo&quot) = x;

< /script >

توجه:

در صورت افزودن عدد به رشته، باید توجه داشته باشید که عدد یک رشته محسوب می شود و از این رو به رشته الحاق می گردد (concatenation).

آموزش عملگرهای محاسباتی جاوا اسکریپت

آن دسته از عملگرهای جاوا اسکریپت که برای محاسبه بکار می روند به ترتیب زیر هستند.

عملگرهای محاسباتی

یک عملیات محاسباتی متعارف روی دو عدد عملیات لازمه را انجام می دهد .
حال این دو عدد ممکن است لیترال (literal) باشند.

مثال:

var x = 100 + 50;‎

و یا متغیر باشند.

var x = a + b;‎

یا عبارت مانند مثال زیر

var x = (100 + 50) * a;‎

عملوندها (operands) و عملگرها (operators)

اعداد (در عملیات حسابی) عملوند operand / خوانده می شوند . عملیات که بین دو عملوند صورت می گیرد توسط operator / عملگر تعریف می شود .

عملگر جمع addition operator / اعداد را جمع می بندد.

جمع

< script >

    var x = 5;

    var y = 2;

    var z = x + y;

    document.getElementById(&quotdemo&quot) = z;

< /script >

عملگر تفریق subtraction / اعداد را منها (از هم کسر) می کند.

تفریق

< script >

    var x = 5;

    var y = 2;

    var z = x - y;

    document.getElementById(&quotdemo&quot) = z

< /script >

عملگر ضرب multiplication / (*) اعداد را در هم ضرب می کند.

ضرب

var x = 5;

var y = 2;

var z = x * y;

document.getElementById(&quotdemo&quot) = z;

عملگر تقسیم (/)(division) اعداد را بر هم تقسیم می کند.

تقسیم

var x = 5;

var y = 2;

var z = x / y;

document.getElementById(&quotdemo&quot) = z;

عملگر modular (%) باقی مانده ی تقسیم را برمی گرداند.

باقی مانده ی تقسیم

                               var x = 5;

var y = 2;

var z = x % y;

document.getElementById(&quotdemo&quot) = z;

عملگر افزاینده / (++) اعداد را یک واحد افزایش می دهد.

کاهش

var x = 5;

x++;

var z = x;

document.getElementById(&quotdemo&quot) = z;

اولویت عملگرها

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

مثال:

var x = 5;

x--;

var z = x;

document.getElementById(&quotdemo&quot) = z;

آیا نتیجه ی مثال بالا برابر است با 150 * 3 یا 100 + 150؟
آیا عملیات جمع اول انجام می شود یا ضرب؟
عملیات ضرب درست مشابه ریاضیاتی که در مدرسه آموختیم بر دیگر عملیات از جمله جمع تقدم دارد .
عملگر ضرب (*) و تقسیم (/) بر جمع (+) و تفریق (-) تقدم دارند .
همان طور هم که در مدرسه آموختیم که با استفاده از پرانتز می توان ترتیب اولویت را تغییر داد.

مثال:

< script >

    document.getElementById(&quotdemo&quot) = 100 + 50 * 3;

< /script >

عملیاتی که در پرانتز قرار می گیرند، اول محاسبه می شوند .
هنگامی که عملیات زیادی وجود دارد که دارای اولویت یکسان می باشند(مانند جمع و تفریق که از نظر اولویت با هم برابر هستند)، عملیاتی از این دست از چپ به راست محاسبه می شوند.

مثال:

< script >

    document.getElementById(&quotdemo&quot) = (100 + 50) * 3;

< /script >

اولویت عملگرهای محاسباتی

جدول زیر کلیه ی عملگرهای محاسباتی جاوا اسکریپت را به ترتیب اولویت فهرست می کند.

عبارات داخل پرانتز کاملاً پیش از اینکه مقدار در بقیه ی عبارت بکار گرفته شود محاسبه می گردد.

دوره آموزش طراحی سایت ادامه دارد