[数値と文字列の判断方法]

Question

渡ってきたデータを変数へ格納し、それを使用する際、
文字列として渡ってきたのか数値として渡ってきたのかを
確認する方法はありますでしょうか？

数値で渡ってきたことを前提に実装を進めていて詰まってしまったので
事前に確認する方法があれば教えていただきたいです。

ちなみに...
isNaNというものを使用

var id = 渡ってきた情報;
console.log(isNaN(id));
// -> false

false->数値(?)
true->数値ではない(文字列)(?)

Comments

[yuba]

「渡ってきた」というのは関数の引数としてということでしょうか、それともJSONなりURLクエリ引数なりで他システムから、の意味でしょうか。

[star24star]

そのどちらかによって確認方法が変わるのでしょうか？
単純にconsole.log(id);とすると５など一見数字が入っていることは
確認できるのですが、はたしてこれが本当に数値なのか？を確認したいです。

[yuba]

確認方法、だいぶ変わってきます。特にURLクエリ引数やCookieなどで渡ってきた場合には判別するまでもなく文字列だと確定しています。JSONをパースした結果だとか関数の引数だとかなら、数値である可能性がでてきます。

[star24star]

今回はWeb画面で選択されたvalue値を取得しています。
今後の参考までにどちらも教えていただけると幸いでございます。

[think49]

その前提なら Number(), parseFloat() 等で Number 型に変換するだけで解決するのではないでしょうか。変数の型を調べる方法は回答しました。

Answer 1

typeof 演算子を使って下さい。

function sample (id) {
  switch (typeof id) {
    case 'string':
      console.log(id + ' is a string');
      break;
    case 'number':
      console.log(id + ' is a number');
      break;
    default:
      throw new TypeError(id + ' is not a string or number');
      break;
  }
}

sample(1);  // 1 is a number
sample('hoge'); // hoge is a string
sample(null); // TypeError: null is not a string or number(

数値で渡ってきたことを前提に実装を進めていて詰まってしまったので

質問の答えは typeof 演算子になりますが、そのコードを修正するだけなら Number() や parseFloat() で Number 型に変換すれば解決するかもしれません(型の判定が不要です)。

• 数字のみの文字列なら Number()
• "1px" のように数字以外の文字列を含む場合は parseFloat()

Re: star24star さん

Comments

[star24star]

数値の変換は変数の前に+(プラス)を付けるだけで出来たのでここは問題なしです！
typeofの方法は応用できそうなので自分で色々と試してみようと思います
有難うございました！

[think49]

「型の判定が必要ですか」という問いかけなのですが、伝わっていますでしょうか？
Number 型でくる事を前提にコードを組んでいたのなら、
number = +number;
で型変換すれば、String型、Number型で処理を分けなくとも期待通りに動作するように思いました。

[star24star]

数値に変換しているのに何故判定をする必要があったのかということでしょうか…？
数値で来ているものだと思い込んで実装して何故動作しないのだろうと思い色々調べてみたら文字列で渡ってきていたのが分かったということです。
console.logのような事前の確認のようなものです。
今後はこのようなことで躓かないために判定できる手段があればなということで質問させていただきました。

[ipadcaron]

"1E2" というコード値は、100に変換されて数値に「化けて」しまいますが数値は0-9のみで構成されるという前提条件はあるんでづよね？

[star24star]

アルファベットやエンコードなどもなく、0-9のみです！

Answer 2

JavaScript初心者なので、的外れなことを書いていたら優しくご指摘頂くか、無視して頂けると嬉しいです･･･

yubaさんご指摘のように、JSONやURLクエリ引数って文字列として情報伝達する仕組みなので、引数のように型指定なんて出来ませんよね。
あくまでも受けて側が数値として解釈するか文字列として処理するかの問題だと思います。

一方、引数渡しで型指定してあったとしても、処理の途中で暗黙の型変換により想定外の型になっていてエラーが発生してしまうということはあるようです。

そのような場合、下記ページの説明が参考になると思います。

通常の数値かどうかはisNaN関数じゃなくてisFinite関数

つまり isFinite 関数を使うと良いのでは？ということです。

Comments

[star24star]

今回は数値として扱いたい、数値として渡ってきていると思い込んで実装していた、というのが原因です。
HP有難うございます！今後の参考にさせていただきます！

Answer 3

今回はWeb画面で選択されたvalue値を取得しています。

SELECT要素のvalueプロパティということですね。
これで得られる値は文字列型と決まっています。
と言うことは質問は「得られた文字列は"100"のような数値として解釈可能な文字列であるか」ということになるでしょうか。
それならば

isNaN(parseInt(id))

と書けます。（これがfalseなら数値として解釈できます）

関数の引数のように、型として数値型であるかどうかを判定する必要がある場合はthink49さんのお答えの通りになります。

Comments

[star24star]

>> これで得られる値は文字列型と決まっています。
ここからまず理解不足でした。質問の中に最初から書くべきでしたね。有難うございました！

[think49]

「選択されたvalue値」ならラジオボタンやチェックボックスの可能性もあるのでは…。
input 要素なら HTMLInputElement#valueAsNumber があるので Number 型への変換処理が不要になります。
https://html.spec.whatwg.org/multipage/forms.html#the-input-element
また、parseInt() は整数値への変換なので 1.1 が 1 に桁落ちする点に注意が必要です。parseFloat() は少数値に対応しています。

Answer 4

少しずれますが、もし "5" を数値の 5 として扱いたい、という場合は
マイナス 0 する、という方法があります。

var str = "5";
var num = str - 0;

document.write("[" + (str+1) + "]");   // 51になる
document.write("[" + (num+1) + "]");   // 6になる

数字かどうかチェックしてから マイナス 0、とかすれば数値パラメータとして使えるかなあと思うのですが･･･
求めている答えと違ったらすみません。

---

追記：
ああ、parseInt() の方が良いですね。すみません。
ちなみに以前 parseInt() の第2引き数を指定しないで問題が出たことがあったので、一応第2引数まで指定した方がよいのかな

var num = parseInt(str, 10);

Comments

[star24star]

ちょっと試してみたところ、単純に数値なら計算できるし数値でなければエラーが出るのですね。
これも今後活かしたいと思います。有難うございます

[star24star]

実体験からのアドバイスまで有難うございます！

[think49]

ごく単純な数値変換なら parseInt よりも str - 0 の方がコストが安く付くと思います。
parseInt は始めに String 型に変換して前方の数値以外文字列を読み飛ばす処理が余計にかかります。また、忘れられがちですが、parseInt は少数に対応出来ません。

[star24star]

普段はあまり使いませんが
APIでJSONを返したりするときなどは小数点などにも気をつけなければなりませんね