#目標

main.js

let a = 5;
let b = 3;

//変数aとbどちらか一方が0なるまで各変数の値を-1ずつ引く処理を繰り返して、
//0になったら処理を止める。

変数 a と b どちらか一方が 0 なるまで各変数の値を -1 ずつ引く処理を繰り返して、 0 になったら処理を止めるというプログラムを実装する。

##実装方法を考える
変数 a または b が 0 より大きい間、繰り返せばいいと思ったので

main.js

let a = 5;
let b = 3;

// a または b が0よりも値が大きい時true
while(a > 0 || b > 0) {
  // -1 ずつ値を引く
  a--;
  b--;
  // コンソールに表示
  console.log(`a: ${a}`);
  console.log(`b: ${b}`);
}

のように実装した結果...

a: 2
b: 1
a: 1
b: 0
a: 0
b: -1

上の出力結果を見てみると、「b が 0 になっても処理は止まらず、 a が 0 になった時に処理がやっと止まっている」ことがわかる。

そのため、「変数 a と b どちらか一方が0なるまで各変数の値を-1ずつ引く処理を繰り返して、0になったら処理を止める」という処理を実装できていないことがわかる。

#＃もう一つ実装方法を考えてみる
先ほどの実装方法では、「a または b が 0 よりも値が大きいとき、処理を繰り返す」
としたので次に、「a または b が 0 以下ではないとき、処理を繰り返す」というのを実装してみた。

main.js

let a = 3;
let b = 2;

// a または b が0 以下ではないとき true
while(!(a <= 0 || b <= 0)) {
  // -1 ずつ値を引く
  a--;
  b--;
  // コンソールに表示
  console.log(`a: ${a}`);
  console.log(`b: ${b}`);
}

のように実装した結果...

a: 2
b: 1
a: 1
b: 0

上のように b が 0 になった時点で処理が止められるようになった。

##両者の違い
先ほどの両者の実装方法の違いを改めて確認する。

main.js

// a または b が0よりも値が大きい時true
while(a > 0 || b > 0) {
  // 処理
}

main.js

// a または b が0 以下ではないとき true
while(!(a <= 0 || b <= 0)) {
  // 処理
}

前者の「a または b が0よりも値が大きいとき、処理を繰り返す」というのは言い換えると、
"片方の値が 0 より小さくても、もう一方が 0 より大きい場合は true になる" という意味でもある。

そのため、b が 0 になっても処理が止まらないのそのためであることがわかる。

また、後者の「a または b が0 以下ではないとき処理を繰り返す」というのは言い換えると

"片方の値が 0 以下であればその時点で false が返される" ということになるので、b が 0 になった時点で処理が止まることがわかった。