JavaScript의 NaN

hzc
풀어 주다: 2020-06-29 10:42:46
앞으로
2980명이 탐색했습니다.
  1. NaN은 무엇인가요
  2. NaN
  3. 什么时候会返回 NaN
  4. 判断 NaN
  5. 参考

什么是 NaN

在 MDN 的 NaN 文章中有描述:

  • 全局属性 NaN 表示 Not-A-Number 的值。
  • NaN 是一个全局对象的属性。
  • NaN 属性的初始值就是 NaN,和 Number.NaN 的值一样。
  • 在 ES5 中, NaN 属性是一个不可配置(non-configurable),不可写(non-writable)的属性。但在 ES3 中,这个属性的值是可以被更改的,但是也应该避免覆盖。
  • 通常都是在计算失败时,作为 Math 的某个方法的返回值出现的(例如:Math.sqrt(-1))或者尝试将一个字符串解析成数字但失败了的时候(例如:parseInt("blabla"))。

NaN 的类型

typeof NaN // "number"
로그인 후 복사

也就是说NaN是一种特殊的Number类型值。

什么时候会返回 NaN

JavaScript 权威指南 中『3.1.3 JavaScript 中的算数运算』章节里有描述:

无穷大除以无穷大、给任意负数做开方运算 或者 算数运算符与不是数字或无法转换为数字的操作数一起使用时都将返回NaN

可分开解释为以下等情况:

  • 无穷大除以无穷大
  • 给任意负数做开方运算
  • 算数运算符与不是数字或无法转换为数字的操作数一起使用
  • 字符串解析成数字

以下结果都是NaN

Infinity / Infinity; // 无穷大除以无穷大 Math.sqrt(-1); // 给任意负数做开方运算 'a' - 1; // 算数运算符与不是数字或无法转换为数字的操作数一起使用 'a' * 1; 'a' / 1; parseInt('a'); // 字符串解析成数字 parseFloat('a');
로그인 후 복사

这里的『无法转换为数字的操作』又是什么鬼?

先看下面可以转换为数字的操作例子:

Math.sqrt('4'); // 2 2 * '2'; // 4 '4' / 2; // 2
로그인 후 복사

无法转换为数字的操作

这里涉及到 JavaScript 的类型转换的概念。

JavaScript 权威指南 『3.8 类型转换』章节有描述:

如果 JavaScript 期望使用一个数字,它把给定的值将转换为数字(如果转换结果无意义的话将返回 NaN)。

可以使用Number()方法做显式类型转换,举例:

Number('1'); // 1 Number(null); // 0 Number('a'); // NaN
로그인 후 복사

也可以使用一元运算符+做隐式转换,举例:

+'1'; // 1 +null; // 0 +'a'; // NaN
로그인 후 복사

也可以使用全局函数parseInt()parseFloat()解析整数和浮点数,举例:

parseInt('12'); // 12 parseInt('12a'); // 12 parseInt('a12'); // NaN parseInt(null); // NaN
로그인 후 복사

parseInt()parseFloat()可以简单理解为:

尽可能解析更多数值字符,并且忽略后面的内容;如果第一个非空格字符是非数字,则会返回NaN

需要注意的是Number()parseInt()``parseFloat(),对某些输入值的处理不同,如null

非数字类型转换 为 数字类型,如下表汇总:

数字
undefined NaN
null 0
true 1
false 0
"" (空字符串) 0
"1.2" (非空,数字) 1.2
"one" (非空,非数字) NaN
[] (任意对象) 0
[9] (一个数字元素) 9
['a'] (其他数组) NaN
function(){} (任意函数) NaN

如何判断 NaN

首先全局的isNaN()函数不能严格判断输入值是否为NaN

isNaN()的怪异行为

在 MDN 的 isNaN() 文章中对非数值参数所表现的『怪异行为』有解释:

它会先尝试将这个参数转换为数值,然后才会对转换后的结果是否是NaN进行判断。

因此,对于能被强制转换为有效的非NaN数值来说,返回false值也许会让人感觉莫名其妙。

如下例子:

isNaN('37'); // false: 可以被转换成数值 37 isNaN(''); // false: 空字符串被转换成 0
로그인 후 복사

严格判断 NaN

参考 MDN 中Number.isNaN()NaN은 언제 반환되나요

NaN 판단

참고

