Skip to content

[JavaScript]数値が入力されたら計算をする【条件分岐】

ma-san
ma-san(鈴木正行)

数値と文字列を判別し、数値の場合に計算をするようにif文を書きます。

if文とは?#

if(もしも)という条件を使って数値か文字列かを判別する。

isNaNとif文を組み合わせることでプログラミングらしい動作が実行されます。

let text = prompt('数値を入力してください。');
if (isNaN(text)) {
console.log('数値ではありません。');
}

上記の場合は数値以外の文字列が入力された場合に「数値ではありません。」と出力されます。数値が入力された場合はプログラム上でなにかを出力するコードがないため、「もしもの場合」と「もしもじゃない場合」のコードは下記となります。

数値が入力されたら計算をする#

「!」を使うことでisNaNを逆の意味に変換。
if文で数値が入力された場合の条件に当てはまるように書く。

「!」を使うことでisNaNの意味を「数値に変換できない」から「数値に変換できる」に変わります。そのため、文字列のままでは計算はうまくできなかったところが計算ができるようになります。
下記のコードはシンプルに、数値の場合は入力した数値同士を足し算する計算が実行されます。

let text = prompt('数値を入力してください。');
if (!isNaN(text)) {
console.log(parseInt(text) + parseInt(text));
}

もしも(条件)に該当しない場合#

条件に当てはまらない場合、なにも出力されないのは不親切です。条件に当てはまらない場合は「else」を使用します。

else」を使うことで条件に当てはまらない場合という「条件」を出力することが可能です。
if文を記述するときはほぼ必ずセットで書くことになるので覚える必要があります。

今回は数値以外が入力された場合の条件を記述します。

let text = prompt('数値を入力してください。');
if (!isNaN(text)) {
console.log(parseInt(text) + parseInt(text));
} else {
console.log('数値以外が入力されました。');
}

ifとelseを使うことで様々なプログラムが書けるようになります。様々な条件を記述できるようになれば数値だけではなく、なにかしらのアクションに対して様々な結果を出せるようになります。

お仕事・当サイトへ興味を持っていただいた方

お問い合わせはこちらから

お問い合わせを頂く際はご確認ください

プライバシーポリシー

ma-san(鈴木正行)
テクニカルディレクター / Webデザイナー

「ma-san web design」の管理者。東京都・千葉県(千葉市・四街道市・浦安市・佐倉市)・宮城県(仙台市)を中心に企業のWebデザイン/マーケティング/IT戦略のプランニングからWebサイト構築・運用をしています。
Webアクセシビリティ」を中心に、「変わりゆくWebと共にサービス・サイトを改善していくこと」を重視します。
当サイトではお仕事のご相談からナレッジシェアを中心に活動していきます。

るり
気軽にご相談ください。
千葉県四街道市を中心に、Webサイト制作を通じてサポートいたします。
Accessible Web Design.

Recommendation

るり

Webアクセシビリティの重要性について 当サイトが最も注力したい「Webアクセシビリティ」について、ぜひ多様な方々と共に学びながら充実化させ、普及活動に勤しみたいと考えています。

るり

初めて依頼を検討している方 初めてWebサイト制作を依頼する方へ。Webサイトを作りたいと思ったときに参考にしていただけると幸いです。

るり

Webサイトの基本 サーバーの準備からドメイン契約。Webサイトに必要なデータや情報を一通り纏めることで初めてWebサイト制作に携わる方々の学習の一助になれば幸いです。