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

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

متغیر چیست ؟

قبل از هر چیزی شما باید بدانید متغیر چیست ببینید متغیر مثل یک ظرف(مثلا لیوان) است که می توان چیزی را درون آن بریزیم که برای ما نگه دارد و در زمان دلخواه از آن استفاده کنیم.

برای مثال زمانی که درون لیوان آب میریزیم در این لحظه لیوان ظرف(متغیر) ما و آب مقدار آن است و هر زمان بخواهیم می توانیم آب را بنوشیم.

تعریف متغیر با var

در جاوا اسکریپت متغیر ها را با استفاده از کلمه‌ی var تعریف میکنیم در مثال پایین با استفاده از کلمه‌ی var دو متغیر x و y را تعریف کردیم که مقدار x را برابر ۱ و مقدار y را برابر ۲ قرار داده ایم.

var x = 1
var y = 2

این عملگر = نشانه انتساب است و نه مساوی، عملگر مساوی را در برنامه نویسی با == نشان می دهیم

اسامی متغیر ها

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

نام ها می توانند شامل حروف ، اعداد ، زیر خط و علامت دلار باشند.

var a1 = 1

var b_ = 3

var c$ = 8

نام ها باید با یک حرف، $ یا _  شروع شوند(نام ها نمی توانند با اعداد شروع شوند).

var 1a = 1   /// خطا
var _b = 3
var $c = 8

نام ها به حروف کوچک و بزرگ حساس هستند (y و Y متغیرهای مختلفی هستند).

var y = 1

var Y = 3

کلمات رزرو شده (مانند کلمات کلیدی JavaScript) نمی توانند به عنوان نام استفاده شوند در مثال زیر true یک کلمه از قبل تعریف(رزرو) شده در جاوا اسکریپت است پس نمی توان نام متغیر را true گذاشت.

var true = 1   /// خطا

چند مثال کاربردی

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

var a = 1
var b = 2

var c = a + b   /// برابر با ۳ است c مقدار متغیر

دقیقا مانند مثال بالا اما این بار عملیات تفریق را انجام داده ایم.

var a = 1
var b = 2

 var d = b - a   /// برابر با ۱ است d مقدار متغیر

تعریف متغیر با const و let

قبل از سال ۲۰۱۵ تنها راه تعریف متغیر ها استفاده از var بود اما سالِ ۲۰۱۵ اکما اسکریپ ES6 را منتشر کرد و کلمات کلیدی const و let را معرفی کرد.

تفاوت var و let

متغیر ها دارای محدوده هستند و فقط درون محدوده‌ای که تعریف می شوند شناخته می شوند متغیر هایی که با استفاده از var تعریف میشوند در تمامِ محدوده‌ی تابعی(function) که تعریف می شوند در دسترس هستند حتی اگر درون محدوده دیگری درون آن فانکشن باشند.

مهم: در برنامه نویسی محدوده را با { } نشان می دهیم.

function test(){
        var a = 1
        {
            var b = 1
        }

        console.log(a)    /// در محدوده فانکشن است پس ارور نمی دهد 
        console.log(b)    /// با اینکه داخل یک محدوده { } دیگر تعریف شده است چون درون فانکشن است ارور نمی دهد 

    }
    
    test()   /// در این قسمت ما فقط فانکشن را صدا زدیم تا اجرا شود

    console.log(a)   /// دسترسی نداریم پس ارور می دهد a در خارج از محدوده فانکشن ما به

اما متغیر هایی که با استفاده از let تعریف می شوند هیچ کاری با تابع ندارند و فقط درون محدوده خود قابل دسترسی هستند مثال زیر مشابه مثال بالاست اما متغیر را با استفاده از let تعریف کردیم.

function test(){
    let a = 1
    {
        let b = 1
    }

    console.log(a)    /// در محدوده‌ای است که متغیر تعریف شده پس ارور نمی دهد 
    console.log(b)    /// در این محدوده نیست پس ارور می دهد b متغیر

}

test()   /// در این قسمت ما فقط فانکشن را صدا زدیم تا اجرا شود

console.log(a)   /// در این محدوده نیست پس ارور می دهد a متغیر

تفاوت const با var و let

وقتی متغیر را با استفاده از var یا let تعریف میکنیم در هر زمان می توانیم مقدار آن را تغییر دهیم.

var a = 1 

a = 3   ///  را به ۳ تغییر دادیم a مقدار

console.log(a)   ///  عدد ۳ را برای ما چاپ می کند

let a = 1   ///  let این دفعه با استفاده از 

a = 3   ///  را به ۳ تغییر دادیم a مقدار

console.log(a)   ///  عدد ۳ را برای ما چاپ می کند

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

const a = 1   /// const تعریف متغیر با استفاده از 

a = 3   ///  را به ۳ تغییر دادیم و همین جا برنامه خطا می دهد a مقدار

console.log(a)

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