整合營銷服務(wù)商

          電腦端+手機端+微信端=數(shù)據(jù)同步管理

          免費咨詢熱線:

          JavaScript中的NaN是什么?

          JavaScript中,NaN代表"Not a Number",即非數(shù)字,是一個特殊的值,用于表示某些數(shù)學(xué)運算的結(jié)果未定義或不可表示。NaN是JavaScript中唯一一個與自身不相等的值,也就是說,`NaN === NaN`的結(jié)果為`false`。

          NaN常常在嘗試進行無法返回有效數(shù)字值的數(shù)學(xué)運算時出現(xiàn)。例如,當(dāng)你嘗試將一個字符串(除非它是一個可以解析為數(shù)字的字符串)轉(zhuǎn)換為數(shù)字時,JavaScript會返回NaN。

          let num = Number("hello");
          
          console.log(num); // 輸出 NaN

          此外,除以0或者某些無法得出有效結(jié)果的數(shù)學(xué)函數(shù)(例如Math.sqrt(-1))也會返回NaN。

          let num1 = 10 / 0;
          
          let num2 = Math.sqrt(-1);
          
          console.log(num1); // 輸出 NaN
          
          console.log(num2); // 輸出 NaN`

          雖然NaN表示一個非數(shù)字的值,但它本身其實是一個數(shù)字類型??梢允褂胉typeof`運算符來驗證這一點:

          let num = Number("hello");
          
          console.log(typeof num); // 輸出 "number"`

          由于NaN的特殊性,我們不能直接使用等于(==)或全等(===)運算符來檢查一個值是否為NaN。我們需要使用`isNaN()`函數(shù)來進行這個檢查。但需要注意的是,`isNaN()`函數(shù)不僅會在值為NaN時返回`true`,還會在值為`undefined`時返回`true`。為了避免這種情況,我們可以使用`Number.isNaN()`函數(shù),這個函數(shù)只有在參數(shù)是NaN時才會返回`true`。

          let num1 = NaN;
          
          let num2 = undefined;
          
          console.log(isNaN(num1)); // 輸出 true
          
          console.log(isNaN(num2)); // 輸出 true
          
          console.log(Number.isNaN(num1)); // 輸出 true
          
          console.log(Number.isNaN(num2)); // 輸出 false`

          雖然NaN在某些情況下可能會讓人感到困惑,但理解它的行為和如何在JavaScript中處理它是非常重要的。這可以幫助我們避免一些常見的編程錯誤,并更準(zhǔn)確地控制我們的代碼的行為。

          ?

          avaScript 中的數(shù)字類型包含整數(shù)和浮點數(shù):

          const integer = 4;
          const float = 1.5;
          
          typeof integer; // => 'number'
          typeof float;   // => 'number'
          復(fù)制代碼

          另外還有 2 個特殊的數(shù)字值:Infinity(比其他任何數(shù)字都大的數(shù)字)和 NaN(表示“Not A Number”概念):

          const infinite = Infinity;
          const faulty = NaN;
          
          typeof infinite; // => 'number'
          typeof faulty;   // => 'number'
          復(fù)制代碼

          雖然直接使用 NaN 的情況很少見,但在對數(shù)字進行無效的操作后卻會令人驚訝地出現(xiàn)。

          讓我們仔細看看 NaN 特殊值:如何檢查變量是否具有 NaN,并了解怎樣創(chuàng)建“Not A Number”值。

          NaN number

          JavaScript 中的數(shù)字類型是所有數(shù)字值的集合,包括 “Not A Number”,正無窮和負無窮。

          可以使用特殊表達式 NaN 、全局對象或 Number 函數(shù)的屬性來訪問“Not A Number”:

          typeof NaN;        // => 'number'
          typeof window.NaN; // => 'number'
          typeof Number.NaN; // => 'number'
          復(fù)制代碼

          盡管具有數(shù)字類型,但“Not A Number”是不代表實數(shù)的值。NaN 可用于表示錯誤的數(shù)字運算。

          例如,將數(shù)字與 undefined 相乘不是有效操作,因此結(jié)果為 NaN:

          1 * undefined;     // => NaN
          復(fù)制代碼

          同樣嘗試解析無效的數(shù)字字符串(如 'Joker')也會導(dǎo)致 NaN:

          parseInt('Joker', 10); // => NaN
          復(fù)制代碼

          檢查 NaN 是否相等

          NaN有趣的特性是,即使使用 NaN 本身,它也不等于任何值:

          NaN === NaN; // => false
          復(fù)制代碼

          此行為對于檢測變量是否為 NaN 非常有用:

          const someNumber = NaN;
          
          if (someNumber !== someNumber) {  console.log('Is NaN');
          } else {
            console.log('Is Not NaN');
          }
          
          // logs "Is NaN"
          復(fù)制代碼

          僅當(dāng) someNumber 是 NaN 時,someNumber !== someNumber 表達式才是 true。因此,以上代碼片段輸出到控制臺的結(jié)果是 "Is NaN"。

          JavaScript 通過內(nèi)置函數(shù)來檢測 NaN:isNaN() 和 Number.isNaN():

          isNaN(NaN); // => true
          isNaN(1);   // => false
          
          Number.isNaN(NaN); // => true
          Number.isNaN(1);   // => false
          復(fù)制代碼

          這些函數(shù)之間的區(qū)別在于,Number.isNaN() 不會將其參數(shù)轉(zhuǎn)換為數(shù)字:

          isNaN('Joker12');        // => true
          Number.isNaN('Joker12'); // => false
          復(fù)制代碼

          isNaN('Joker12') 將參數(shù) 'Joker12' 轉(zhuǎn)換為數(shù)字,即 NaN。因此該函數(shù)返回 true 。

          另一方面,Number.isNaN('Joker12') 會檢查參數(shù)是否為 NaN 而不進行轉(zhuǎn)換。該函數(shù)返回 false ,因為'Joker12' 不等于 NaN。

          導(dǎo)致 NaN 的運算

          1 解析數(shù)字

          在 JavaScript 中,你可以將字符串形式的數(shù)字轉(zhuǎn)換為數(shù)字。

          例如你可以輕松地將字符串 '1.5' 轉(zhuǎn)換為浮點數(shù) 1.5:

          const numberString = '1.5';
          const number = parseFloat(numberString);
          
          number; // => 1.5
          復(fù)制代碼

          當(dāng)字符串不能被轉(zhuǎn)換為數(shù)字時,解析函數(shù)返回 NaN :表示解析失敗。這里有些例子:

          parseFloat('Joker12.5'); // => NaN
          parseInt('Joker12', 10); // => NaN
          Number('Joker12');       // => NaN
          復(fù)制代碼

          解析數(shù)字時,最好先確認解析結(jié)果是否為 NaN :

          let inputToParse = 'Invalid10';
          let number;
          
          number = parseInt(inputToParse, 10);
          if (isNaN(number)) {  number = 0;
          }
          
          number; // => 0
          復(fù)制代碼

          解析 inputToParse 失敗,因此 parseInt(inputToParse, 10)返回 NaN。條件 if (isNaN(number)) 為 true,并且將 number 賦值為 0。

          2undefined 作為操作數(shù)

          把 undefined 用作加法、乘法等算術(shù)運算中的操作數(shù)會生成 NaN。

          例如:

          function getFontSize(style) {
            return style.fontSize;
          }
          
          const fontSize = getFontSize({ size: 16 }) * 2;
          const doubledFontSize = fontSize * 2;
          
          doubledFontSize; // => NaN
          復(fù)制代碼

          getFontSize() 是從樣式對象訪問 fontSize 屬性的函數(shù)。調(diào)用 getFontSize({ size: 16 }) 時,結(jié)果是undefined(在 { size: 16 } 對象中不存在 fontSize 屬性)。

          fontSize * 2 被評估為 undefined * 2,結(jié)果為 NaN。

          當(dāng)把缺少的屬性或返回 undefined 的函數(shù)用作算術(shù)運算中的值時,將生成 “Not A Number”。

          防止 NaN 的好方法是確保 undefined 不會進行算術(shù)運算,需要隨時檢查。

          3NaN 作為操作數(shù)

          當(dāng)算數(shù)運算的操作數(shù)為 NaN 時,也會生成NaN 值:

          1 + NaN; // => NaN
          2 * NaN; // => NaN
          復(fù)制代碼

          NaN 遍及算術(shù)運算:

          let invalidNumber = 1 * undefined;
          let result = 1;
          result += invalidNumber; // appendresult *= 2;             // duplicate
          result++;                // increment
          
          result; // => NaN
          復(fù)制代碼

          在將 invalidNumber 值(具有 'NaN')附加到 result之后,會破壞對 result 變量的操作。

          4 Indeterminate 形式

          當(dāng)算術(shù)運算采用不確定形式時,將會產(chǎn)生 NaN 值。

          0/0 和 Infinity/Infinity 這樣的的除法運算:

          0 / 0;               // => NaN
          Infinity / Infinity; // => NaN
          復(fù)制代碼

          0 和 Infinity 的乘法運算:

          0 * Infinity; // => NaN
          復(fù)制代碼

          帶有不同符號的 Infinity 的加法:

          -Infinity + Infinity; // => NaN
          復(fù)制代碼

          5 無效的數(shù)學(xué)函數(shù)參數(shù)

          負數(shù)的平方根:

          Math.pow(-2, 0.5); // => NaN
          (-2) ** 0.5;       // => NaN
          復(fù)制代碼

          或負數(shù)的對數(shù):

          Math.log2(-2); // => NaN
          復(fù)制代碼

          總結(jié)

          JavaScript 中用 NaN 表示的的“Not A Number”概念對于表示錯誤的數(shù)字運算很有用。

          即使是 NaN 本身也不等于任何值。檢查變量是否包含 NaN 的建議方法是使用 Number.isNaN(value)。

          將字符串形式的數(shù)字轉(zhuǎn)換為數(shù)字類型失敗時,可能會導(dǎo)致顯示“Not A Number”。檢查 parseInt()、parseFloat() 或 Number() 是否返回了 NaN 是個好主意。

          undefined 或 NaN 作為算術(shù)運算中的操作數(shù)通常會導(dǎo)致 NaN。正確處理 undefined(為缺少的屬性提供默認值)是防止這種情況的好方法。

          數(shù)學(xué)函數(shù)的不確定形式或無效參數(shù)也會導(dǎo)致 “Not A Number”。但是這些情況很少發(fā)生。 這是我的務(wù)實建議:出現(xiàn)了 NaN?趕快檢查是否存在 undefined!


          作者:前端先鋒
          鏈接:https://juejin.cn/post/6844904047787376654
          來源:掘金
          著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請注明出處。

          在javascript中最有趣的數(shù)據(jù)莫過于NaN,對于大部分小猿們剛接觸到這個概念的時候表情應(yīng)該是這樣的。本篇博客就來給各位客官介紹下NaN的知識點。

          NaN的介紹

          • 在很多語言中都有NaN,比如C語言中nan和R語言中NAN以及javascript中的NaN,雖然每一門語言的拼寫不一樣,但是他們表示的含義幾乎一致,NaN全稱 not a number,表示的是一個非數(shù)字。
          • 在javascript中NaN代表的含義也是代表一個非數(shù)字,非數(shù)字的情況就太多:一段字符串,一個函數(shù),甚至是數(shù)組和對象,那么這個NaN到底屬于哪種數(shù)據(jù)類型呢?答案是NaN屬于數(shù)值類型(Number)。
          • 納尼,不是剛剛說過not a number,怎么又說它屬于Number類型呢?

          • 客官莫慌,容本猿給你狡辯狡辯,這里面我們要先搞清楚一個概念,就是數(shù)據(jù)類型Number
          • Number(數(shù)值)是javascript中的一種數(shù)據(jù)類型,其中包含了各種數(shù)值情況:十進制、八進制、十六進制等各種進制,而我們正常的數(shù)字屬于Number(數(shù)值)類型的一個子集,不正常的數(shù)字也是Number的一個子集,而NaN就是不正常數(shù)字的一種情況。
          • 請允許我用抽象派的畫技來給客官展示



          • 我猜你已經(jīng)差不多懂我的意思,總結(jié)起來就是一句話(中文的博大精深)
            • NaN是數(shù)值類型,但不是一個正常的數(shù)字,是一個非數(shù)字,僅僅一字之差。



          NaN的產(chǎn)生

          這個NaN到底如何產(chǎn)生的,結(jié)合本猿開發(fā)和查找資料總結(jié)以下兩種情況

          • 在其他類型轉(zhuǎn)換成數(shù)值類型時候(包含手動轉(zhuǎn)換和自動轉(zhuǎn)換)
              • 手動轉(zhuǎn)換
           var num = Number('千峰')     
           console.log(num) // NaN
          
              • 自動轉(zhuǎn)換
           var num = '千峰' * '大前端'     
           console.log(num) // NaN
          
              • 我們以一種情景對話的方式模擬情景

          • 在數(shù)值某些計算的時候
          var x = Math.sqrt(-1)         
          console.log(x)
          
              • Math.sqrt()方法是用來求平方根,但是只有一個正數(shù)才有平方根,負數(shù)是沒有平方根的,針對于這樣的計算到底給什么結(jié)果呢,js給出的結(jié)果就是NaN

          NaN有趣的靈魂

          • 既然介紹完了NaN,那我們聊點有趣的,本猿給客官們總結(jié)了兩點。
          1. NaN和任何數(shù)的計算 js
          console.log(NaN+1) // NaN     
          console.log(NaN*1) // NaN     
          console.log(NaN/1) // NaN     
          // ...
          
          • 經(jīng)過本猿的觀測,任何一個數(shù)和NaN的計算,結(jié)果都是NaN,各位客官們是不是感受到了快樂


          • NaN和任何數(shù)的比較

          本猿針對于幾種可能會混淆情況比較,發(fā)現(xiàn)結(jié)果都是false

          console.log(NaN === 0) // false     
          console.log(NaN === '') // false     
          console.log(NaN === undefined) // false     
          console.log(NaN === null) // false
          

          難道是我用了全等,抱著試一試態(tài)度我又換成了==,結(jié)果也是false

          console.log(NaN == 0) // false     
          console.log(NaN == '') // false     
          console.log(NaN == undefined) // false     
          console.log(NaN == null) // false
          

          經(jīng)過我反復(fù)測試,得出的結(jié)果是NaN和任何數(shù)據(jù)比較的結(jié)果都是false,但是感覺好像還有什么遺漏


          名偵探柯南上身的我發(fā)現(xiàn)還有一種情況沒有考慮

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


          • 徹底破防了,這個NaN竟然和自己都不相等,那么如何去判斷某個數(shù)據(jù)是不是NaN呢?
          • 正當(dāng)我準(zhǔn)備給ECMASCript提出草案的時候,突然想到了之前NaN的黃金搭檔 isNaN() 方法,這個方法就是天生為了檢測NaN準(zhǔn)備的
          console.log(isNaN(NaN)) // true 
          

          總結(jié)

          • 本篇主要給大家介紹下NaN的概念,希望各位猿猿們在日后開發(fā)中能夠正確使用NaN和成功避免NaN留下的坑點,如有不足歡迎指正,謝謝。

          主站蜘蛛池模板: 中文字幕乱码亚洲精品一区| 日本一区二区在线不卡| 精品久久一区二区| 成人区人妻精品一区二区不卡视频| 精品人妻少妇一区二区三区不卡| 日韩一区二区三区免费体验| 国产激情精品一区二区三区| 亚洲av午夜福利精品一区人妖| 中文字幕一区二区精品区| 人妻夜夜爽天天爽一区| 久久99精品免费一区二区| 91福利视频一区| 精品人妻一区二区三区四区| 精品一区二区三区中文字幕| 国产99久久精品一区二区| 国产亚洲福利一区二区免费看| 中文字幕在线观看一区二区三区| 亚洲图片一区二区| 精品久久久久久中文字幕一区| 国模无码人体一区二区| 69久久精品无码一区二区| 无码日韩人妻AV一区免费l| 久久中文字幕一区二区| 在线成人综合色一区| 中文字幕无码一区二区免费| 精品无人乱码一区二区三区| 久久国产精品免费一区| 亚洲日韩AV无码一区二区三区人| 国产精品一区12p| 无码中文字幕乱码一区| 久久精品国产亚洲一区二区三区 | 麻豆一区二区免费播放网站| 国产MD视频一区二区三区| 亚欧色一区W666天堂| 内射一区二区精品视频在线观看| 精品国产一区二区三区不卡| 一区二区三区影院| 日本一区二区三区在线网| 国产乱码精品一区二区三区四川人| 国产在线不卡一区二区三区| 一区二区三区久久精品|