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

با سلام، این قسمت، آخرین قسمت از موضوع data type ها در جاوا اسکریپت است. در این قسمت به موارد جزئی که در آینده با آن ها برخورد خواهید کرد می پردازیم اما قبل از هر چیز می خواهیم شما را با اپراتور typeof آشنا کنیم.

اپراتور typeof

اپراتور typeof (انگلیسی: type of - به معنی "نوعِ ...") اپراتوری است که با استفاده از آن می توانید به نوع یک متغیر یا expression پی ببرید.

شاید از خودتان بپرسید مگر می شود متغیری را که خودمان تعریف کرده ایم، نشناسیم و ندانیم از چه نوعی است؟ بله می شود! در برنامه نویسی جدا از خطاها و فراموشکاری های برنامه نویسان در هنگام تعریف متغیر ها، با نوع جدیدی از مشکلات مواجه هستیم؛ در یک پروژه ی واقعی بسیاری از داده های ما (در واقع اکثر آنها) به صورت مستقیم توسط خودمان تولید و ساخته نمی شوند، بلکه در پروژه های بزرگ کد هایی می نویسیم که متغیر های لازم را برای ما تولید کنند. بر این اساس ممکن است سیستم متغیر هایی تولید کند که ما نشناسیم!

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

ما دو مثال برای شما ذکر می کنیم. مثال اول:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript typeof</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof "" + "<br>" +
typeof "John" + "<br>" + 
typeof "John Doe";
</script>
</body>
</html>

خروجی این کد به ترتیب شامل عبارات زیر می شود:

string
string
string

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

حالا نوع داده ی اعداد را نیز امتحان می کنیم:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript typeof</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 
typeof 0 + "<br>" + 
typeof 314 + "<br>" +
typeof 3.14 + "<br>" +
typeof (3) + "<br>" +
typeof (3 + 4);
</script>

</body>
</html>

خروجی این کد نیز به شکل زیر می باشد:

number
number
number
number
number

می توانید خروجی این کد را به صورت لحظه ای در ادیتور آنلاین جاوا اسکریپت مشاهده کنید.

سوال: آیا واقعا چنین دستوری به درد ما می خورد؟ مثال واقعی از استفاده ی آن چیست؟

این کد در بسیاری از مواقع به کمک ما می آید. من تنها دو مثال از آن را برای شما می زنم:

در پروژه ی خود تابعی تعریف کرده اید و می خواهید مطمئن شوید که به عنوان آرگومان چیزی جز عدد را نمیگیرد؛ به طور مثال جایی از وب سایت خود از کاربر خواسته اید که سن خود را وارد کند. آیا می توان به صداقت همه اعتماد کرد؟ مشخصا خیر! بنابراین می توانید مقدار وارد شده توسط کاربر را بگیرید و با استفاده از اپراتور های منطقی که در جلسات قبل توضیح دادیم، از سیستم بپرسید که آیا مقدار وارد شده توسط کاربر عدد است یا خیر.
در هنگام تست برنامه ی خود متوجه می شوید قسمتی از آن کار نمی کند! در کنسول هم چیزی نمی بینید. یکی از راه هایی که برای برنامه نویسان مبتدی بسیار خوب است، استفاده از دستور typeof و چک کردن متغیر ها است. به طور مثال با این روش متوجه خواهید شد که فلان متغیر شما مقدار undefined را دارد و اصلا مقدار دهی نشده است!

نوع داده ی Undefined

در جاوا اسکریپت اگر متغیری مقدار نداشته باشد، مقدار و نوع آن هر دو undefined (به معنی "تعریف نشده") خواهد بود. مثال:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>The value (and the data type) of a variable with no value is <b>undefined</b>.</p>

<p id="demo"></p>

<script>
var car;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>

</body>
</html>

می توانید خروجی این کد را به صورت لحظه ای در ادیتور آنلاین جاوا اسکریپت مشاهده کنید.

خروجی این کد به ترتیب مقادیر زیر است:

undefined
undefined

سوال اول: چرا car برابر با undefined است؟ به این علت که متغیرِ car هیچ مقداری ندارد!

