JavaScriptの関数

関数とは・・・

再利用可能なコードをまとめたものになります。

関数を使うことでコードの再利用が可能になったり、まとまったコードを定義して後で実行もできます。

何より、あらゆる場面で使うことがかなり多いです。

先に定義の仕方を見てみましょう。

　function 関数名() {

//何らかの処理

　}

上記はあくまで定義になるので、これを書いただけでは関数は実行されません。

実行の仕方

　関数名();

　関数名(); //また実行

このようになります。

それを踏まえた上でサンプルを書いてみます。

// 定義

function singSong() {

console.log('ド');

console.log('レ');

console.log('ミ');

}

// 実行

singSong();

singSong();

 

// 出力結果

// ド

// レ

// ミ

// ド

// レ

// ミ

となります。

・引数について

引数（ひきすう）と読みます。

関数の入力値と思ってください。

上記の関数は入力値を受け取らないため、何度実行しても同じ結果になります。

function 関数名(引数) {

//この中に記述する処理で引数が使える

}

上記のように定義します。

サンプルを書いてみます。

function greet(firstName, lastName) {

console.log(`Hi, ${firstName} ${lastName}.`);

}

//引数に値を渡す

greet('Taro', 'Yamada');

// 出力結果

// Hi Taro Yamada.

上記は引数に複数の値を入れて実行しています。

1つの関数を作るだけで、さまざまなケースに対応できるようになるのが引数の大きな特徴です。

・戻り値について

関数は戻り値を設定することで、関数内で処理した結果を返すことが可能です。

関数内にreturn文を記述することで、任意の値を返すことができます。

組み込みメソッドは実行すると値が返ってくる（returnされる）

→この値を保持しておける

下記のように使うことができます。

function add(x,y) {

return x + y;

}

add(5, 10)

// 15

returnを記述するだけで、足し算をした結果を返すようになります。

ここで注意ですが、return文はreturnで関数をその時点で終わらせ、関数からどんな値を返すかも指定ができます。

ただ、例外があり、便利に使うこともできます。

条件分岐も組み込みながらサンプルを書いてみます。

function add(x, y) {

if (typeof x !== 'number' || typeof y !== 'number') {

return false;

}

return x + y;

}

 

add(10, 20) // 30

add(2,'a') //false

もし引数に数字以外が入った場合は、returnでfalseを返すようにし、

数字であれば足し算を返すように記述ができます。

このようにreturn文を使えば、関数を普通の値として活用できるようになるので応用範囲が広くなるので覚えておきましょう。