【保存版】プログラミングの基本構文を初心者向けにわかりやすく解説【AI時代でも覚えるべき文法】

let score = 80;   // あとで変更する可能性がある値はlet
score = 90;       // letは上書きできる
console.log(score); // 90

const name = "Zetto"; // 変更しない値はconst
// name = "Mirai";    // エラーになる
console.log(name);    // Zetto

const MAX_SCORE = 100;
const PI = 3.14159;

// MAX_SCORE = 200; // エラー：定数は再代入できない

const age = 28;       // 整数
const price = 1980.5; // 小数

const name = "Zetto";       // 文字列型（ダブルクォート）
const greeting = 'こんにちは'; // 文字列型（シングルクォート）

console.log(1 + 2);      // 3（数値の計算）
console.log("1" + "2");  // "12"（文字列の結合になる）

const isLoggedIn = true;  // ログイン済み
const isAdmin = false;    // 管理者ではない

console.log(10 + 3);  // 13（足し算）
console.log(10 - 3);  // 7（引き算）
console.log(10 * 3);  // 30（掛け算）
console.log(10 / 3);  // 3.333...（割り算）

console.log(5 > 3);    // true（5は3より大きい）
console.log(5 < 3);    // false
console.log(5 == "5"); // true（値だけ比較・型は無視）
console.log(5 === "5");// false（値と型を両方比較）

const a = true;
const b = false;

console.log(a && b); // false（AND：両方trueのときtrue）
console.log(a || b); // true（OR：どちらかtrueのときtrue）
console.log(!a);     // false（NOT：反転）

let x = 10;
x += 5;  // x = x + 5 と同じ → 15
console.log(x); // 15

const score = 75;

if (score >= 80) {
  console.log("合格です");
} else if (score >= 60) {
  console.log("もう少しです");
} else {
  console.log("不合格です");
}
// → "もう少しです"

const day = "月";

switch (day) {
  case "月":
    console.log("週の始まりですね");
    break;
  case "金":
    console.log("もうすぐ週末ですね");
    break;
  default:
    console.log("通常の平日ですね");
}

for (let i = 0; i < 5; i++) {
  console.log(i + "回目");
}
// 0回目 〜 4回目

let count = 0;
while (count < 3) {
  console.log("count: " + count);
  count++;
}
// count: 0 〜 count: 2

const fruits = ["りんご", "バナナ", "みかん"];

fruits.forEach((fruit) => {
  console.log(fruit);
});
// りんご、バナナ、みかん

// 関数の定義
function greet(name) {       // nameが「引数」
  return "こんにちは、" + name + "さん！"; // returnが「戻り値」
}

// 関数の呼び出し
console.log(greet("Zetto")); // こんにちは、Zettoさん！
console.log(greet("Mirai")); // こんにちは、Miraiさん！

const greet = (name) => "こんにちは、" + name + "さん！";

console.log(greet("Zetto")); // こんにちは、Zettoさん！

const fruits = ["りんご", "バナナ", "みかん"];
console.log(fruits[0]); // りんご（0番目から始まる）
console.log(fruits.length); // 3（要素の数）

fruits.push("ぶどう");    // 末尾に追加
fruits.unshift("いちご"); // 先頭に追加

fruits.pop();    // 末尾を削除
fruits.shift();  // 先頭を削除

const fruits = ["りんご", "バナナ", "みかん"];

// map（各要素を加工した新しい配列を返す）
const upperFruits = fruits.map((fruit) => fruit + "！");
console.log(upperFruits); // ["りんご！", "バナナ！", "みかん！"]

const user = {
  name: "Zetto",
  age: 30,
  isEngineer: true
};

console.log(user.name); // Zetto（ドット記法）
console.log(user["age"]); // 30（ブラケット記法）

const user = {
  name: "Zetto",
  address: {
    city: "大阪",
    country: "日本"
  },
  skills: ["Java", "TypeScript", "Vue.js"]
};

console.log(user.address.city); // 大阪
console.log(user.skills[0]);    // Java

console.log("Hello, World!");  // テキストを出力
console.log(42);               // 数値を出力
console.log([1, 2, 3]);        // 配列を出力
console.log({ name: "Zetto"}); // オブジェクトを出力

const name = prompt("名前を入力してください");
console.log("こんにちは、" + name + "さん！");

// HTMLに  がある場合
const input = document.getElementById("nameInput");
const name = input.value;
console.log("入力値：" + name);

try {
  // エラーが起きるかもしれない処理
  const result = JSON.parse("不正なJSON文字列");
} catch (error) {
  // エラーが発生したときの処理
  console.error("エラーが発生しました：", error.message);
} finally {
  // エラーの有無に関わらず必ず実行される
  console.log("処理が完了しました");
}

