مقدار NaN در جاوا اسکریپت چیست؟


کلمه NaN مخفف Not a Number بوده و به معنی “یک عدد نیست” می باشد.

مقدار NaN در جاوا اسکریپت زمانی به وجود می آید که یک عملیات مربوط به ریاضی را برای رشته های متنی انجام دهیم. به عنوان مثال عملیات ضرب مخصوص داده های عددی می باشد. اگر شما برای دو رشته متنی عمل ضرب انجام بدین براتون NaN رو برمیگرداند.

در مورد عملیات های تقسیم و تفریق نیز همین موضوع صدق میکند. به مثال های زیر توجه کنید:

<span style="font-size: 12pt;">console.log("JavaScript" * "VueJs") // NaN

console.log("JavaScript" / "VueJs") // NaN

console.log("JavaScript" - "VueJs") // NaN</span>

همان طور که در کد های بالا مشاهده می کنید اگر عملیات ضرب، تقسیم و تفریق را برای متغیر های متنی انجام بدهیم، خروجی NaN را خواهیم داشت.

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

در ادامه به این موضوع می پردازیم.

رابطه عمل جمع و NaN در جاوا اسکریپت

همان طور که میدانید برای جمع چندین عدد از عملگر جمع(+) استفاده می کنیم.

اگر شما از عملگر جمع برای رشته های متنی استفاده کنید خروجی NaN در جاوا اسکریپت را نخواهید داشت و با عمل جمع به عنوان عمل چسباندن(concat) استفاده می کند و رشته های متنی را به همدیگر می چسباند. به عنوان مثال:

<span style="font-size: 12pt;">console.log("JavaScript" + "VueJs") // JavaScriptVueJs</span>

همان طور که مشاهده می کنید در صورت استفاده از عملگر جمع برای رشته های متنی، عملگر جمع به صورت concat عمل می کند.

شاید برای شما سوال پیش بیاید که اگر عملگر جمع را برای داده های متنی و عددی به صورت همزمان استفاده کنیم چه خروجی خواهیم داشت!

در ادامه به این موضوع می پردازیم.

عملگر جمع برای اعداد و متن ها در javascript

اگر شما یک داده متنی را با یک داده عددی در جاوا اسکریپت جمع بکنید خروجی به داده متنی بستگی دارد.

اگر رشته متنی شما قابلیت تبدیل به عدد را داشته باشد خروجی به صورت ریاضی خواهد بود(متغیر ها را به صورت دو عدد به همدیگر می چسباند)، اما اگر داده متنی قابلیت تبدیل شدن به عدد را نداشته باشد خروجی NaN خواهد بود. به مثال های زیر توجه کنید:

<span style="font-size: 12pt;">console.log("JavaScript" + "10") // NaN

console.log("20" + "10") // 2010

console.log("5" + "VueJs") // NaN

console.log("100" + "10") // 10010</span>

همان طور که مشاهده می کنید اگر رشته متنی قابلیت تبدیل شدن به عدد را داشته باشد خروجی NaN نخواهد بود.

حال یک بحث دیگر به وجود می آید؛

اگر عملیات های ضرب، تقسیم یا تفریق را برای داده های عددی و متنی انجام دهیم چه خروجی خواهیم داشت.

خروجی دقیقا شبیه به مثال بالا می باشد ولی با این تفاوت که اگر مقدار متنی قابلیت تبدیل شدن به عدد را داشته باشد، آن را عدد در نظر گرفته و عملیات مربوطه را انجام می دهد.

در اصل جاوا اسکریپت ابتدا سعی می کند مقدار متنی را به عدد تبدیل کند، اگر این تبدیل نوع با موفقیت انجام نشود خروجی NaN خواهد بود.

به مثال های زیر توجه کنید:

<span style="font-size: 12pt;">console.log("30" - "10") // 20

console.log("40" / "10") // 4

console.log("4" * "3") // 12

console.log("Js" - "10") // NaN

console.log("40" / "Js") // NaN

console.log("Vue" * "3") // NaN

</span>

همان طور که مشاهده می کنید در خط اول تا سوم چون مقادیر متنی قابلیت تبدیل به عدد را دارند، عملیات لازم به صورت ریاضی انجام شده است.

تشخیص مقدار NaN در جاوا اسکریپت

اگر شما بخواهید NaN بودن یا نبودن یک مقدار را بررسی کنید باید از تابع isNaN استفاده کنید.

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

اگر پارامتر ورودی عدد بوده و یا قابلیت تبدیل شدن به عدد را داشته باشد، خروجی تابع isNaN به صورت false خواهد بود؛ به این معنی که پارامتر ورودی NaN نیست.

در غیر این صورت خروجی تابع true خواهد بود.

به مثال های زیر توجه کنید:

<span style="font-size: 12pt;">console.log(isNaN(10)) // false

console.log(isNaN("20")) // false

console.log(isNaN(true)) // false

console.log(isNaN(false)) // false

console.log(isNaN("SabzLearn.ir")) // true</span>

نکته: در مورد پارامتر ها در مثال بالا توجه داشته باشید که مقدار true همان 1 و مقدار false همان 0 می باشد که هر دو عدد هستند.

کاربرد تابع isNaN در جاوا اسکریپت

یکی از کاربرد های مهم تابع isNaN زمانی است که شما بخواهید از طریق یک فرم یا حتی prompt از کاربر ورودی های عددی را دریافت کنید. در prompt ممکن است کاربر رشته متنی نیز وارد کند!

شما می توانید با استفاده از تابع isNaN بررسی بکنید که ورودی کاربر عدد است یا خیر. به این صورت که ورودی کاربر را به تابع isNaN پاس داده و خروجی را داخل if بررسی کنید و سپس در صورت true یا false بودن، عملیات های مطلوب را انجام دهید.

خروجی حاصل از تقسیم 0 بر 0 نیز NaN خواهد بود:

<span style="font-size: 12pt;">console.log(0 / 0) // NaN</span>

اگر از یک مقدار NaN مقدار typeof بگیریم خروجی number خواهد بود. در نتیجه NaN به خودی خود Data Type نبوده و نوع آن عدد می باشد.

مقدار NaN با هیچ کدام از مقادیر دیگر در جاوا اسکریپت برابر نمی باشد.

<span style="font-size: 12pt;">console.log(NaN == true) // false

console.log(NaN == false) // false

console.log(NaN == "sabzLearn") // false

console.log(NaN == NaN) // false</span>

همان طور که در ابتدای مقاله اشاره شد، مقدار NaN زمانی به وجود می آید که عملیات مربوط به اعداد را برای مقادیر متنی انجام بدهیم و همان طور که می دانید متدهای آبجکت Math مثل pow, floor و … برای اعداد هستند؛

در نتیجه اگر از همچین توابعی برای مقادیر متنی استفاده کنیم خروجی NaN خواهد بود. به مثال های زیر توجه کنید:

<span style="font-size: 12pt;">console.log(Math.pow("SabzLearn.ir")) // NaN

console.log(Math.floor("SabzLearn.ir")) // NaN

console.log(Math.trunc("SabzLearn.ir")) // NaN</span>

منبع:

https://sabzlearn.ir/nan-value-in-javascript/