Web Developer
انواع متغیر در جاوا اسکریپت و نحوه بررسی آنها
همون طوری که می دونید جاوا اسکریپت یک زبان dynamically typed یا loosely typed هست یعنی وقتی متغیر تعریف میکنیم نیازی نیست قبلش مشخص کنیم چه نوع مقداری میخواهیم داخلش نگه داریم یا موقعی که یک متغیر مثلا از نوع عددی داریم و میخواهیم مقدارش رو تغییر بدیم به نوع دیگری مثل string به راحتی میتوانیم این کار رو انجام دهیم.
(البته پیشنهاد میکنم برای تمیز تر بودن، خوانایی بالاتر و جلوگیری از خطا های احتمالی وقتی یک متغیر در کد های جاوا اسکریپت خودتون تعریف و مقدار دهی کردید، دیگه مقداری از نوع متفاوت بهش ندید!)
اما در بعضی زبان ها مثل جاوا که اصطلاحا strictly typed هستند شما باید نوع متغیر خودتون رو مشخص کنید! خوب تا اینجاش که به نظر این ویژگی جاوا اسکریپت عالیههه ! اما .......
بررسی نوع متغیر ها و مقادیر اونها یکی از مهمترین قسمت های برنامه نویسی هست و این مورد در جاوا اسکریپت با توجه به نکته ای که گفتیم کمی پیچیده تر هم میشه مخصوصا اگر بدونیم جاوا اسکریپت کلی رفتار متفاوت در شناسایی انواع مختلف متغیر ها داره که در ادامه با هم اونها رو میبینیم ;)
بررسی Data Type های جاوا اسکریپت:
جاوا اسکریپت ۶ نوع متغیر داره(تا قبل ES6) که به صورت زیر هستند:
1. String
2. Number
3. Boolean
4. null
5. undefined
6. Object
شاید انتظار داشتیم Array و یا Function رو هم تو این لیست ببینیم ولی اونها تنها پیاده سازی خاصی از object هستند! اینجاست که میگن:
In JavaScript, objects are king.
یه نکته ای رو هم اضافه کنم، در ES6 یک نوع جدید به اسم Symbol هم اضافه شده که پس در مجموع ۷ نوع متغیر شدند که به دو دسته تقسیم می شوند:
دسته اول primitive types:
یعنی تمام ۶ نوع اول به جز object، این نوع از متغیر ها مقادیر ساده ای را در حافظه نگه میدارند.
دسته دوم reference type:
شامل object که مجموعه ای از داده هایی هست که با name و value شناسایی می شوند.
استفاده از typeof برای شناسایی نوع متغیر:
با استفاده از typeof می تونیم نوع متغیر رو تشخیص دهیم تا باتوجه به نوع و مقدار اون یک عملیات خاص رو انجام بدیم یا تصمیم گیری در روند کدمون داشته باشیم.
اما این مورد همیشه هم طبق اون چیزی که انتظار داریم عمل نمیکنه! پس باید کاملا رفتار اون رو درک کنیم.
یک مثال ساده از typeof:
var aNum = 1;
var bNum = 1.5;
console.log(typeof aNum);
console.log(typeof bNum);
//output
aNum -> 'number'
bNum -> 'number'
خوب ۲ تا متغیر داشتیم یکی عدد صحیح و یکی عدد اعشاری که هر دوی اونها رو از نوع number شناسایی کرد پس همون طور که دیدیم نوع float و integer نداریم و همه ی اعداد در جاوا اسکریپت از نوع number هستند.
اما چند تا از موارد کمی عجیب از typeof رو با هم ببینیم:
typeof null === 'object';
output -> true
خوب این یکی از مواردی هست که از ابتدای جاوا اسکریپت بوده و هست و خواهد بود! پس انتظار نداشته باشید typeof روی null به شما 'null' برگردونه چون قراره object بگیرید!
یک نمونه دیگه هم در مورد آرایه ها هست که دوباره object در جواب typeof میگیریم:
typeof [1,2,3] === 'object';
output -> true
برای دیدن جزئیات بیشتر و لیست کامل تر این موارد به سایت mozilla بروید.
خوب تا همین جا مشخص شد که در خیلی از مواقع فقط بررسی typeof نمیتونه کارساز باشه و باید در کنار اون از مواردی دیگر هم استفاده کنیم.
استفاده از instanceof:
یکی از مواردی که برای بررسی نوع متغیر خیلی کارساز هست instanceof هست، فرض کنیم میخواهیم بررسی کنیم که متغیری که داریم حتما آرایه باشه پس به صورت زیر این کار رو انجام میدیم:
[1,2,3] instanceof Array;
output -> true
به جز instanceof هم چنین ۲ روش دیگر برای بررسی دقیق تر نوع متغیر وجود دارد که استفاده از constructor و یا صدا زدن toString روی object هست که در پست های دیگه اونها رو هم توضیح میدم.
اما وقتی typeof برای null خروجی 'object' میدهد چطوری null رو بررسی کنیم:
function isNull(value) {
return value === null;
}
همان طور که در تابع isNull بالا دیدیم استفاده از ۳ تا علامت مساوی به جای دو تا یعنی === به جای == علاوه بر مقدار متغیر ها، نوع آنها را با هم بررسی میکند که خوب در جاوا اسکریپت بهتر هست که بسته به شرایط کدمون از ۳ تا علامت استفاده کنیم و همون طوری که اینجا دیدیم کارساز بود.
نمونه ای دیگر از بررسی با ۳ تا مساوی:
console.log(undefined == null); // true
console.log(undefined === null); // false
جاوا اسکریپت و NaN!:
زمانی که اعمال ریاضی در جاوا اسکریپت انجام میدیم، هرموقع که مقادیر ورودی ما قابلیت انجام عمل ریاض رو نداشته باشنید احتمالا جواب NaN میگیریم که یعنی Not a Number ! اما این NaN خودش رفتار عجیبی داره که با هم میبینیم!!
شما اگر مواردی مثل:
- تقسم ۰ با ۰
- تقسیم Infinity با Infinity
- ضرب صفر در Infinity
- استفاده از متغیر غیر قابل تبدیل به عدد در محاسبات ریاضی
- و....
انجام دهید NaN دریافت خواهید کرد که اگر typeof از آن بگیرید!:
typeof NaN;
output -> 'number'
بله number گرفتیم و یکم عجیب تر از اون:
NaN == NaN;
output -> false
و اما روش بررسی NaN بودن جواب یک محاسبه ریاضی:
var x; // undefined
isNaN(NaN); //true
isNaN(x); // true
isNaN(undefined); // true
isNaN("a"); // true
isNaN(2); // false
isNaN("2"); // false
isNaN(true); // false
isNaN(false); // false
خوب همون طوری که دیدیم isNaN به نظر تابع قابل اعتمای میاد :D فقط یادتون باشه که Boolean ها number نیستند حتی اگر در بعضی جا ها به عدد تبدیل میشوند یعنی مثل مثال زیر که به عدد میتوان اونها رو تبدیل کرد:
Number(true); // 1
Number(false); // 0
اما typeof مقادیر متفاوتی از انواع مغیر هایی که در جاوا اسکریپت دیدیم رو هم برمیگردونه:
typeof 1n === 'bigint'; // true
typeof BigInt('1') === 'bigint'; // true
typeof function() {} === 'function';
در آخر چند تا از خروجی های typeof در موارد مختلف رو با هم ببینیم:
console.log(typeof " "); // "string"
console.log(typeof 0); // "number"
console.log(typeof Infinity); // "number"
console.log(typeof NaN); // "number
console.log(typeof true); // "boolean"
console.log(typeof false); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object"
console.log(typeof Symbol()); // "symbol"
console.log(typeof [ ]); // "object"
console.log(typeof Array(5)); // "object"
console.log(typeof function() {}); // "function"
console.log(typeof new Date); // "object"
console.log(typeof {}); // "object"
console.log(typeof new Object); // "object"
نتیجه گیری:
در این پست با سیستم data type در جاوا اسکریپت آشنا شدیم و دیدیم که چه نوع متغیر هایی داریم و چطوری با استفاده از typeof می تونیم اونها رو بررسی کنیم و همین طور دیدیم که با توجه به بعضی خروجی های گمراه کننده typeof چطور از روش های دیگری استفاده کنیم.
لطفا اگر این پست برای شما مفید بود لایک یادتون نره:)
مطلبی دیگر از این انتشارات
روش های استایل دهی CSS در سند HTML
مطلبی دیگر از این انتشارات
جاوااسکریپت گردی: تبدیل به آرایه
مطلبی دیگر از این انتشارات
ایرادهایی از جاوا اسکریپت که همه نمیدونند