// セミコロンの抜けや括弧の閉じ忘れなど
console.log("Hello" // SyntaxError: 括弧が閉じていない

const user = null;
console.log(user.name); // TypeError: Cannot read properties of null

const globalName = "Zetto"; // グローバル変数

function greet() {
  console.log(globalName); // 関数の中からでもアクセスできる
}

greet(); // Zetto

function greet() {
  const localName = "Zetto"; // ローカル変数
  console.log(localName);
}

greet(); // Zetto
// console.log(localName); // エラー：関数の外からはアクセスできない

if (true) {
  const blockVar = "ブロック内の変数";
  console.log(blockVar); // ブロック内でアクセスできる
}

// console.log(blockVar); // エラー：ブロックの外からはアクセスできない

// これはコメントです
const name = "Zetto"; // 変数nameにZettoを代入

/*
  この関数はユーザーの名前を受け取り、
  挨拶文を返します。
  引数：name（文字列）
  戻り値：挨拶文（文字列）
*/
function greet(name) {
  return "こんにちは、" + name + "さん！";
}

const str = "Hello, Zetto!";

console.log(str.length);            // 13（文字数）
console.log(str.toUpperCase());     // "HELLO, ZETTO!"（大文字に変換）
console.log(str.toLowerCase());     // "hello, zetto!"（小文字に変換）
console.log(str.includes("Zetto")); // true（含むか確認）
console.log(str.replace("Zetto", "Mirai")); // "Hello, Mirai!"（置換）
console.log(str.split(", "));       // ["Hello", "Zetto!"]（分割）
console.log(str.trim());            // 前後の空白を削除

console.log(Math.round(3.7));   // 4（四捨五入）
console.log(Math.floor(3.9));   // 3（切り捨て）
console.log(Math.ceil(3.1));    // 4（切り上げ）
console.log(Math.max(1, 5, 3)); // 5（最大値）
console.log(Math.min(1, 5, 3)); // 1（最小値）
console.log(Math.random());     // 0以上1未満のランダムな数

// 文字列を数値に変換
console.log(Number("42"));      // 42
console.log(parseInt("42px"));  // 42（整数部分を取得）

const now = new Date();
console.log(now);                           // 現在の日時
console.log(now.getFullYear());             // 年（例：2026）
console.log(now.getMonth() + 1);            // 月（0始まりなので+1する）
console.log(now.getDate());                 // 日
console.log(now.toLocaleDateString("ja-JP")); // "2026/5/20"のような形式

const score = 75;

// 条件演算子で1行で書く
const result = score >= 60 ? "合格" : "不合格";
console.log(result); // 合格

// 配列の分割代入
const [first, second, third] = ["りんご", "バナナ", "みかん"];
console.log(first);  // りんご

// オブジェクトの分割代入
const user = { name: "Zetto", age: 30, city: "大阪" };
const { name, age } = user;
console.log(name); // Zetto
console.log(age);  // 30

// 配列の結合
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const merged = [...arr1, ...arr2];
console.log(merged); // [1, 2, 3, 4, 5, 6]

// オブジェクトの結合
const defaults = { theme: "light", lang: "ja" };
const userSettings = { lang: "en", fontSize: 14 };
const settings = { ...defaults, ...userSettings };
console.log(settings); // { theme: "light", lang: "en", fontSize: 14 }

const name = "Zetto";
const age = 30;

// 従来の書き方
console.log("こんにちは、" + name + "さん。" + age + "歳ですね。");

// テンプレートリテラル
console.log(`こんにちは、${name}さん。${age}歳ですね。`);
// こんにちは、Zettoさん。30歳ですね。

class User {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    return `こんにちは、${this.name}です。${this.age}歳です。`;
  }
}

const zetto = new User("Zetto", 30);
const mirai = new User("Mirai", 25);

console.log(zetto.greet()); // こんにちは、Zettoです。30歳です。
console.log(mirai.greet()); // こんにちは、Miraiです。25歳です。

class Engineer extends User {
  constructor(name, age, skill) {
    super(name, age); // 親クラスのconstructorを呼ぶ
    this.skill = skill;
  }

  introduce() {
    return `${this.greet()} メインスキルは${this.skill}です。`;
  }
}

const zetto = new Engineer("Zetto", 30, "TypeScript");
console.log(zetto.introduce());
// こんにちは、Zettoです。30歳です。 メインスキルはTypeScriptです。

const fetchData = new Promise((resolve, reject) => {
  setTimeout(() => {
    const success = true;
    if (success) {
      resolve("データの取得に成功しました");
    } else {
      reject("エラーが発生しました");
    }
  }, 1000); // 1秒後に実行
});

fetchData
  .then((result) => console.log(result))  // 成功時
  .catch((error) => console.error(error)); // 失敗時

async function getData() {
  try {
    const response = await fetch("https://api.example.com/users");
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error("エラー：", error);
  }
}

getData();

// オブジェクト → JSON文字列に変換
const user = { name: "Zetto", age: 30 };
const jsonString = JSON.stringify(user);
console.log(jsonString); // '{"name":"Zetto","age":30}'

// JSON文字列 → オブジェクトに変換
const parsed = JSON.parse(jsonString);
console.log(parsed.name); // Zetto

// 天気APIのレスポンス例（JSON形式）
const weatherData = {
  city: "大阪",
  temperature: 28,
  condition: "晴れ"
};

console.log(`${weatherData.city}の気温は${weatherData.temperature}℃です`);
// 大阪の気温は28℃です

// POSTでデータを送信する例
async function createUser(userData) {
  const response = await fetch("https://api.example.com/users", {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify(userData)
  });

  return response.json();
}

// NG：同じ処理を繰り返している
console.log("ユーザー名：田中");
console.log("ユーザー名：鈴木");
console.log("ユーザー名：佐藤");

// OK：関数にまとめる
function printUser(name) {
  console.log("ユーザー名：" + name);
}

printUser("田中");
printUser("鈴木");
printUser("佐藤");

// 可読性が低い
const x = (a, b) => a > b ? a : b;

// 可読性が高い
function getMaxValue(firstNumber, secondNumber) {
  return firstNumber > secondNumber ? firstNumber : secondNumber;
}

// NG：マジックナンバー
if (score > 80) { /* 処理 */ }

// OK：定数にして意味を明示する
const PASS_SCORE = 80;
if (score > PASS_SCORE) { /* 処理 */ }