JavaScript Variables

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

متغیرهای جاوا اسکریپت نگهدارنده‌ای برای ذخیره مقادیر داده هستند. در مثال زیر متغیرهای y, x و z با استفاده از کلید واژه var تعریف شده‌اند.


<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Variables </h2>
    <p> In this example, x, y, and z are variables. </p>
    <p id = "demo"> </p>
    <script>
      var x = 5;
      var y = 6;
      var z = x + y;
      document.getElementById("demo").innerHTML =
      "The value of z is: " + z;
    </script>
  </body>
</html>

خروجی:

در کد بالا:

  • x مقدار 5 را ذخیره می‌کند.
  • y مقدار 6 را ذخیره می‌کند.
  • z مقدار 11 را ذخیره می‌کند.

قبل از سال 2015 و معرفی ES6 تنها راه تعریف متغیر در جاوا اسکریپت کلید واژه var بود. اما در سال 2015 و با معرفی نسخه جدید جاوا اسکریپت می‌توان از دو کلید واژه const و let هم برای تعریف متغیر استفاده کرد. از آنجا که ممکن است در ابتدای یادگیری جاوا اسکریپت بیان تفاوت بین این کلید واژه‌ها دشوار باشد، در قسمت اول این آموزش بیشتر از var استفاده می‌کنیم.

جدا از رعایت قوانین نامگذاری متغیرها که در بخش نحوه نوشتار در جاوا اسکریپت بحث شد، نکته مهم دیگری که باید در نامگذاری متغیرها به یاد داشته باشید این است که سعی کنید نام متغیر با کاربرد آن همخوانی داشته باشد. به عنوان مثال اگر متغیر شما قیمت کالایی را در خود ذخیره می‌کند می‌توانید از price برای نام آن استفاده کنید. یا اگر مقدار سرعت متحرکی را ذخیره می‌کند velocity می‌تواند نام با مسمایی باشد. با این روش کد خواناتر خواهد بود. در آخر به یاد داشته باشید که کلمات رزرو شده (مانند کلید واژه‌های جاوا اسکریپت) را نمی‌توانید به عنوان اسم متغیر انتخاب کنید.

عملگر مساوی

در جاوا اسکریپت علامت مساوی (=) یک عملگر "تخصیص" (assignment) است نه یک عملگر "برابر است با" (equal to). برای درک موضوع به کد زیر دقت کنید:

x = x + 5

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


<!DOCTYPE HTML>
<html>
  <body>
    <h2> The Assignment Operator </h2>
    <p id = "demo"> </p>
    <script>
      var x = 10;
      x = x + 5;
      document.getElementById("demo").innerHTML = x;
    </script>
  </body>
</html>

خروجی:

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

متغیرهای جاوا اسکریپت می‌توانند انواع داده نظیر اعداد و یا مقادیر متنی مثل "John Doe" را در خود ذخیره کنند. در زبان برنامه نویسی مقادیر متنی را متغیرهای رشته‌ای (string) می‌نامند. مقادیر رشته‌ای را داخل علامت " " و یا ' ' می‌نویسند. اگر عددی را داخل این علامت‌ها بنویسید آنگاه جاوا اسکریپت آن عدد را به عنوان متن می‌بیند و نه عدد.


var pi = 3.14;
var person = "John Doe";
var answer = 'Yes I am!';

همان طور که در ابتدای این صفحه مشاهده کردید می‌توانیم نظیر ریاضی با متغیرهای جاوا اسکریپت هم اعمال حسابی را توسط عملگرهایی نظیر + و یا = انجام دهیم. به 4 مثال زیر دقت کنید.

مثال 1:

<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Variables </h2>
    <p> The result of adding 5 + 2 + 3: </p>
    <p id = "demo"> </p>
    <script>
     var x = 5 + 2 + 3;
      document.getElementById("demo").innerHTML = x;
    </script>
  </body>
</html>

خروجی:

در این مثال سه عدد 5 و 2 و 3 با هم جمع شده و نتیجه را در خروجی مشاهده می‌کنیم.

مثال 2:

<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Variables </h2>
    <p> The result of adding "John" + " " + "Doe": </p>
    <p id = "demo"> </p>
    <script>
     var x = "John" + " " + "Doe";
      document.getElementById("demo").innerHTML = x;
    </script>
  </body>
</html>

خروجی:

در این مثال سه متن (متن وسطی فقط شامل فاصله است) با هم جمع شده‌اند. در چنین حالتی مشاهده می‌کنید که عبارات داخل علامت نقل قول کنار هم قرار می‌گیرند.

مثال 3:

<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Variables </h2>
    <p> The result of adding "5" + 2 + 3: </p>
    <p id = "demo"> </p>
    <script>
     var x = "5" + 2 + 3;
      document.getElementById("demo").innerHTML = x;
    </script>
  </body>
</html>

خروجی:

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

مثال 4:

<!DOCTYPE HTML>
<html>
  <body>
    <h2> JavaScript Variables </h2>
    <p> The result of adding 2 + 3 + "5": </p>
    <p id = "demo"> </p>
    <script>
     var x = 2 + 3 + "5";
      document.getElementById("demo").innerHTML = x;
    </script>
  </body>
</html>

خروجی:

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

ایجاد یک متغیر

با استفاده از کلید واژه var می‌توان متغیر را ایجاد کرد:

var carName

متغیر ایجاد شده هیچ مقداری ندارد. برای تخصیص یک مقدار به آن از علامت مساوی استفاده می‌کنیم:

carName = "Volvo"

البته می‌توانید همزمان با ایجاد متغیر مقدار آن را هم مشخص کنید:

var carName = "Volvo"

همچنین می‌توانید با یک دستور چندین متغیر را تعریف کنید. دستور را با var شروع کرده و متغیرها را بوسیله علامت کاما از هم جدا کنید:

var person = "john Doe", carName = "Volvo", price = 200;

می‌توانید نحوه نوشتار کد بالا را به صورت زیر هم انجام دهید:

var person = "john Doe",
carName = "Volvo",
price = 200;

در برنامه‌نویسی کامپیوتر، معمولاً متغیرها بدون مقدار تعریف می‌شوند. مقدار آن‌ها یا چیزی است که باید محاسبه شود و یا چیزی است که بعداً فراهم می‌شود؛ مانند ورودی از کاربر. متغیر تعریف شده بدون مقدار، دارای مقدار غیرمعین یاعبارت دیگر undefiend است.