第1章 JavaScript導入ガイド

関数

2017年8月2日

関数の定義と呼び出し

関数の基本的な使い方

関数とは、呼び出すことのできる処理の集まりのことです。プログラム内で何回も同じ処理をするようなときは、処理の部分を切り離して関数にしてしまうのがスマートなやり方です。そうすれば、何回も同じソースを書く必要がなくなるので、時間の節約にもなります。

例えば次のコードは、渡した数値を2倍にして返す関数を定義し、その関数を呼び出しています。

// 関数の定義
function func(V){
return V * 2;
}
// 関数の呼び出し
var ret = func(10);

関数の宣言

関数は function で宣言します。

構文
function 関数名([引数[, 引数[, ... 引数]]]) {
[命令文]
}
関数名
関数名を指定します。呼び出すときはこの関数名を使います。
引数
関数は呼び出す際に値を渡すことができます。関数に渡す値のことを引数と呼びます。
引数は関数のブロック内で使うことができます。このとき渡される引数は値渡しとなります。関数内でその値をどのように変更しても、元の変数には影響ありません。ただし、オブジェクトは参照渡しとなります。
命令文
実行したい命令文を記述します。
返却値
関数が返す値のことを返却値と呼びます。返却値に指定したい値は、return キーワードを使って指定します。
関数は必ず値を返し、値の指定がない場合は undefined が返されます。

下記の例では引数を2倍にした値を返します。

// 関数の定義
function func(V){
return V * 2;
}

関数の呼び出し

関数を呼び出すには、関数名とかっこを使って、以下のようにします。

func();

呼び出す際に引数を渡すことができます。

func(100);

関数の呼び出しは関数定義の前に行えます。

// 関数の呼び出しと、返却値の出力
console.log( func(100) );
// 関数の定義
function func(V){
return V * 2;
}
200

クロージャ・無名関数と即時関数

無名関数の概要(関数リテラル)

関数名を付けず、関数式によって作成することができます。このような関数名がない関数を無名関数と呼びます。

var func= function(V) { return V * 2; };
console.log( func(10) );
20

ライブラリの作成時などに力を発揮しますが、簡単なところでは引数に関数を渡したいときなどに便利です。

var str = "test";
// replaceの第2引数に無名関数を渡しています
var ret = str.replace(/[a-z]/g, function(v) {
return v.toUpperCase();
}); 
console.log(ret);
TEST

無名関数を定義と同時に実行する

無名関数は次の構文で定義と同時に実行することができます。

構文
( function( ){...} )( );

たとえば次の無名関数は定義と同時に実行されます。

(  function(){
console.log("hello"); 
}  )();

hello

クロージャの概要

関数は自身のブロックの中に関数を内包することができます。

function outerFunc() {
function func() {
}
}

内包された関数は親関数の変数にアクセスすることができます。内部の関数が外側の関数の変数にアクセスできる仕組みのことを、クロージャと呼びます。

function outerFunc() {
var x = 2;
return function (){
return x++;
}
}
var func = outerFunc();
func();

2

func();

3

上記では、outerFunc()の内部にある無名関数が外側の関数の変数 x をインクリメントしています。
外側の関数の変数 x は永続化されて呼び出された後も値を保持しています。変数を永続化や隠蔽をするのがクロージャの利点です。

再帰関数

自分自身を呼び出す関数のことを再帰関数と呼びます。無限に関数が呼び出されないように、通常は終了条件を設定します。

function loop(x) {
// 再帰関数の終了条件
if ( x >= 50 ) return;
console.log( x );
// 再帰呼出し
loop(x + 1); 
}
loop(0);

Comment

コメントを残す

メールアドレスが公開されることはありません。

関連記事

リズムファクトリーはホームページの制作会社です。
ホームページ制作に関するご要望・ご相談はこちらからどうぞ。

株式会社リズムファクトリーでは現在、下記の職種について人材募集を行っております。
求人をクリックすると「求人情報サイトFind Job!」の求人詳細画面が開きますので、こちらからご応募下さい。

提供 : Webな人の求人情報サイト Find Job!