Decorador de retraso
Cree un decorador delay(f, ms) que retrase cada llamada de f en ms milisegundos.
Por ejemplo
function f(x) {
alert(x);
}
// crear contenedores
let f1000 = delay(f, 1000);
let f1500 = delay(f, 1500);
f1000("test"); // mostrar "test" después de 1000ms
f1500("test"); // mostrar "test" después de 1500ms
En otras palabras, delay (f, ms) devuelve una variante “Retrasada por ms” def.
En el código anterior, f es una función de un solo argumento, pero en esta solución debe pasar todos los argumentos y el contexto this.
Solución:
function delay(f, ms) {
return function() {
setTimeout(() => f.apply(this, arguments), ms);
};
}
let f1000 = delay(alert, 1000);
f1000("test"); // mostrar "test" después de 1000ms
Tenga en cuenta cómo se utiliza una función de flecha aquí. Sabemos que las funciones de flecha no tienen contextos propios this ni arguments, por lo que f.apply(this, arguments) toma this y arguments del contenedor.
Si pasamos una función regular, setTimeout la llamará sin argumentos y, suponiendo que estemos en el navegador, con this = window.
Todavía podemos pasar el this correcto usando una variable intermedia, pero eso es algo más engorroso:
function delay(f, ms) {
return function(...args) {
let savedThis = this; // almacenar esto en una variable intermedia
setTimeout(function() {
f.apply(savedThis, args); // úsalo aquí
}, ms);
};
}