【JavaScript】很适合今天的NaN

【前言】
本系列为个人前端学习之路的学习笔记,在过往的学习过程中累积了很多笔记,如今想藉着IT邦帮忙这个平台做整理+再复习。
本系列标题一律以【】标示该篇文章主要涉及的内容,例如【JavaScript】、【Vue】等等。
若内容有误,还麻烦各路大神不吝於点出问题,感激不敬。


NaN是什麽?

根据MDN的文件
NaN用以表示「非数值」,听起来有点难懂,英文的话可能比较好理解,就是Not-A-Number

一般来说我们不太常会用到NaN,而是在计算的过程中得到NaN
例如:

console.log( "字串" * 3 ); //NaN

在一些计算过程,例如加减乘除,或是Math 函式.......之类的过程中
如果我们错误的输入了不能被计算的值,想当然也根本算不出结果,这时为了告诉你「你算出来的东西不是数字」,就会回传NaN(Not-A-Number)

typeof NaN

彷佛愚人节玩笑一样,当你typeof NaN时,会得到number

console.log( typeof NaN); //number

判断是否为NaN的陷阱

通常我们会避免出现NaN
会写一些判断式来做检查,但是要小心

let a = "字串" * 5;
if(a === NaN){
    console.log("算错了");
}else{
    console.log("正确");
}
//正确

以这个案例来说,当我们惯性的以===进行判断时,居然会发现NaN === NaN是false
如同typeof NaN是number一样令人惊讶

实际上,NaN不等於(==、!=、===、!==)任何值,包括 NaN 本身
所以要判断是否为NaN要使用isNaN()Number.isNaN()

let a = "字串" * 5;
console.log(isNaN(a)); //true

isNaN()会把参数转成数字,再判断其是否为NaN,因此偶尔还是会出现一些这样的状况:

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

因为空字串被强硬转成数字,变成0,然而0是数字,因此结果就变成false了
但明明空字串就不是一个数字


<<:  【C#】物件导向的三大特性

>>:  搞懂 P2P 技术 (1) - P2P x IPv4 x NAT

Day18-内边距、外边距(CSS)

今天画个丑丑的图片来介绍内边距(padding) 边框(border) 外边距(margin) 这张...

[ Day 20 ] 路由管理 - React Router 1/2

在网页开发技术蓬勃发展的现今,SPA ( Single Page Application )单页式...

Day29 DOM 介绍

文件物件模型 (DOM) 文件物件模型(DOM)是HTML、XML 和 SVG 文件的程序介面。它提...

Day 04. Zabbix 可监控的服务、设备、应用

我把它分成使用基本款 (可安装 Agent)、通用款 (支援监控类通讯协定)、简易款 (无法安装 A...

Angular 深入浅出三十天:表单与测试 Day09 - 整合测试实作 - 登入系统 by Reactive Forms

昨天帮我们用 Reactive Forms 所撰写的登入系统写完单元测试之後,今天则是要来为它写整...