NaN이 무엇인가요MDN의 NaN 기사에 설명되어 있습니다:
    전역 속성 NaN은 Not-A-Number의 값을 나타냅니다. NaN은 전역 개체의 속성입니다. NaN 속성의 초기값은 NaN이며 이는 Number.NaN의 값과 동일합니다. ES5에서 NaN 속성은 구성할 수 없고 쓸 수 없는 속성입니다. 하지만 ES3에서는 이 속성의 값을 변경할 수 있지만 덮어쓰기는 피해야 합니다. 일반적으로 계산이 실패하거나(예: Math.sqrt(-1)) 문자열을 숫자로 구문 분석하려고 시도했지만 실패했을 때 Math 메서드의 반환 값으로 나타납니다( 예: parseInt("blabla")).

NaN의 유형

typeof value === 'number' && isNaN(value)
로그인 후 복사
즉, NaN은 특별한 Number유형 값입니다. .

NaN은 언제 반환되나요?

JavaScript에 대한 권위 있는 가이드의 "3.1.3 JavaScript의 산술 연산" 장에 설명이 있습니다.
무한대를 무한대로 나누고 제곱근을 수행합니다. 음수에 대한 연산 또는 숫자가 아니거나 숫자로 변환할 수 없는 피연산자와 함께 사용된 산술 연산자는 NaN을 반환합니다.
다음 상황으로 별도로 해석될 수 있습니다:
    무한대를 무한대로 나눈 값음수에 대해 제곱근 연산을 수행합니다.산술 연산자이며 숫자가 아닙니다. 또는 숫자 피연산자를 함께 사용으로 변환할 수 없습니다.문자열을 숫자로 구문 분석
다음 결과는 모두 NaN입니다. rrreee여기의 연산은 변환할 수 없습니다. 숫자에 "그건 또 뭐야?" 먼저 숫자로 변환할 수 있는 연산의 다음 예를 살펴보세요. rrreee

숫자로 변환할 수 없는 연산

이것은 JavaScript의 유형 변환개념과 관련이 있습니다. JavaScript 최종 가이드 "3.8 유형 변환" 장에는 다음과 같은 설명이 있습니다.
JavaScript가 숫자를 기대하는 경우 주어진 값을 숫자로 변환합니다(변환 결과가 의미가 없으면 NaN이 반환됩니다).
명시적 유형 변환에는 Number()메서드를 사용할 수 있습니다. 예: rrreee암시적 변환에는 단항 연산자 +를 사용할 수도 있습니다. , 예:rrreee또한 전역 함수 parseInt()parseFloat()를 사용하여 정수와 부동 소수점 숫자를 구문 분석할 수 있습니다. 예: rrreeeparseInt() 및 parseFloat()는 다음과 같이 간단하게 이해할 수 있습니다.
가능한 많은 숫자 문자를 구문 분석하고 첫 번째가 공백이 아닌 경우 다음 내용을 무시합니다. 문자가 숫자가 아니면 NaN
을 반환합니다. Number()parseInt()``parseFloat( ), 일부 입력 값의 경우 null과 같이 다르게 처리됩니다. 다음 표에 요약된 것처럼 숫자가 아닌 유형은 숫자 유형으로 변환됩니다. NaN tr>
value 숫자
정의되지 않음
null 0 td>
1
false 0
""(빈 문자열) 0
"1.2"(비어 있지 않음, 숫자) 1.2
" 1"(비어 있지 않음, 숫자가 아님) NaN
[ ](모든 개체) 0
[9] (숫자 요소 1개) 9
[' a'] (기타 배열) NaN
function() {}(모든 함수) NaN

NaN 판단 방법

우선, 전역 isNaN()함수로는 입력값이 NaN인지 여부를 엄밀히 판단할 수 없습니다.

isNaN()의 이상한 동작

MDN의 isNaN() 기사에는 숫자가 아닌 매개변수 :
먼저 이 매개변수를 숫자 값으로 변환한 다음 변환된 결과가 NaN인지 판단합니다.
따라서 유효한 값으로 강제 변환될 수 있는 NaN이 아닌 값에 대해 false값을 반환하는 것은 혼란스러울 수 있습니다.
다음 예: rrreee

NaN을 엄격하게 판단

MDN에 있는Number.isNaN()의 Polyfill 코드를 참조하세요. rrreee권장 튜토리얼: "JS 튜토리얼》

위 내용은 JavaScript의 NaN의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:jianshu.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!