Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 29 additions & 29 deletions docs/1-trial-session/09-functions/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -104,61 +104,61 @@ document.write(multiply(3, 4));
## <Term>変数</Term>の<Term>スコープ</Term>

{/* prettier-ignore */}
<Term>関数</Term>内で<Term>宣言</Term>された<Term>変数</Term>は、<Term>関数</Term>内でのみ有効です。<Term>変数</Term>が有効な範囲のことを、その<Term>変数</Term>の<Term>**スコープ**</Term>と呼んでいます。
<Term>関数</Term>やif文などの中で`let`や`const`を使って宣言された<Term>変数</Term>は、それらの内部でのみ有効です。<Term>変数</Term>が有効な範囲のことを、その<Term>変数</Term>の<Term>**スコープ**</Term>と呼んでいます。

{/* prettier-ignore */}
<Term>関数</Term>外で<Term>宣言</Term>された<Term>変数</Term>は<Term>関数</Term>内でも利用できます。
次の例では、<Term>関数</Term>`greet`の中で<Term>変数</Term>`message`を宣言しています。

```javascript
function greet() {
let message = "Hello!";
document.write(message); // Hello! と表示される
}

greet();
```

ここで、<Term>関数</Term>の外側から`message`を利用しようとするとエラーになります。

```javascript
function greet() {
let message = "Hello!";
}

greet();

// document.write(message); これはエラーになる
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

エラーになるサンプルコードを提供しない、という方針に従いコメントアウトしている

```

一方で、<Term>関数</Term>の外側で宣言された<Term>変数</Term>を<Term>関数</Term>の内側から利用することは可能です。

```javascript
let guestCount = 0;

function greet() {
guestCount += 1;
guestCount = guestCount + 1;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ここで初出の += が出てくるとノイズなので、ここでは普通に今まで扱った方法で書き、下のコラム内で「これを += に書き換えられる」という説明をするようにしています

document.write("あなたは" + guestCount + "人目のお客様です。");
}

greet(); // あなたは1人目のお客様です。
greet(); // あなたは2人目のお客様です。
```

この例における、`greet`<Term>関数</Term>は、呼び出されるたびに`guestCount`に1を加えています。

:::tip[複合代入演算子]

[**複合代入演算子**](https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Expressions_and_Operators#%E4%BB%A3%E5%85%A5%E6%BC%94%E7%AE%97%E5%AD%90) は、計算と代入を同時に行うことができる演算子です。

`x += y`は、`x = x + y`という意味になります。他にも`-=`や`*=`などの演算子が定義されています。`x -= y`は`x = x - y`、`x *= y`は`x = x * y`という意味になります。

```javascript
guestCount += 1;
```

は以下の文のように読み替えられます。
上の例の

```javascript
guestCount = guestCount + 1;
```

:::

:::warning[<Term>変数</Term>の<Term>**スコープ**</Term>]

{/* prettier-ignore */}
<Term>スコープ</Term>が終わった<Term>変数</Term>は、その時点で破棄されます。
は以下のように書き換えることができます。

```javascript
let outer = 0;

function increment() {
let inner = 0;
outer += 1;
inner += 1;
document.write(outer); // 1ずつ増える
document.write(inner); // 常に1
}

increment();
increment();
guestCount += 1;
```

:::
Expand Down