【入門編】JavaScriptで動かす!計算と条件判定の基本を徹底解説

Javascript 計算と条件判定

目次

「プログラミングは難しそう…」と感じていませんか?でも、Webサイトやアプリの裏側で動いているのは、実はとてもシンプルな「計算」と「条件判定」の組み合わせなんです。

この記事では、プログラミング初心者の方でも安心して始められるよう、JavaScriptを使った基本的な計算方法や、状況に応じて処理を切り替える条件判定のロジックを、具体的なコード例と分かりやすい解説でご紹介します。読み終える頃には、JavaScriptで簡単なプログラムを自分で書けるようになっているでしょう。

Web制作やシステム開発の第一歩を踏み出したいあなたは必見です!

JavaScriptの「計算」をマスターしよう

プログラミングにおいて、計算は最も基本的な処理の一つです。JavaScriptでは、私たちが普段使っている数学の計算と同じように、数値の足し算、引き算、掛け算、割り算を行うことができます。さらに、少し特殊な「剰余演算子」を使うと、割り算のあまりを求めることも可能です。

これらの基本的な計算処理を理解することは、複雑なロジックを組み立てる上で非常に重要になります。

四則演算と剰余演算の基本

JavaScriptで計算を行う際に使う演算子は以下の通りです。

  • 足し算: +
  • 引き算: -
  • 掛け算: *
  • 割り算: /
  • 剰余演算: % (割り算のあまり)

これらの演算子を使って、様々な計算を試してみましょう。

エンジニア

%演算子(剰余演算子)は、たとえば「偶数か奇数か」を判定する際や、「配列の要素を循環させたい」といった時に非常に便利ですよ。

デザイナー

なるほど!例えば「今日のラッキーカラーは?」って毎日変わるデザインとか作る時に、日付を割り算してあまりで色を変える、みたいなこともできるんですね!

実装例:JavaScriptでの計算

// 足し算
let sum = 10 + 5; // sumは15

// 引き算
let difference = 20 - 7; // differenceは13

// 掛け算
let product = 4 * 6; // productは24

// 割り算
let quotient = 25 / 5; // quotientは5

// 剰余演算(割り算のあまり)
let remainder = 10 % 3; // remainderは1 (10を3で割ると3あまり1)

console.log(`合計: ${sum}`);
console.log(`差: ${difference}`);
console.log(`積: ${product}`);
console.log(`商: ${quotient}`);
console.log(`あまり: ${remainder}`);

JavaScriptの「条件判定」で処理を分岐させる

プログラムは、常に同じ処理をするわけではありません。ユーザーの入力内容や、ある時点でのデータの状態に応じて、異なる処理を行う必要があります。ここで活躍するのが「条件判定」です。

JavaScriptではif文を使って、「もし〜ならば、この処理を実行する」という条件に基づいたプログラムの流れを作ることができます。

if文と比較演算子、論理演算子

条件判定には主に以下の要素を使います。

  • if文: 条件が真(true)の場合に処理を実行。else ifelseと組み合わせて複数の条件やそれ以外のケースに対応。
  • 比較演算子: 二つの値を比較し、真(true)か偽(false)かを判定。
    • == (等しい ※型変換あり)
    • === (厳密に等しい ※型変換なし)
    • != (等しくない ※型変換あり)
    • !== (厳密に等しくない ※型変換なし)
    • < (より小さい)
    • > (より大きい)
    • <= (以下)
    • >= (以上)
  • 論理演算子: 複数の条件を組み合わせる。
    • && (AND: 両方の条件が真なら真)
    • || (OR: いずれかの条件が真なら真)
    • ! (NOT: 条件を反転させる)

これらの組み合わせで、より複雑な条件判定が可能になります。

エンジニア

比較演算子の=====の違いは重要です。===は型も厳密に比較するので、意図しない挙動を防ぐためにも、基本的には===を使うのがベストプラクティスとされています。

デザイナー

「厳密に」ってことは、例えば数字の「5」と文字列の「”5″」は==だと同じだけど、===だと違うってことですか?ややこしいけど、バグを防ぐためには大切なんですね!

実装例:JavaScriptでの条件判定

let score = 75;
let hasPassed = false;

// 基本的なif文
if (score >= 60) {
  hasPassed = true;
  console.log("合格です!");
} else {
  console.log("不合格です。再挑戦しましょう。");
}

// 複数の条件を組み合わせる (論理AND)
let age = 18;
let hasLicense = true;

if (age >= 18 && hasLicense === true) {
  console.log("運転できます。");
} else {
  console.log("運転できません。");
}

// 複数の条件を組み合わせる (論理OR)
let isRainy = true;
let isSnowy = false;

if (isRainy || isSnowy) {
  console.log("傘を持っていきましょう。");
} else {
  console.log("良い天気ですね!");
}

まとめ

この記事では、JavaScriptのプログラミングにおける基礎の基礎、「計算」と「条件判定」について解説しました。これらの概念をしっかり理解すれば、より複雑なWebアプリケーションやシステム開発への道が開きます。

  • 計算は、数値データの処理に不可欠な要素です。四則演算子や剰余演算子を使いこなしましょう。
  • 条件判定は、プログラムに柔軟性を持たせるために必要です。if文、比較演算子、論理演算子を組み合わせて使います。
  • ===(厳密な等価比較)は、型の違いによる予期せぬバグを防ぐために積極的に利用しましょう。
  • 小さなコードを書いて、実際に動かしてみることで理解が深まります。

今日学んだことを活かして、ぜひ色々なプログラムを試してみてください。プログラミングの楽しさを実感できるはずです!

チャンネル登録 よろしくお願いします

こんにちわ!JS太郎です‼
このチャンネルでは、はじめてプログラミングをする人はもちろん、小学生からでも理解出来るように判りやすく解説しています。
是非、一緒にプログラミングを学んでご自身の付加価値を高めていきましょう。

コメントを残す

入力エリアすべてが必須項目です。メールアドレスが公開されることはありません。

内容をご確認の上、送信してください。