JavaScript/function

function

function は、JavaScriptにおける再利用可能なコードのブロックであり、特定のタスクを実行するために設計されています。関数は引数を受け取り、計算を行い、結果を返すことができます。

構文

// 関数の定義
function add(a, b) {
  return a + b;
}

// 関数の呼び出し
const result = add(2, 3); // 5

説明

JavaScriptの関数は、特定のタスクを実行するためのコードの集合です。関数は定義することで、その後複数回呼び出して使うことができます。
関数は任意の数の引数を取ることができ、必ずしも引数を必要としない場合もあります。また、戻り値を指定しない場合もあります（undefined が返される）。
関数は、通常、関数名を使って呼び出しますが、無名関数や関数式（関数リテラル）を使って代入することもできます。

使用例

// 関数の定義と呼び出し
function multiply(x, y) {
  return x * y;
}

console.log(multiply(4, 5)); // 20

// 引数なしの関数
function sayHello() {
  console.log("Hello, World!");
}
sayHello(); // "Hello, World!"

// 無名関数（関数式）
const subtract = function(a, b) {
  return a - b;
};
console.log(subtract(10, 5)); // 5

// アロー関数（ES6）
const divide = (a, b) => a / b;
console.log(divide(10, 2)); // 5

引数と戻り値

関数は任意の数の引数を受け取ることができます。引数は関数内でローカル変数として扱われます。
戻り値を指定しない場合、関数は暗黙的に undefined を返します。
返り値は return キーワードを使って指定します。

// 引数の利用
function greet(name) {
  return "Hello, " + name;
}
console.log(greet("Alice")); // "Hello, Alice"

// 戻り値なし（暗黙的に undefined）
function logMessage(message) {
  console.log(message);
}
console.log(logMessage("Hello!")); // undefined

関数の種類

JavaScriptにはいくつかの関数の定義方法があります。

種類	説明
通常の関数	function キーワードを使用して定義され、名前付きまたは無名で使われます。
関数式	無名関数を変数に代入して関数を定義します。
アロー関数	ES6で導入された短縮構文で、function キーワードを省略し、=> を使って関数を定義します。

関数のスコープ

関数内で定義された変数（ローカル変数）は、その関数内でのみアクセスできます。
グローバルスコープにある変数は、関数の外部からでもアクセスできますが、関数内で変更することも可能です。

// スコープの例
let globalVar = "I am global";

function checkScope() {
  let localVar = "I am local";
  console.log(globalVar); // "I am global"
  console.log(localVar);  // "I am local"
}

checkScope();
// console.log(localVar); // Error: localVar is not defined

関数の呼び出し方法

関数は通常、関数名を使って呼び出しますが、関数式やアロー関数の場合は変数名を使って呼び出します。また、apply() や call() を使うことで、this の値を指定して関数を呼び出すこともできます。

// apply() と call() を使用した関数呼び出し
function greetPerson() {
  console.log("Hello, " + this.name);
}

const person = { name: "Bob" };
greetPerson.call(person);  // "Hello, Bob"
greetPerson.apply(person); // "Hello, Bob"

関数と this

関数内で使用される this キーワードは、関数がどのように呼び出されるかによって異なります。通常、関数内での this はグローバルオブジェクトを参照しますが、オブジェクトのメソッドとして呼び出されると、そのオブジェクトを参照します。

// [[../this|this]] の挙動
const obj = {
  name: "Alice",
  greet: function() {
    console.log("Hello, " + this.name);
  }
};
obj.greet(); // "Hello, Alice"

const greetFunction = obj.greet;
greetFunction(); // "Hello, undefined" (グローバルオブジェクトに this が設定されるため)

参考