JavaScriptの条件分岐とメモリ管理の徹底解説

if (条件) {
    // 条件が真の場合に実行されるコード
}

if (条件) {
    // 条件が真の場合に実行されるコード
} else {
    // 条件が偽の場合に実行されるコード
}

if (条件1) {
    // 条件1が真の場合に実行されるコード
} else if (条件2) {
    // 条件2が真の場合に実行されるコード
} else {
    // いずれの条件も真でない場合に実行されるコード
}

let number = 10;

if (number > 0) {
    console.log("正の数です");
} else if (number < 0) {
    console.log("負の数です");
} else {
    console.log("ゼロです");
}

switch (式) {
    case 値1:
        // 式が値1に等しい場合に実行されるコード
        break;
    case 値2:
        // 式が値2に等しい場合に実行されるコード
        break;
    // 必要に応じてcase文を追加
    default:
        // どのcaseにも該当しない場合に実行されるコード
}

let day = "火曜日";

switch (day) {
    case "月曜日":
        console.log("週の始まりです。頑張りましょう！");
        break;
    case "火曜日":
        console.log("まだまだこれから。");
        break;
    case "水曜日":
        console.log("週の真ん中、折り返し地点です。");
        break;
    case "木曜日":
        console.log("あと少しで週末です。");
        break;
    case "金曜日":
        console.log("明日は週末、もうひと踏ん張り！");
        break;
    case "土曜日":
    case "日曜日":
        console.log("週末を楽しみましょう！");
        break;
    default:
        console.log("無効な曜日です。");
}

条件 ? 真の場合の値 : 偽の場合の値

let number = 10;
let message = number > 0 ? "正の数です" : "負の数です";
console.log(message);

let age = 18;
let access = age >= 18 ? "成人向けコンテンツにアクセス可能" : "未成年のためアクセス不可";
console.log(access);

let score = 85;
let grade = score >= 90 ? "A" : score >= 80 ? "B" : "C";
console.log(grade);

if (条件1) {
    // 条件1が真の場合に実行されるコード
    if (条件2) {
        // 条件2が真の場合に実行されるコード
    } else {
        // 条件2が偽の場合に実行されるコード
    }
} else {
    // 条件1が偽の場合に実行されるコード
}

let age = 20;
let isMember = true;

if (age >= 18) {
    if (isMember) {
        console.log("成人会員として特別な特典があります。");
    } else {
        console.log("成人ですが、会員ではありません。");
    }
} else {
    if (isMember) {
        console.log("未成年会員には限定特典があります。");
    } else {
        console.log("未成年かつ会員ではありません。");
    }
}

let device = "スマートフォン";
let os = "iOS";

switch (device) {
    case "スマートフォン":
        switch (os) {
            case "iOS":
                console.log("iOSスマートフォンを使用しています。");
                break;
            case "Android":
                console.log("Androidスマートフォンを使用しています。");
                break;
            default:
                console.log("不明なスマートフォンOSです。");
        }
        break;
    case "タブレット":
        switch (os) {
            case "iOS":
                console.log("iOSタブレットを使用しています。");
                break;
            case "Android":
                console.log("Androidタブレットを使用しています。");
                break;
            default:
                console.log("不明なタブレットOSです。");
        }
        break;
    default:
        console.log("不明なデバイスです。");
}

// マークフェーズの例
function markPhase() {
    let root = getRootObject();
    mark(root);
}

function mark(object) {
    if (!object.marked) {
        object.marked = true;
        for (let reference of object.references) {
            mark(reference);
        }
    }
}

// スイープフェーズの例
function sweepPhase() {
    for (let object of allObjects) {
        if (!object.marked) {
            delete object;
        } else {
            object.marked = false; // 次のガベージコレクションのためにリセット
        }
    }
}

// 参照カウント法の例
function createObject() {
    let obj = {};
    obj.refCount = 1;
    return obj;
}

function addReference(obj) {
    obj.refCount++;
}

function removeReference(obj) {
    if (--obj.refCount === 0) {
        delete obj;
    }
}

// 悪い例: 不要なグローバル変数
var globalVar = "This is a global variable";

function createClosure() {
    let largeArray = new Array(1000).fill("data");
    return function() {
        console.log(largeArray.length);
    };
}

let closure = createClosure();
// ここで closure を使用し続けると largeArray がメモリに残り続ける

