search
LoginSignup
41

More than 5 years have passed since last update.

posted at

updated at

Organization

JavaScriptでコールバック関数にあらかじめ引数を渡したい!

JavaScriptではイベント処理などで何かとコールバックを使います。でもコールバックが受け取る引数は普通はコールバックを呼び出す側が決めてしまうので自前の引数を渡したいと思うと少し工夫しないといけません。
このサイトを参考にいたしました。
Javascriptでイベントハンドラのコールバック関数に引数を渡す

callback1.js
var action = function(evt){
    alert(evt);
}
var button = document.getElementById("button");
button.addEventListener("click",action,true);

これではactionに渡されるものはevtだけです。
1、二回呼んでみる。関数の中でactionを呼んでみるパターンです。

callback_rap.js
var action = function(evt,arg1,arg2){
    alert(arg1+evt+arg2);
}
var button = document.getElementById("button");
button.addEventListener("click",function(evt){ action(evt,"foo","bar")},true);

2、関数を返す方法

callback_callObj.js
var action = function(arg1,arg2){
    return function(evt){
        alert(arg1+evt+arg2);
    }
}
var button = document.getElementById("button");
button.addEventListener("click", action("foo","bar"),true);

二個目の方法は確かサイ本でプライベート変数の作成をエミュレートする方法として書いてあった気がします。JavaScriptの変数はコールオブジェクトのプロパティとなるので関数が作成された時のarg1とarg2はactionが受け取っていた値で決まってしまうのです。
今回、僕はイベント処理として使ったわけではないですが、コールバック処理には何かと使えるのではないかと思います。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
41