سوال دوم: چرا در حالی که هر دو یکی هستند، عبارت به ترتیب را ذکر کردم؟ به این علت که هر دو یکی نیستند! اگر به مثالی که در بالا برایتان قرار دادم دقت کنید متوجه خواهید شد که اولی مقدارِ متغیر بوده و دومی نوع متغیر که با دستور typeof نشان داده شده است!

سوال سوم: حالا که اینطور است آیا می شود متغیر هایی که دارای مقدار هستند را با دستور undefined خالی کرد؟ بله می شود! به مثال زیر توجه کنید:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>Variables can be emptied if you set the value to <b>undefined</b>.</p>

<p id="demo"></p>

<script>
var car = "Volvo";
car = undefined;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>

</body>
</html>

می توانید خروجی این کد را به صورت لحظه ای در ادیتور آنلاین جاوا اسکریپت مشاهده کنید.

خروجی این کد به ترتیب مقادیر زیر است:

undefined
undefined

بنابراین با اینکه به متغیر car مقدار Volvo را داده ایم، باز هم با undefined مواجه می شویم چرا که قبل از گرفتن خروجی، متغیر را خالی کرده ایم.

مقادیر empty

مقادیر empty (به معنی "خالی") هیچ ربطی به مقادیر undefined (تعریف نشده) ندارند. به طور مثال یک رشته ی خالی دارای مقدار و نوع است:

<!DOCTYPE html>
<html dir="rtl" style="text-align: center">
<body>

<h2>JavaScript</h2>

<p>یک رشته ی خالی هم دارای مقدار است و هم دارای نوع</p>

<p id="demo"></p>

<script>
var car = "";
document.getElementById("demo").innerHTML =
"مقدار متغیر برابر است با: " +
car + "<br>" +
"نوع متغیر برابر است با: " + typeof car;
</script>

</body>
</html>

می توانید خروجی این کد را به صورت لحظه ای در ادیتور آنلاین جاوا اسکریپت مشاهده کنید.

خروجی این کد به ترتیب مقادیر زیر است:

مقدار متغیر برابر است با:
نوع متغیر برابر است با: string

نکته: همانطور که در خروجی می بینید مقدار خالی است اما تعریف نشده نیست.

نوع داده ی null

ما گفتیم که:

اگر متغیری را تعریف کنیم اما مقدار دهی نکنیم، نوع اش می شود undefined
اگر متغیری تعریف کنیم اما مقدار آن را خالی بگذاریم، نوع اش می شود empty

اما اگر کلا چیزی نداشته باشیم چطور؟ null (به معنی "پوچ" یا "تهی") چیزی است که وجود ندارد. البته اگر دستور typeof را روی آن بزنید، به شما اعلام می شود که null یک شیء است!

به عقیده ی بسیاری از برنامه نویسان این موضوع یک باگ در زبان برنامه نویسی جاوا اسکریپت است و typeof برای null باید همان null باشد. سر این موضوع بحث ها بسیار است اما این مباحث تنها تئوری هستند و چیزی که شما باید بدانید معنی آن است. معنی آن تهی و خالی بوده و نوع آن هم بنا به دلایلی! شیء است.

باز هم می توانید با دستور null یک متغیر را خالی کنید:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript</h2>

<p>Objects can be emptied by setting the value to <b>null</b>.</p>

<p id="demo"></p>

<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
person = null;
document.getElementById("demo").innerHTML = typeof person;
</script>

</body>
</html>

خروجی این دستور object است اما همانطور که گفته شد باید توجه کرد که object به خودِ null برمیگردد نه به شیء اصلی که در ابتدای کد تعریف کردیم.

در ضمن قبلا هم گفتیم که می توانید متغیر ها و همچنین اشیاء را با دستور undefined خالی کنید.

سوال: تفاوت بین null و undefined چیست؟

در تئوری تفاوت های ریزی دارند که برای ما مهم نیست اما در عمل باید بدانید که null و undefined در مقدار مساوی و در نوع متفاوت هستند. به مقایسه ی زیر دقت کنید:

typeof undefined           // undefined
typeof null                // object

null === undefined         // false
null == undefined          // true

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

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

در پناه حق.

انواع داده ها (data types) در جاوا اسکریپت: null، empty و undefined

اپراتور typeof

نوع داده ی Undefined

مقادیر empty

نوع داده ی null