let element = document.getElementById("myElement");
// elementを削除した後も参照が残っている場合
element = null;  // 明示的に参照を解除する必要があります

// 悪い例: タイマーやイベントリスナーの未解除
let intervalId = setInterval(() => {
    console.log("定期的な処理");
}, 1000);

window.addEventListener("resize", () => {
    console.log("ウィンドウサイズが変更されました");
});

// タイマーやイベントリスナーを解除しないとメモリリークの原因になります
clearInterval(intervalId);
window.removeEventListener("resize", ...);

// 良い例: 不要な参照の解除
globalVar = null;

function handleResize() {
    console.log("ウィンドウサイズが変更されました");
}

window.addEventListener("resize", handleResize);

// イベントリスナーを解除
window.removeEventListener("resize", handleResize);

let timeoutId = setTimeout(() => {
    console.log("一度だけ実行される処理");
}, 1000);

// タイマーをクリア
clearTimeout(timeoutId);

let data = [1, 2, 3, 4, 5];
// dataが不要になった場合
data = null;  // 参照を解除

let myMap = new Map();
myMap.set("key", "value");

// 悪い例: 重複する配列の長さ取得
for (let i = 0; i < array.length; i++) {
    // 処理
}

// 良い例: 配列の長さを変数に保存
let length = array.length;
for (let i = 0; i < length; i++) {
    // 処理
}

// 無名関数の例
setTimeout(function() {
    console.log("一度だけ実行される処理");
}, 1000);

// 名前付き関数の例
function timeoutHandler() {
    console.log("一度だけ実行される処理");
}
setTimeout(timeoutHandler, 1000);

// Promiseの例
fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => {
        console.log(data);
    })
    .catch(error => {
        console.error("エラーが発生しました", error);
    });

// async/awaitの例
async function fetchData() {
    try {
        let response = await fetch('https://api.example.com/data');
        let data = await response.json();
        console.log(data);
    } catch (error) {
        console.error("エラーが発生しました", error);
    }
}
fetchData();

// 動的インポートの例
import('module.js')
    .then(module => {
        module.doSomething();
    })
    .catch(error => {
        console.error("モジュールの読み込みに失敗しました", error);
    });

function ageCategory(age) {
    if (age >= 0 && age <= 12) {
        return "子供です。";
    } else if (age >= 13 && age <= 19) {
        return "ティーンエイジャーです。";
    } else if (age >= 20) {
        return "大人です。";
    } else {
        return "無効な年齢です。";
    }
}

// テスト
console.log(ageCategory(10)); // 子供です。
console.log(ageCategory(15)); // ティーンエイジャーです。
console.log(ageCategory(25)); // 大人です。
console.log(ageCategory(-1)); // 無効な年齢です。

// 問題のあるコード
let elements = [];

function createElement() {
    let element = document.createElement('div');
    document.body.appendChild(element);
    elements.push(element);
}

function removeElements() {
    elements.forEach(element => {
        document.body.removeChild(element);
    });
    elements = [];  // メモリリークを防ぐための対策
}

// テスト
createElement();
createElement();
removeElements();

function calculateDiscount(category, price) {
    if (category === "電子機器") {
        if (price >= 1000) {
            return 10;
        } else {
            return 5;
        }
    } else if (category === "衣料品") {
        if (price >= 500) {
            return 15;
        } else {
            return 8;
        }
    } else {
        return 0;
    }
}

// テスト
console.log(calculateDiscount("電子機器", 1500)); // 10
console.log(calculateDiscount("電子機器", 800));  // 5
console.log(calculateDiscount("衣料品", 600));   // 15
console.log(calculateDiscount("衣料品", 300));   // 8
console.log(calculateDiscount("その他", 1000));   // 0

let cache = {};

async function fetchData(url) {
    if (cache[url]) {
        console.log("キャッシュから取得");
        return cache[url];
    } else {
        console.log("サーバーから取得");
        let response = await fetch(url);
        let data = await response.json();
        cache[url] = data;
        return data;
    }
}

// テスト
fetchData('https://api.example.com/data')
    .then(data => console.log(data))
    .catch(error => console.error("エラーが発生しました", error));

fetchData('https://api.example.com/data')
    .then(data => console.log(data))
    .catch(error => console.error("エラーが発生しました", error));