遅延デコレータ
重要性: 5
f の各呼び出し毎に ms ミリ秒遅延をするデコレータ delay(f, ms) を作成してください。
例:
function f(x) {
alert(x);
}
// ラッパーを作成
let f1000 = delay(f, 1000);
let f1500 = delay(f, 1500);
f1000("test"); // "test" は 1000ms 後に表示
f1500("test"); // "test" は 1500ms 後に表示つまり、delay(f, ms) “ms 遅延した” f のバリアントを返します。
上のコードにおいて、f は単一引数の関数ですが、あなたの解答はすべての引数とコンテキスト this を渡すようにしてください。
解答:
function delay(f, ms) {
return function() {
setTimeout(() => f.apply(this, arguments), ms);
};
}ここで、アロー関数がどう使われているか注意してください。ご存知の通り、アロー関数は独自の this や arguments を持ちません。なので、f.apply(this, arguments) はラッパーから this と arguments を取ります。
もし、通常の関数を渡す場合、setTimeout はそれを引数なしで、 this=window (ブラウザの場合) で呼び出します。なので、ラッパーからそれらを渡すようにコードを書く必要があります。:
function delay(f, ms) {
// setTimeout の中で、ラッパーから this と 引数を渡すための変数を追加
return function(...args) {
let savedThis = this;
setTimeout(function() {
f.apply(savedThis, args);
}, ms);
};
}function delay(f, ms) {
return function() {
setTimeout(() => f.apply(this, arguments), ms);
};
};