Skip to content

Commit 047e1f0

Browse files
chvmvdchvmvd
authored
「論理値と論理演算子」の章を改訂 (#10)
1 parent 36fdd15 commit 047e1f0

File tree

3 files changed

+69
-47
lines changed

3 files changed

+69
-47
lines changed

‎docs/06-boolean/_samples/quiz-program/index.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!doctype html>
2+
<html lang="ja">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>クイズ番組</title>
6+
</head>
7+
<body>
8+
<script src="./script.js"></script>
9+
</body>
10+
</html>

‎docs/06-boolean/_samples/quiz-program/script.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
let tanakaScore = 120;
2+
let suzukiScore = 100;
3+
let isTanakaWinner = tanakaScore >= 100 && tanakaScore - suzukiScore >= 20;
4+
document.write(isTanakaWinner); // true

‎docs/06-boolean/index.mdx‎

Lines changed: 55 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -2,32 +2,36 @@
22
title: 論理値と論理演算子
33
---
44

5-
## <Term>論理値</Term>
5+
## 論理値
66

7-
{/* prettier-ignore */}
8-
<Term>JavaScript</Term> で利用できる「<Term>値</Term>」として、これまで<Term>文字列</Term>と<Term>数値</Term>を扱いました。
9-
JavaScript ではこの他に、<Term>**論理値**</Term>と呼ばれる、「正しいか、正しくないか」を表すための<Term>値</Term>が存在します。
7+
JavaScript で利用できる「<Term>値</Term>」として、これまで<Term>文字列</Term>と<Term>数値</Term>を扱いました。
8+
JavaScript にはこの他に、**論理値**と呼ばれる、「正しいか、正しくないか」を表すための<Term>値</Term>が存在します。
9+
10+
次のプログラムを実行すると、`true` と表示されます。
11+
12+
```javascript
13+
document.write(true);
14+
```
15+
16+
このように<Term>論理値</Term>は、ダブルクォーテーション `"` を使わずに直接 `true` (「正しい」という意味) または `false` (「正しくない」という意味) と書くことにより表現します。
1017

1118
{/* prettier-ignore */}
12-
<Term>論理値</Term>は、`true` または `false` の 2 つだけです。
13-
ダブルクォーテーション `"` は必要ありません。
14-
通常の<Term>値</Term>ですので、<Term>変数</Term>に<Term>代入</Term>したり、計算に使ったりすることができます。
19+
<Term>論理値</Term>も<Term>文字列</Term>や<Term>数値</Term>と同じように<Term>値</Term>の一種なので、<Term>変数</Term>に<Term>代入</Term>したり、計算に使ったりすることができます。
1520

1621
![値の種類・論理値付き](./value-types-with-boolean.drawio.svg)
1722

18-
## 論理<Term>演算子</Term>
23+
## 論理演算子
1924

2025
{/* prettier-ignore */}
2126
<Term>論理値</Term>に対して使える<Term>演算子</Term>が存在します。
2227

2328
```javascript
24-
document.write(true); // true
25-
document.write(!false); // true
29+
document.write(!true); // false
2630
document.write(true && false); // false
2731
document.write(true || false); // true
2832
```
2933

30-
それぞれの演算子の意味は以下の通りです。
34+
それぞれの<Term>演算子</Term>の意味は次のようになります。
3135

3236
| 演算子 | 意味 | 詳細 |
3337
| ------ | ---------- | ------------------------------------------------------------------- |
@@ -37,34 +41,34 @@ document.write(true || false); // true
3741

3842
具体的な使用例を考えてみましょう。
3943

40-
モンスターが大きいかどうかを表す変数 `isMonsterBig` と、ハンターが強いかどうかを表す変数 `isHunterStrong` が用意されています。
44+
ハンターが強いかどうかを表す変数 `isHunterStrong` とモンスターが大きいかどうかを表す変数 `isMonsterBig` が用意されています。
4145

4246
このとき、ハンターがモンスターと戦うべきかどうかを表す変数 `shouldFight` を作りたいとします。
4347

4448
ハンターは自分が強いときかモンスターが小さいときに戦うべきだとしたら、変数 `shouldFight` は次のようになるでしょう。
4549

4650
```javascript
47-
let isMonsterBig = true;
4851
let isHunterStrong = false;
52+
let isMonsterBig = true;
4953
let shouldFight = isHunterStrong || !isMonsterBig; // false
5054
```
5155

52-
## 比較<Term>演算子</Term>
56+
## 比較演算子
5357

54-
比較<Term>演算子</Term>は、複数の<Term>値</Term>を比較して、1 つの<Term>論理値</Term>を得ます。
58+
比較演算子は、複数の<Term>値</Term>を比較して、1 つの<Term>論理値</Term>を得ます。
5559

56-
年齢を判定するプログラムを考えましょう。
60+
年齢を判定するプログラムを考えてみましょう。
5761

58-
```javascript
59-
let age = 14;
60-
document.write(age === 15); // false
61-
document.write(age === 14); // true
62+
```javascript showLineNumbers
63+
let age = 12;
64+
document.write(age === 12); // true
65+
document.write(age === 13); // false
6266
```
6367

64-
`===` は左辺と右辺が等しいかどうか判定する比較演算子です。
65-
上のコードでは `age` と 15 とは等しくないので `false` が、下のコードでは `age` と 14 とは等しいので `true` が表示されます。
68+
`===` は左辺と右辺が等しいかどうかを判定する比較演算子です。
69+
上のプログラムの 2 行目では `age` と `12` は等しいので `true` になり、3 行目では `age` と `13` は等しくないので `false` になります。
6670

67-
他にも下記のような比較演算子があります。
71+
他にも次のような比較演算子があります。
6872

6973
| 演算子 | 意味 | 詳細 |
7074
| ------ | ---------- | ------------------------------- |
@@ -77,51 +81,55 @@ document.write(age === 14); // true
7781

7882
論理演算子と比較演算子を組み合わせた使用例を考えてみましょう。
7983

80-
ジェットコースターに乗れるかどうかを表す変数 `canRideRollerCoasters` を考えます。
81-
年齢を表す変数 `age` と身長を表す変数 `height` が与えられたとして、10 歳以上かつ身長が 120cm 以上でないと乗れないとしたら以下のようになるでしょう。
84+
年齢を表す変数 `age` と身長を表す変数 `height` が用意されています。
85+
86+
このとき、ジェットコースターに乗れるかどうかを表す変数 `canRideRollerCoasters` を作りたいとします。
87+
88+
10 歳以上かつ身長が 120 cm 以上でないと乗ることができないとしたら、変数 `canRideRollerCoasters` は次のようになるでしょう。
8289

8390
```javascript
84-
let age = 15;
85-
let height = 155;
91+
let age = 12;
92+
let height = 150;
8693
let canRideRollerCoasters = age >= 10 && height >= 120; // true
8794
```
8895

8996
:::tip
9097

91-
`&&` や `||` よりも比較演算子のほうが先に計算されます。
92-
そのため、この例では `age >= 10` と `height >= 120` がそれぞれ先に計算され、その結果に対して `&&` が使用されています。
98+
`&&` や `||` などの論理演算子よりも比較演算子のほうが先に計算されます。
99+
そのため、`age >= 10 && height >= 120` は `(age >= 10) && (height >= 120)` と同じ意味になります。
93100

94101
:::
95102

96-
## 課題
103+
## 演習問題
97104

98-
クイズ番組で自分とライバルが戦っています。
99-
自分の点数が `myPoint` で、ライバルの点数が `rivalPoint` で用意されています。
105+
クイズ番組で田中さんと鈴木さんが戦っています。
100106

101-
自分の点数が 100 点以上で、かつライバルより 20 点以上高い点数の場合に勝ちとします。
102-
自分が勝ちかどうかを表す変数 `iAmWinner` を作成してください。
107+
田中さんの点数を表す変数 `tanakaScore` と、鈴木さんの点数を表す変数 `suzukiScore` が用意されています。
103108

104-
```javascript
105-
let myPoint = 120;
106-
let rivalPoint = 80;
107-
let iAmWinner = /* ここに式を書いてください */;
108-
document.write(iAmWinner); // true
109-
```
110-
111-
:::tip
109+
点数が 100 点以上で、かつ相手より 20 点以上高い場合に勝ちとします。
112110

113-
`+`, `-`, `*`, `/` などの算術演算子は、比較演算子よりも先に計算されます。
111+
田中さんが勝ちかどうかを表す変数 `isTanakaWinner` を作成してください。
114112

115113
```javascript
116-
let isBig = 10 + 5 > 10 - 3; // 15 > 7 なので true
114+
let tanakaScore = 120;
115+
let suzukiScore = 100;
116+
let isTanakaWinner = /* ここを書いてください。 */;
117+
document.write(isTanakaWinner); // true
117118
```
118119

119-
:::
120-
121120
<Answer title="クイズ番組">
122121

123122
```javascript
124-
let iAmWinner = myPoint >= 100 && myPoint - rivalPoint >= 20;
123+
let isTanakaWinner = tanakaScore >= 100 && tanakaScore - suzukiScore >= 20;
125124
```
126125

126+
<ViewSource url={import.meta.url} path="_samples/quiz-program" />
127+
128+
:::tip
129+
130+
`+`、`-`、`*`、`/` などの演算子は、比較演算子よりも先に計算されます。
131+
そのため、`tanakaScore - suzukiScore >= 20` は `(tanakaScore - suzukiScore) >= 20` と同じ意味になります。
132+
133+
:::
134+
127135
</Answer>

0 commit comments

Comments
 (0)