IE系のブラウザでNumber.isFinite()が動作しないので、polyfillを使おう

とあるプロジェクトで、エラーがでたのでコンソールみたら、「isFinite()って関数はありません」ってエラー。

「まじか・・・」と思いつつ、調べたら「polyfill」使えばいけるって書いている記事を見つけたのでメモ。

qiita.com

isFiniteとは？

Javascriptに実装されている関数です。有限数かどうかを確認します。

有限数とは？

有限の大きさ：ある数Ｎに対してそれより大きな数Ｍが存在する。 ということ。

よくわからんけど。無限についてはなんとなく。無限という数値は（x+1）ということができないから。それ以外は有限数と。

ようはjsで計算ミスったときによくみるInfinityがそれにあたるのかなと思いました。

developer.mozilla.org

使ってみる

動いたよ！

だがしかし。。。

> isFinite(10)
true
> isFinite('10')
true

おうおうおう（^ω^;

数値と文字列の型チェックはしてくれないのね。ということで、ドキュメントにもありますが、堅牢性の高いチェックをするならNumber.isFinite('0')を使いなさい。とのこと。

developer.mozilla.org

> Number.isFinite(10)
true
> Number.isFinite('10')
false

うむ。

しかしIEには実装されていない(´；ω；｀)ﾌﾞﾜｯ

＿人人人人人人人人人人人人人人人人＿
＞ Internet Explorer 未サポート＜
￣ＹＹＹＹＹＹＹＹＹＹＹＹＹＹＹＹ￣

泣いた

polyfillを使えばいける

polyfillとは？

hblog.glamenv-septzen.info

要するにHTML/JS/CSSの最新仕様や、まだドラフトとか提案段階の機能を、古いブラウザとかでも先取りして動かせるようにしてくれるライブラリをまとめて "Polyfill" というカテゴリで扱ってるらしい

ふーむ。

使ってみる

Qiitaの記事にはこう書いてある。

Number.isFinite = Number.isFinite || function(any) {
  return typeof any === 'number' && isFinite(any);
};

これでいけました！

（jsって動的にメソッドを追加できるんかいな・・・phpみたいやな）

まとめ

jsの型について知らないことが多くて困っています。。。

NaNとか一回一覧を用意して覚えたほうがいいなぁー。