نگاهی عمیق تر به مقادیر Boolean در جاوا اسکریپت

امروز قصد داریم در رابطه با مقادیر منطقی بولین (Boolean) صحبت کنیم؛ قبل از بحث این جلسه در جلسات قبل اشاره های کوچکی به ساختار کلی boolean ها کرده بودیم اما در این قسمت قصد داریم به جزئیات و نکات ریز آن بپردازیم. ما در بسیاری از اوقات نیاز به نوعی از داده داریم که تنها بتواند دو حالت داشته باشد. مثل:

بله یا خیر
روشن یا خاموش
صحیح یا غلط

پاسخ جاوا اسکریپت به این نیاز، داده های Boolean هستند که تنها می توانند مقادیر true یا false را قبول کنند.

تابع ()Boolean

شما می توانید از تابع ()Boolean برای تشخیص صحیح یا غلط بودن یک عبارت (و یا یک متغیر) استفاده کنید:

<!DOCTYPE html>
<html>
<body>

<p>Display the value of Boolean(10 > 9):</p>

<button onclick="myFunction()">Try it</button>

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

<script>
function myFunction() {
  document.getElementById("demo").innerHTML = Boolean(10 > 9);
}
</script>

</body>
</html>

از آن جایی که عدد 10 بزرگتر از 9 است بنابراین خروجی کد ما true خواهد بود. حتی می توانید در کد بالا پرانتز ها را به شکل زیر حذف کنید:

<script>
function myFunction() {
  document.getElementById("demo").innerHTML = 10 > 9;
}
</script>

نتیجه باز هم true خواهد بود.

نکته: داده ی boolean پایه و اساس تمام مقایسه ها و جملات شرطی در جاوا اسکریپت است. در صورت نیاز، در قسمت های آینده به طور مفصل از آن ها صحبت خواهیم کرد.

هر چیزی که دارای مقداری باشد true خواهد بود

<!DOCTYPE html>
<html>
<body>

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

<script>
var b1 = Boolean(100);
var b2 = Boolean(3.14);
var b3 = Boolean(-15);
var b4 = Boolean("Hello");
var b5 = Boolean('false');
var b6 = Boolean(1 + 7 + 3.14);

document.getElementById("demo").innerHTML =
"100 is " + b1 + "<br>" +
"3.14 is " + b2 + "<br>" +
"-15 is " + b3 + "<br>" +
"Any (not empty) string is " + b4 + "<br>" +
"Even the string 'false' is " + b5 + "<br>" +
"Any expression (except zero) is " + b6;
</script>

</body>
</html>

خروجی کد به ترتیب زیر خواهد بود:

100 is true (معنی: 100 صحیح است)
3.14 is true (معنی: 3.14 صحیح است)
-15 is true (معنی: -15 صحیح است)
Any (not empty) string is true (معنی: هر رشته ای که خالی نباشد صحیح است)
Even the string 'false' is true (صحیح است 'false' معنی: حتی رشته ی)
Any expression (except zero) is true (معنی: هر عبارتی به غیر از صفر صحیح است)

هر چیزی که مقداری نداشته باشد false خواهد بود

مقدار boolean عدد 0 همیشه false است:

<!DOCTYPE html>
<html>
<body>

<p>Display the Boolean value of 0:</p>

<button onclick="myFunction()">Try it</button>

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

<script>
function myFunction() {
  var x = 0;
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

</body>
</html>

خروجی false خواهد بود.

همچنین خروجی عدد 0- نیز false خواهد بود:

<script>
function myFunction() {
  var x = -0;
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

خروجی "" (رشته ی خالی) نیز false خواهد بود:

<!DOCTYPE html>
<html>
<body>

<p>Display the Boolean value of "":</p>

<button onclick="myFunction()">Try it</button>

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

<script>
function myFunction() {
  var x = "";
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

</body>
</html>

خروجی undefined نیز false خواهد بود:

<script>
function myFunction() {
  var x;
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

خروجی null نیز برابر false است:

<script>
function myFunction() {
  var x = null;
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

همچنین واضح است که خروجی false نیز برابر با خود false است:

<script>
function myFunction() {
  var x = false;
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

خروجی مقدار NaN نیز false خواهد بود:

<!DOCTYPE html>
<html>
<body>

<p>Display the Boolean value of NaN:</p>

<button onclick="myFunction()">Try it</button>

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

<script>
function myFunction() {
  var x = 10 / "H";
  document.getElementById("demo").innerHTML = Boolean(x);
}
</script>

</body>
</html>

در این مثال برای ایجاد NaN از تقسیم یک عدد روی یک حرف استفاده کردیم که باعث تولید خطای NaN (مخفف Not a Number - به معنی "عدد نیست") می شود.

boolean ها می توانند شیء باشند

<!DOCTYPE html>
<html>
<body>

<p>Never create booleans as objects.</p>
<p>Booleans and objects cannot be safely compared.</p>

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

<script>
var x = false;         // x is a boolean
var y = new Boolean(false);  // y is an object
document.getElementById("demo").innerHTML = typeof x + "<br>" + typeof y;
</script>

</body>
</html>

خروجی این کد به شرح زیر است:

boolean
object

نکته: هیچ گاه boolean ها را به شکل شیء نسازید. این کار علاوه بر کاهش سرعت کد، باعث پیچیدگی آن نیز شده و می تواند باعث بروز خطا در سیستم شما شود. به طور مثال استفاده از اپراتور == برای مقایسه ی دو boolean مشکلی ایجاد نمی کند اما اگر از === استفاده کنیم به مشکل برخواهیم خورد چرا که نوع یک boolean ساده از نوع داده های ابتدایی و primitive است اما boolean هایی که با دستور new ساخته شوند از نوع اشیاء خواهند بود. همچنین بدتر اینکه اشیاء را نمی توان با هم مقایسه کرد:

<!DOCTYPE html>
<html>
<body>

<p>Never create booleans as objects.</p>
<p>Booleans and objects cannot be safely compared.</p>

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

<script>
var x = new Boolean(false);  // x is an object
var y = new Boolean(false);  // y is an object
document.getElementById("demo").innerHTML = (x==y);
</script>

</body>
</html>

بر خلاف انتظار شما و در کمال تعجب، خروجی کد بالا false خواهد بود. بنابراین به یاد داشته باشید که جواب مقایسه ی دو شیء جاوا اسکریپت همیشه false خواهد بود.

ما در آینده و در پروژه های عملی استفاده ی زیادی از boolean ها خواهیم داشت و خواهید فهمید که این نوع داده ها جزئی جدایی ناپذیر از جاوا اسکریپت و پروژه های عملی آن هستند. به هر حال امیدوارم از این قسمت لذت و استفاده ی کافی را برده باشید.