こんにちは！
フロントエンドエンジニアのあまんちゅです。
AIと一緒に学ぶJavaScript基礎の第二弾です！
前回は JavaScript を「まず動かしてみる」ところから始めました。
コンソールに文字が表示されて、初めてJavaScriptを触ったときのワクワク感を少し思い出せたのではないでしょうか。
今回は、その次のステップで、テーマは
「変数とデータ」
です。
JavaScriptを扱ううえで避けられない大事な部分です！
変数とは？
プログラミングでは、値（データ）を使って処理を行います。ただ、そのデータを都度入力していたら大変ですよね。そこで登場するのが「変数」です。
変数とは…
変数は、「データをしまっておく入れ物」のようなものです。
入れ物にはラベル（名前）がついていて、その中に文字や数字などのデータを入れておくことができます。
変数があることで、あとからそのデータを呼び出したり、変更したりできます。
実際に変数を作ってみる
まずはコンソールで試してみましょう👇
let message = "JavaScriptたのしい！";
console.log(message);実行して、コンソールに
JavaScriptたのしい！
と表示されれば成功です🙌
- ※コンソールの使い方の復習はこちらから💡
変数は変更できる？
変数は、変更できます！
ただし、書き方によって「変更できるもの」「変更できないもの」がありますので、用途によって使い分けが必要です。
JavaScriptでは主に次の3種類の書き方があります。
| キーワード | 変更可否 | 用途イメージ |
|---|---|---|
| let | 変更できる | 値が変わる可能性があるもの |
| const | 変更できない | 固定の設定値など |
| var | 変更できる（※非推奨） | 古い書き方。基本使わない |
最近の開発では、「const」と「let」が主役です。
以前は「var」が一般的に使われていましたが、ES2015（ES6）という新しい仕様で「let」と「const」が登場してから状況が変わりました。
「var」は古い書き方で、挙動が少しわかりにくい点（スコープが広すぎたり、意図せず上書きできてしまうなど）があり、初心者には扱いづらい場面もあります。
そのため現在のJavaScriptでは、
- const：基本はこちらで、値を変えない変数に使う
- let：後から値が変わる可能性があるときにはこちらを使う
という使い分けが一般的になっていて、「var」を使う機会は以前よりぐっと少なくなっています。
基本は constで、必要なときだけ let が出動！
どんなデータを扱える？
変数にはいろいろな種類のデータを入れることができます。
| データの種類 | 例 | 意味 |
|---|---|---|
| 文字列（String） | “Hello” | 文字や文章 |
| 数値（Number） | 10, 3.14 | 数字・計算可能 |
| 真偽値（Boolean） | true / false | YES or NO の値 |
例えば、下記のように記述します。
const name = "あまんちゅ";
const age = 24;
let isEngineer = true;
console.log(name, age, isEngineer);今回のまとめ
- 変数はデータを保存するための「名前付きの箱」
- 「const」は変更不可、「let」は変更可能
- 文字・数字・真偽値などいろいろなデータが扱える
変数の理解は、今後のロジック作成やフレームワークの学習でも土台になる部分です。今回の内容が、次のステップをスムーズに進む助けになれば嬉しいです。
Try（練習）
よかったら、コンソールで次のコードを試してみてください👇
let count = 0;
console.log(count);
count = count + 1;
console.log(count);
count = count + 1;
console.log(count);数字が 0 → 1 → 2 と増えればOKです✨
次回予告
次回は、演算と条件分岐について触れていきます。
「もし○○なら〜する」というロジックが登場し、いよいよプログラムらしくなってきます！
焦らず、ひとつずつ積み重ねていきましょう！
おまけ
AIとの併走メモ🏃♀️💨
今回も、AIに文章構成や説明表現の整理を手伝ってもらいました。
改めてコードを書いたり、理解してまとめる部分は自分の手と頭も使って進めています。
「AIに頼りすぎず、でも一人で抱え込まない」
そんな距離感で進めていければいいなと思っています。
