コールバック関数とは？

Question

**コールバック関数とは、
特定の処理が終わってから実行される命令のこと。
と
コールバック関数とは引数の()内に書かれた関数のこと

上記二説あるのですがどちらが正しいのでしょうか？

コールバック関数とは引数の()内に書かれた関数のことということですが、
即時関数特有の最後に来る（）;関数が入っていてその関数を他の関数に渡す関数のことをコールバック関数というということでよいのでしょうか？

alert(関数);
ということも可能なのですね。
つまり関数は引数の中に入れられるのですね。

例
alert(関数1+1);
なら（）内で関数が実行され（2）となり実行結果をalertが受け取り、
2と出る

alert(alert(2+5));
なら7とでる。

Answer 1

後発ですが、いままでの質疑応答を見ているとまだ解決していないようなので、参戦。

alert(alert(2+5));

この例は見た目だけで明らかにコールバック関数ではありません。
alert(2+5) という引数では、関数を渡しているのではなく、 alert を呼び出した結果を渡してしまっています。
コールバック関数は引数として渡した関数を呼び返してもらうものです。そのためには関数を引数に渡す必要があります。
具体的には関数名か function (x) {...} というような名無しの関数を渡します。
もし、 alert をコールバックしてほしいなら、 alert の関数名のみを引数に渡す必要があります。

function f (callback) {
  callback("I call you!");
}

f(alert)

これで、 "I call you" と画面に表示されるはずです。

特定の処理が終わってから実行される命令のこと

JavaScript でコールバック関数が多用されるのは処理が非同期に実行されるためです。しかし、コールバック関数自身は、非同期にならない場合でも使われるのでこの定義はおかしいと思います。

Comments

[退会済みユーザー]

特定の処理が終わってから実行される命令のこと
これはjqueryの学校に記載があったのですが、有名な本でも間違えがあるとはびっくりです。

[mit0223]

間違いと言っても、「厳密には定義としておかしい」ということであって、教科書であれば、わかりやすいように「細かいことは除いて、そう覚えておいてください」ということだったのではないでしょうか。うーん、でもあまりわかりやすくもないような・・・

[退会済みユーザー]

ありがとうございます。

＞＞＞
alert(2+5) という引数では、関数を渡しているのではなく、 alert を呼び出した結果を渡してしまっています

alert(2+5)を渡せておらず、7という結果のみを渡してしまっているので、そもそも関数をわたしておらず、
関数を渡していないわけないので、コールバック関数ではないということですね。

つまり引数に関数を書けばコールバック関数という考えが違うというのは何となくわかりました。

定義した関数名(alert)のように引数には関数名だけを記載するのがコールバック関数なのですね。
つまり、関数名(関数のみ)というのがコールバック関数で、
関数名（関数名(引数)）というものは絶対にコールバック関数ではなく、
あくまでカッコないの関数を処理した結果を外の関数に渡しただけで、関数自体を送ってはいないので、
コールバック関数になりえないということなのですね。

[mit0223]

はい、書いていただいたこと（関数を関数の引数で呼び出してもコールバックとは言いません）で間違いありません。

[退会済みユーザー]

まとめてみましたがこれで良いでしょうか？

**コールバック関数
引数に記載される、関数自体のみを関数に渡したときに、その渡した関数のことをコールバック関数と呼ぶ。
無名関数のようにただそのような配置位置、役割、動きをする関数に名前を付けただけで、特別な関数が存在するわけではない。
定義した関数名(alert)のように引数には関数名だけを記載するのがコールバック関数。
「引数として渡される関数」です。

例
function f (callback) {
callback("I call you!");
}
f(alert)

f(alert)のように関数のみを引数に記載するのがコールバック関数

上記の実行結果。
一番下で呼び出しが実行され、
alertが
(callback)に入り、
callback("I call you!");のcallbackに渡され、
alert("I call you!");となり、ブラウザに文字が表記される。

・
alert(alert(2+5));はコールバック関数ではないらしい。
alert(2+5)を渡せておらず、7という結果のみを渡してしまっているので、そもそも関数をわたしておらず、
関数を渡していないわけないので、コールバック関数ではないということですね。
つまり引数に関数を書けばコールバック関数という考えが違う。

定義した関数名(alert)のように引数には関数名だけを記載するのがコールバック関数なのですね。
つまり、関数名(関数のみ)というのがコールバック関数で、
関数名（関数名(引数)）というものは絶対にコールバック関数ではなく、
あくまでカッコないの関数を処理した結果を外の関数に渡しただけで、関数自体を送ってはいないので、
コールバック関数になりえないということなのですね。

・どんな時に使う

1. 非同期処理の中で、決まった順序で処理を実行したい
2. 関数を渡す形にすることで、非同期処理を実行した後の処理の内容を自由に決めたい

他関数の引数として使用し、特定のタイミングで実行させることができます。
「あの処理が終わった後に、この関数を実行したい」など。

