【Javascript】3つの関数定義

ウェブ制作技術

こんにちは。樋口です。
Javascriptを日々使います。難しいですが、奥が深く楽しいです。

めんどくさい環境作りとかが不要で、
ブラウザですぐ出力結果が確認できるのでいい具合です。

JSFiddle とか jsdo.it なんかのサービスもいい雰囲気ですよね。

本日はJavascriptの関数定義について紹介します。
Javascriptの関数定義の方法は3つあります。

function命令で定義

こういうのです。
いちばん直感的でわかりやすい気がします。

Functionコンストラクタで定義

これはあんまり一般的ではないです。
引数の末尾に関数本体を指定し、その前に関数に渡す実際の引数を指定します。

「引数や関数本体を文字列で定義できる」という不思議な特長がありますが、
ややこしいため避けたほうが無難です。

関数リテラル(関数式)で定義

これも最初のfunction命令と同じくらいよく使うかたちです。
変数に、関数を代入してます。
なので、あとからその変数に文字列とか別のデータを代入することもできます。

こんな感じです。

ちなみに、名前がない状態で(名なしの関数を変数に代入して)定義されるので、匿名関数とか無名関数とか呼ばれます。

function命令は呼び出しの後ろでも定義できるけど、関数リテラルはできない(巻き上げ)

これ正常に動きます。

でもこれは正常に動きません。

これは

function命令での定義・・・コードを解析するタイミング(最初)で関数を登録
関数リテラルでの定義・・・実行時に関数を登録

という違いによるものです。

function命令で定義した関数は、どこからでも呼び出せます。尻軽ですね。

これを「巻き上げ(ホイスティング)」と呼びます。
巻き上げは、変数定義にもあります。


以上、Javascriptの関数定義のお話でした。
明日のお昼はカツ丼にしよう!

あなたのビジネスのWeb戦略を、ぜひキタックにおまかせください。

効果を出すためのサイト運営、集客できるウェブ広告

ブログの更新情報をお知らせしています。