JavaScript入門 - 関数とスコープ
関数とスコープ
関数は処理をまとめて再利用するための仕組みです。スコープは変数や関数が有効な範囲を指します。
タスク
関数宣言
function宣言で関数を定義してみましょう。
アロー関数
アロー関数で処理をまとめてみましょう。
引数と戻り値
関数に引数を渡し、戻り値を返してみましょう。
スコープの理解
ローカル変数とグローバル変数の違いを確認しましょう。
ヒント
function宣言・アロー関数・スコープの違いを学びましょう。
参考コード
// 関数の定義とスコープの例
const output = document.getElementById("output");
// 通常の関数宣言
function greet(name) {
return `こんにちは、${name}さん！`
}
output.innerHTML = `<p>${greet("太郎")}</p>`;
// アロー関数
const add = (a, b) => a + b;
output.innerHTML += `<p>3 + 5 = ${add(3, 5)}</p>`;
// スコープの例
let globalVar = "グローバル";
function showScope() {
let localVar = "ローカル";
output.innerHTML += `<p>関数内: globalVar=${globalVar}, localVar=${localVar}</p>`;
}
showScope();
output.innerHTML += `<p>関数外: globalVar=${globalVar}</p>`;
// output.innerHTML += `<p>関数外: localVar=${localVar}</p>`; // エラー: localVarは関数外で使えない