質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.47%

  • JavaScript

    17065questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • jQuery

    6944questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

【jQuery】関数名にカッコがない呼び出し方は何?

解決済

回答 2

投稿

  • 評価
  • クリップ 2
  • VIEW 6,601

k499778

score 502

現在jQueryを使ってプログラムを作っていました。
ちなみに以下のリンクを見ていました。
http://semooh.jp/jquery/api/ajax/serialize/+/

ここでshowValuesメソッドを呼び出す際、「カッコなし」で呼び出していますが、
この文法はまだ私はなじみがありません。
普段はfunctionを使ってその中で「カッコあり」の関数名で呼び出します。

この「カッコなし」の関数の呼び出し方は何でしょうか?どういった文法でしょうか?
もし参考になるサイトがあれば教えていただきたいです。

調べ方が難しくなかなかヒットしないためお力を借りたいと思います。
お願いします。

$("form").change(function(){  //いつもはこの書き方。括弧あり。
  showValues()
});
$("form").change(showValues);  //今回の書き方。括弧なし。この書き方知らない
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

checkベストアンサー

+4

JavaScript コールバック とかで検索するとわかるかと思います。

$("form").change(function(){  //いつもはこの書き方。括弧あり。
  showValues()
});

$("form").change(cb);

function cb(){
  showValues();
}


と同義なのはわかりますか。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/03/28 01:05

    https://kenju.gitbooks.io/js_step-up-to-intermediate/content/content/part03/callback.html

    これとか。

    キャンセル

  • 2016/03/28 09:16 編集

    回答ありがとうございます。
    リンク先わかりやすかったです。

    ・javascriptだと関数もオブジェクトなので、引数として指定できる。
    ・今回の「カッコなし」はいわゆるコールバック関数で、このよう書き方をし、処理の最後にコールバック関数が実行される。
    ・「カッコがある」とその場で実行されてしまう。
    ・「カッコあり」は実際その場で関数を実行する書き方

    といった感じでしょうか?

    「コールバック関数」か「実際に関数を呼び出している」かの違いなのかなあと勉強して思いました。
    呼んでいる関数は同じだけど、呼び出し方が違うと。

    いろいろ勉強になりました。
    ありがとうございます!

    キャンセル

  • 2016/03/28 09:47 編集

    「呼んでいる関数は同じだけど、呼び出し方が違うと。」
    動作としてはそうなんですが、 .change(cb) としている際は「呼び出している」のではなく、「changeという関数を呼び出す、その際の引数はコールバック関数(オブジェクト)」と理解するのがいいです。

    引数なのであって、その時点では呼び出されていません。
    change()関数の中でどこかでその引数を実行する箇所があった際に初めてよびだされます。

    キャンセル

+3

$("form").change(showValues);


において、change() に渡しているのは関数オブジェクトです。

function add2(x) {
  return x + 2;
}


という整数を引数にとる関数があったとして、

console.log(add2(3)); // (1) add2() にリテラルの整数を渡す
var y = 3;
console.log(add2(y)); // (2) add2() に変数に入った整数を渡す


のように、「整数リテラル」あるいは「変数に入った整数」で実引数を渡せますが、関数を引数にとるような関数でも同じようなことができます。

function execTwice(func) {
  console.log([func(1), func(2)];
}


てな感じの関数があったとして、

execTwice(function(x) { return x * 2; }); // (1) execTwice() にリテラルの関数を渡す
var sub2 = function(x) { return x - 2; };
execTwice(sub2);                          // (2) execTwice() に変数に入った関数を渡す


というように「関数リテラル」あるいは「変数に入った関数」を、実引数として関数 (execTwice) に渡せます。
また、関数の場合は、先の add2() のようにfunction文で定義した関数を名前で渡すことができます (sub2 の方はfunction式 で定義)。

execTwice(add2);                          // (3) execTwice() に function 文で定義した関数を渡す


ご質問に戻りますと、change() に渡している showValues は、「function文で生成された関数オブジェクトが代入された変数」か「function 式で定義された関数名」かのいずれかです。

誤解されているかもしれないので念のため付け加えておきますが、ご質問に書かれていた「カッコあり」の方も、change() に渡しているものは関数呼び出しではありません。関数の定義です。関数の呼び出しは通常、関数オブジェクトの後ろに () をつけて呼び出すものです。(showValues() は関数の呼び出し


2016-04-27 追記
「function 文」という用語は正しくなく、「関数宣言」とすべき、とのご指摘をいただきました。
「function 式」の方もあわせて「関数式」と置き換えるとよさそうです。
詳しくは、関数と変数の巻き上げの違いとは - teratail に対する私の回答への think49 さんのコメントをご覧ください。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2016/03/28 09:23

    回答ありがとうございます。
    詳しく具体的に説明していただき感謝しています。

    >ご質問に書かれていた「カッコあり」の方も、関数呼び出しではありません。関数の定義です。関数の呼び出しは通常、関数オブジェクトの後ろに () をつけて呼び出すものです。

    「カッコあり」の方は「showValues()」と関数オブジェクトの後ろに括弧があるので、関数呼び出しではないのでしょうか?

    少しそこだけ疑問に思いました。

    ただ色々と教えていただきありがとうございます。

    キャンセル

  • 2016/03/28 09:45

    おじゃまします。
    こちらの説明の方が詳しいのでこちらにつけます。
    「カッコあり」の方については「無名関数」を調べてみるといいですよ。その場一度限りで使う関数オブジェクトを名前を省略しながらその場で定義し、コールバックとして渡している、というものです。

    カッコがないのは呼び出しでない、というのもそうですが、どちらかというと「引数としてオブジェクトを渡す」という考えによるものと理解した方がいいと思います。

    キャンセル

  • 2016/03/28 09:59

    「カッコあり」、「カッコなし」と書かれていたのは、showValues にカッコがついているかいないか、ということだったのですね
    私が言いたかったのは、change() に渡しているものはいずれも「関数」であり、「関数を呼び出したもの」ではない、ということです。change() の中でいつ実行されるかはわかりません。最後とは限りませんし、私の示した execTwice() のように複数回実行されるかもしれません。

    キャンセル

  • 2016/03/28 10:06

    回答の方に追記&修正しておきました。

    キャンセル

  • 2016/04/27 08:32

    別の質問において、「function 文」というのは正しい用語じゃないよ、というご指摘をいただきましたので、回答に追記しておきました。

    キャンセル

関連した質問

同じタグがついた質問を見る

  • JavaScript

    17065questions

    JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

  • jQuery

    6944questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。