これまでHTMLとCSSを勉強してきましたが、ここからは少し頭の使い方を変える必要があります。
HTMLは「ここに画像を表示して」という「配置」の指示でした。
しかし、これから学ぶJavaScriptやPHPは、「もし○○なら××して」という「動作（ロジック）」の指示です。
言語によって書き方（文法）は少し違いますが、「考え方」は世界中のプログラミング言語で99%同じです。
このページでは、すべてのプログラミングに共通する「5つの基本概念」を解説します。
目次：プログラミングの5大要素
1. データを入れる箱「変数（へんすう）」
プログラミングで一番最初に覚える概念です。
変数とは、「データを入れておくための、名前付きの箱」のことです。
例えば、ゲームを作る時「スコア」や「プレイヤー名」を覚えておく必要がありますよね？
コンピュータに「これ覚えておいて！」と命令するのが変数の役割です。
イメージ
- 箱の名前：
score（スコア） - 中身：
100
こうしておけば、後で「score の中身を表示して！」と言うだけで、100が表示されます。
さらに、「score に10足して！」と言えば、中身は110になります。
2. データの種類「データ型」
箱（変数）に入れる中身には、種類があります。
コンピュータは融通が利かないので、「これは数字です」「これは文字です」と区別して扱います。
| 種類（型） | 説明 | 例 |
|---|---|---|
| 数値 (Number/Int) | 計算できる数字。 | 100, -5, 3.14 |
| 文字列 (String) | ただの文字。計算できない。 クォーテーション（””）で囲むのがルール。 |
“こんにちは”, “WDM Cafe” |
| 真偽値 (Boolean) | YESかNOか。ONかOFFか。 正解(true)か不正解(false)の2つしか持てない。 |
true, false |
⚠️注意点：
100 は計算できる数字ですが、"100" と囲むと「イチ・ゼロ・ゼロ」という文字扱いになり、計算できなくなります。
3. 運命の分かれ道「条件分岐（if文）」
プログラムに知性を与えるのがこれです。
「もし○○ならAをする。そうでなければBをする」という指示です。
日常の例：雨の日の行動
- 条件： 今、雨が降っていますか？
- YES (true) の場合： 傘を持っていく。
- NO (false) の場合： サングラスを持っていく。
これをコードっぽい書き方（疑似コード）にするとこうなります。
if (雨が降っている) {
傘を持っていく
} else {
サングラスを持っていく
}この「もし〜なら（if）」と「そうでなければ（else）」を使えば、どんな複雑な条件も作れます。
4. 面倒な作業はお任せ「繰り返し（ループ）」
コンピュータが得意なのは「単純作業の繰り返し」です。
「この作業を100回やって」とか「条件を満たす間はずっと繰り返して」と命令します。
代表的な2つのループ
- for文（フォー）： 「10回」など、回数が決まっている時に使う。
- while文（ホワイル）： 「敵を倒すまで」など、回数は分からないがゴールが決まっている時に使う。
日常の例：スクワット
for (回数が10回になるまで) {
スクワットをする
回数を1増やす
}人間なら疲れますが、コンピュータは何万回でも一瞬で処理してくれます。
5. 魔法の呪文「関数（かんすう）」
いくつかの処理をまとめて、名前をつけたものです。
料理の「レシピ」や、魔法の「呪文」だと思うと分かりやすいです。
イメージ：カレーを作る関数
「カレーを作る」という作業には、以下の工程がありますよね。
- 野菜を切る
- 肉を炒める
- 煮込む
これを毎回書くのは大変です。
そこで、これらをまとめて「カレー作成()」という名前の関数（レシピ）として保存しておきます。
あとはプログラムの中で「カレー作成()」と一言呼ぶだけで、中身の3つの工程が自動で実行されます。
これが関数の力です。
まとめ：言語が違ってもやることは同じ
今回紹介した5つの概念。
- 変数（箱）
- データ型（中身の種類）
- 条件分岐（もし〜なら）
- 繰り返し（ループ）
- 関数（まとめ役）
これらは、JavaScriptでも、PHPでも、Pythonでも、iPhoneアプリを作るSwiftでも、全部共通です。
違うのは「書き方（文法）」だけ。
このページの内容を頭の片隅に置いておけば、これから学ぶJavaScriptもPHPも、「あ、これはあの話だな！」とスルスル理解できますよ！