例
アニメーションで、右に動いた後に下に動いて、点滅するという場合に使う。
一つの動きが終わった後に、別の関数を渡すことで次の処理が引き続き行われるようになる。

ただ、上記の動きのJSをただ上から順番においても同じような動きにできるような気がします？
上から順に動いていく場合と何が違うのでしょうか？
動きを買えたいなと思った時に、動きののソースの順番を変えれば同じことができるものの、
関数内の順番を変えたくないので、コールバック関数を使って、関数の呼び出し順を変えるだけで動きの順番を変えられるのがコールバック関数の唯一のメリットなので消化？

[think49]

To: webpage さん
> 関数名（関数名(引数)）というものは絶対にコールバック関数ではなく、
"関数名(引数)" の返り値が関数になる場合があるので「絶対」ではありません。
代表的なところでは Function() がありますが、他にもクロージャを使ってそういう関数を書く場合があります。
最終的に「関数」が引き渡せればいいのです。
書き方を決めうちしなくていいと思います。

> ただ、上記の動きのJSをただ上から順番においても同じような動きにできるような気がします？
そう思うのなら実際に非同期処理のコードを書いてみるといいと思います。
トライアンドエラーは基本です。

[mit0223]

私が「関数の引数に関数名を書く」と書いたのは「alart(2+5)」のように実引数まで書いてしまうと関数がその場で呼び出されてしまうので、alart という関数を渡すことにはならない。alart という関数を引数で渡したい（=コールバックして欲しい）なら、関数名だけを渡すようにする必要があるという意味でした。

すこし、不安になったので確認です。 Javascript においては「関数もデータとして扱える（＝変数に代入したり、引数に渡したり、返却値として返したり、オブジェクトのメンバ変数の値にしたりできる）というのはご理解されていると思いますが、よろしいでしょうか？
つまり、関数はどこにでも現れることができますので、引数に渡す場合もその書き方に制限はありません（＝関数名を書くとは限りません）。

例1：（f は渡された関数を "I call you!" という引数付きでコールバックするものとする）
別の関数の返却値として帰ってきたものを渡す
function g() {
return alart;
}
f(g());

例2：（f は渡された関数を "I call you!" という引数付きでコールバックするものとする）
オブジェクトのメンバ変数を渡す
var obj = {func: alart};
f(obj.func);

すべて結果は同じです。

[退会済みユーザー]

＞＞＞
Javascript においては「関数もデータとして扱える（＝変数に代入したり、引数に渡したり、返却値として返したり、オブジェクトのメンバ変数の値にしたりできる）

（データ＝変数に代入したり、引数に渡したり、返却値として返したり、オブジェクトのメンバ変数の値にしたりできる）
ということですね。

＞＞＞
つまり、関数はどこにでも現れることができますので、引数に渡す場合もその書き方に制限はありません（＝関数名を書くとは限りません）。

関数は文法上ここにしか書けないと決まっているのではないのですね。
好きな所にかけて、しかも引数の（）も必須ではないのですね。

alert(alert())とカッコ内のalertに(引数)までつけてしまうと、カッコ内の関数が渡されるのではなく、カッコ内の関数がまず実行されて、
その実行結果だけが渡されるので、関数が渡されておらず、結果的にコールバック関数になっていないということですよね。

[mit0223]

はい、あっていると思います。

[退会済みユーザー]

ありがとうございました。

Answer 2

関数を引数で与えれば、それ即ちコールバック関数である
という認識はあやまりであります。
JavaScriptでいうと…

例えば、htmlで「onClick=」に指定する関数、
これもコールバック関数といえます。
あとは単純に

var hoge = function() {
  console.log('HOGE');
};
var piyo = function(callback) {
  console.log('PIYO');
  callback();
};
// 呼び出しはこんな感じで
piyo(hoge);

要するに、コールバック関数を指定する関数が
そのように実装されていないと意味はない
って話デス。

Comments

[退会済みユーザー]

間違っているのはわかったのですが、
するとコールバック関数とは何のことなのですか？

Answer 3

**コールバック関数とは、

特定の処理が終わってから実行される命令のこと。
と
コールバック関数とは引数の()内に書かれた関数のこと
上記二説あるのですがどちらが正しいのでしょうか？

どちらもコールバック関数の一面でしかなく、本質を記していません。

コールバック関数とは、他のコードの引数として渡される関数です。

その利用方法の一つが
・特定の処理が終わってから実行される命令（非同期処理の制御）
であり、表現の一つが
・引数の()内に書かれたもの
です。

合わせたものをコールバック関数と呼ぶのも正確ではありません。あくまで一面です。

Comments

[退会済みユーザー]

難しいですね。
初心者にもわかるように砕けた情報はありますか？

[退会済みユーザー]

そんな中途半端なことをしていてはいつまでたっても正しい理解が出来ません。

定義のあるものは定義を、マニュアルのあるものはマニュアルを、公式見解のあるものは公式見解を理解するのが一番です。

