JavaScriptのクロージャの挙動がわからない
Q&A
Closed
解決したいこと
クロージャの挙動がよくわかりません。
独習JavaScript内の問題の解答に関して、自分が書いたコードと回答のコードの違いで、実行結果が変わる理由がわからないため質問させていただきます。
出された問題
実行をしたら、下記の場合１と場合２が両方実行されるようにします。
※場合１と場合２は最初から定義されているので、自分で作成するのはdelayMessageFactory関数だけになります。
クロージャを使って次の挙動を満たす関数(delayMessageFactory)を実装してみてください。
場合１
//２秒後にalertで「こんにちは」が出力される
const dialog = delayMessageFactory( alert, 2000 );
dialog( "こんにちは" )
場合２
//１秒後にコンソールログで「こんばんは」が出力される
const log = delayMessageFactory( console.log, 1000 );
log( "こんばんは" )
自分が書いたコード
function delayMessageFactory( fn1, time ){
function alert( greeting ){
setTimeout(fn1( greeting ), time)
}
return alert;
}
テキスト内の回答例
比較しやすいように引数と、変数は自分が書いたコードをベースに合わせてあります。
function delayMessageFactory( fn1, time ){
function alert( greeting ){
setTimeout(function(){
fn1( greeting );
}, time)
}
return alert;
}
↓↓回答例のスクリーンショットです。
自分の理解
setTimeOutのコールバック関数に、実引数のconsole.logあるいはalertをそのまま返せば良いと思っていました。
しかし回答では、コールバック関数に無名関数を一度挟んでから、その中の処理で実引数で渡された関数を処理する記述になっているかと思います。（解釈が間違っていたら申し訳ございません。。。）
自分が書いたコードと回答例だと何が変わるのでしょうか？
普段あまりクロージャに触れていないこともあり、初歩的な質問ですがご回答いただけますと幸いです。
1
