第1引数の関数を設定して第2引数の時間後(単位はミリ秒)、一番最後に受け付けた関数のみ発動する関数を返す。第3引数に true が設定された時は即時発動後、第2引数の時間は関数を受け付けない。
■使用例
function logged( txt ){
var text = _.now();
console.log( "re now : " + txt + " : " + text );
}
var re = _.debounce( logged, 2000 );
re("0");
re("1");
re("2");
re("3");
re("4");
// re("0") 〜 re("4") までは発動しない。re now : 5 : 1430745777135
re("5");
function logged( txt ){
var text = _.now();
console.log( "re now : " + txt + " : " + text );
}
var re2 = _.debounce( logged, 5000, true );
re2("re2 : 0");
re2("re2 : 1");
// re("1") 〜 re("2") までは発動しない。re now : re2 : 0 : 1430746092571
re2("re2 : 2");
■内部構造
_.debounce = function(func, wait, immediate) {
var timeout, args, context, timestamp, result;
// setTimeout() で呼ばれる関数。
var later = function() {
var last = _.now() - timestamp;
if (last < wait && last >= 0) {
// 初回関数発動時からの経過時間が wait 以下で 0 以上の時。
timeout = setTimeout(later, wait - last);
} else {
// 初回関数発動時からの経過時間が wait を超えた時。
timeout = null;
if (!immediate) {
// _.debounce() の第3引数が false なら。
result = func.apply(context, args);
if (!timeout) context = args = null;
}
}
};
// _.debounce() 設定後に返される関数。
return function() {
// 基本的には this = グローバルオブジェクト。
context = this;
// この関数の引数。
args = arguments;
timestamp = _.now();
var callNow = immediate && !timeout;
// timeout == null なら
if (!timeout) timeout = setTimeout(later, wait);
if (callNow) {
// _.debounce() の第3引数が true なら設定後の初回時の関数は以下を設定。
result = func.apply(context, args);
context = args = null;
}
return result;
};
};