まぁ、コールバック関数に関しては、元々はただの英語なので、定義が曖昧ですが、wikiで述べていることが共通認識かと。

https://ja.wikipedia.org/wiki/%E3%82%B3%E3%83%BC%E3%83%AB%E3%83%90%E3%83%83%E3%82%AF_(%E6%83%85%E5%A0%B1%E5%B7%A5%E5%AD%A6)

その中で、理解できない箇所を解説してもらうのが正しい理解方法です。

Answer 4

alert(alert(2+5))なら、ブラウザの開発ツールを使えばその場で動作確認もできると思いますが、これは以下のように動作します。

1. まず内側の2+5が計算される
2. そして、内側のalertが実行されて、「7」を表示する
3. 内側のalertの返り値はundefinedなので、それが外側のalertに渡って「undefined」と表示される

ということで、これは単に関数の結果を別な関数に渡しているだけで、コールバックではありません。

コールバックは、「結果ではなく関数そのものを別な関数に渡すこと」です。もちろん、「渡しただけで全く実行しない」のではほぼ意味がありませんので、実用的には渡した関数が「あとから実行される」ことになります。

Comments

[退会済みユーザー]

2まではわかるのですが、

＞＞＞
内側のalertの返り値はundefinedなので、それが外側のalertに渡って「undefined」と表示される
がよくわかりません。

undefinedは変数に始めから入っている値と聞いていますが、
この場合7に上書きされて7が外側のalertにわたって、7が出てくるのではないですか？
実行してみると７と出ました。

[maisumakun]

「7」のalertを消したあとに、もう1つ「undefined」のalertが出てきませんか？

[退会済みユーザー]

＞＞＞
特定の処理が終わってから実行される命令のこと。
と
コールバック関数とは引数の()内に書かれた関数のこと

上記の両方を合わせたものということでしょうか？
コールバック関数とは引数の()内に書かれた関数のことで、特定の処理（関数）が終わってから実行されるということですか？

じょうきなら内側のalertが終わってから、それが外側のalertに渡され、
それが終わってから実行される。
そのような()内にある関数のことをコールバック関数と呼ぶということでしょうか？

[maisumakun]

JavaScriptの例で言えば、addEventListener（jQueryの.on()）のような感じで、「関数そのものを引数として渡す」（実行のタイミングは関数を渡したタイミングとは関係ない）ようなものです。

alertの例はコールバックとは無関係なので、いまは置いておいてください。

[退会済みユーザー]

関数そのものを引数として渡すとの場合の関数のことをコールバック関数となずけたということですか？
無名関数のようにただ、引数になっている関数のことをそのようになずけただけということでしょうか？

[maisumakun]

表現は違いますが、「プログラム中で、呼び出し先の関数の実行中に実行されるように、あらかじめ指定しておく関数」（http://e-words.jp/w/%E3%82%B3%E3%83%BC%E3%83%AB%E3%83%90%E3%83%83%E3%82%AF%E9%96%A2%E6%95%B0.html）とか「他のコードの引数として渡されるサブルーチン」（https://ja.wikipedia.org/wiki/%E3%82%B3%E3%83%BC%E3%83%AB%E3%83%90%E3%83%83%E3%82%AF_(%E6%83%85%E5%A0%B1%E5%B7%A5%E5%AD%A6)）というように定義されています。

[退会済みユーザー]

難しいですね。
初心者にもわかるように砕けた情報はありますか？

また、なんでundefinedが来るのかもよくわかりません。
もともと変数に入っているからですか？

確認はconsole.logで実行しないと見れないということでしょうか？

[maisumakun]

alertは返り値としてundefinedを返します（https://developer.mozilla.org/ja/docs/Web/API/Window/alert）

[退会済みユーザー]

https://developer.mozilla.org/ja/docs/Web/API/Window/alert
にその記載が見当たりせんが、
alertは返り値としてundefinedを返すと決まっているんですかね？
というよりもundefindedとは定義されていないだと思いますが、
この正体は一体何なんですかね？

[maisumakun]

確かに書いていませんね…ただ、JavaScriptの関数はすべて何かしらの値を返します。そして、returnを書かなかった場合やreturn;だけで値なしの場合、undefined値が返ります。

[退会済みユーザー]

ありがとうございました。

alert(2+5)を渡せておらず、7という結果のみを渡してしまっているので、そもそも関数をわたしておらず、
関数を渡していないわけないので、コールバック関数ではないということですね。

つまり引数に関数を書けばコールバック関数という考えが違うというのは何となくわかりました。

定義した関数名(alert)のように引数には関数名だけを記載するのがコールバック関数なのですね。
つまり、関数名(関数のみ)というのがコールバック関数で、
関数名（関数名(引数)）というものは絶対にコールバック関数ではなく、
あくまでカッコないの関数を処理した結果を外の関数に渡しただけで、関数自体を送ってはいないので、
コールバック関数になりえないということなのですね。

という結論に達したことをご報告いたします。