JavaScriptにおける「NaN」について

f:id:ryoutaku_jo:20190919104611p:plain

【結論】

NaNとはNot-a-Numberの略で、JavaScriptにおいては非数(数字では無い)を表す

Number()コンストラクタで、数値への変換に対応していない文字列(アルファベットなど)を数値に変換しようとした際などに出力される

・NaNは「==、!=、===、!==」などで別の値と比較をしても、全てfalseと判定される。NaNでtrueを返したい場合は、isNaN()を用いる。

【目次】

【本題】

JavaScriptにおける「NaN」

NaNとはNot-a-Numberの略で、JavaScriptにおいては非数(数字では無い)を表します。

文字列から数値への変換に失敗した場合や、無効な算術を実行した場合などに表示されます。

発生例

具体的な発生例は以下の通りです。

数値型に対応していない文字列の変換

Number('変換出来ない')
#=> NaN

parseInt('abc')
#=> NaN

parseFloat('')
#=> NaN

0同士の除算

0/2
#=> 0

2/0
#=> Infinity

0/0
#=> NaN

Math 関数の失敗

Math.sqrt(-1)
#=> NaN

Math.log2(-2)
#=> NaN

Math.abs()
#=> NaN

NaNを含んだ算術

1 + NaN
#=> NaN

NaN - NaN
#=> NaN

NaN / 0
#=> NaN

NaNの判定方法

NaNは「==、!=、===、!==」などで別の値と比較をしても、全てfalseと判定される。

これはNaN同士の比較でも例外ではありません。

もし、ある値がNaNの時にtrueを返したい場合は、isNaN()Number.isNaN()を用います。

isNaN()は、値そのものが NaN か、値の変換の結果 NaN になる場合に true を返します。

isNaN(0/0)
#=> true

isNaN('abc')
#=> true

Number.isNaN()は、値そのものが NaN のときにだけ true を返します。

Number.isNaN(0/0)
#=> true

Number.isNaN('abc')
#=> false

参考情報

NaN - JavaScript | MDN

《今日の学習進捗(3年以内に10000時間に向けて)》

画面の設計で、UI/UXの観点で対応に困る場面があった。UI/UXについては、以下の様な場面で迷うことが多い。

・どこまでを文章で説明すべきか判断がつかない
・拡張性/メンテナンス性とトレードオフとなった場合、どちらを優先すべきか判断つかない
・ページ構成について指摘を貰っても、個人の好みの話なので、UI/UX設計上の問題なのか判断がつかない

また、UI/UXの問題は、以下の3つが混同しがちなのも問題を複雑にしていると考えている

・一般的なUI/UX設計上の問題点
・ビジネス視点からの問題点
・個人の好み

この辺りの解決策も考えていきたい。

学習開始からの期間 :284日
今日までの合計時間:2647h
一日あたりの平均学習時間:9.4h
今日までに到達すべき目標時間:2594h
目標との解離:53h
「10,000時間」まで、

残り・・・「7353時間!」