4. throttle()を実装する
JavaScriptLodashお役に立つのか?
シェアしよう
トータルで - accepted /- tried
パフォーマンスのために、throttle()、特に lodash throttle() の実装はよく使われています。
自力でthrottle()
を実装してください。
throttle(func, delay)
はスロットルされた関数を返す。返された関数はどう頻繁に実行されても指定されている頻度以上に元の関数を実行することはない。
以下は例です。
スロットルされる前の実行順:
─A─B─C─ ─D─ ─ ─ ─ ─ ─ E─ ─F─G
3ユニットでスロットルしたら
─A─ ─ ─C─ ─ ─D ─ ─ ─ ─ E─ ─ ─G
- Aはすぐ実行される、クーリングタイムではないから
- Bはスキップされた、BとCともにAのクーリングタイムに入っているから。
補足
- 上記のスペックに従ってください。
lodash.throttle()
と完全に一緒ではありません。 window.setTimeout
とwindow.clearTimeout
は精確ではないから、入力したコードをジャッジするときに、他の実装に入れ替えられます。interfaceが一緒にで、気にしなくて良い。
概ね以下のようにジャッジされます。
let currentTime = 0
const run = (input) => {
currentTime = 0
const calls = []
const func = (arg) => {
calls.push(`${arg}@${currentTime}`)
}
const throttled = throttle(func, 3)
input.forEach((call) => {
const [arg, time] = call.split('@')
setTimeout(() => throttled(arg), time)
})
return calls
}
expect(run(['A@0', 'B@2', 'C@3'])).toEqual(['A@0', 'C@3'])