Задержка промисами
Добрый день!
Подскажите пожалуйста, необходимо последовательно с индивидуальной задержкой вызвать несколько функций. Пример ниже что получилось, все нормально или есть что исправить или упростить?
function delay(ms) {
return new Promise(function (resolve, reject) {
setTimeout(resolve, ms)
});
}
delay(5000).then(function () {
console.log("1")
});
delay(9000).then(function () {
console.log("2")
});
delay(10000).then(function () {
console.log("3")
});
delay(14000).then(function () {
console.log("4")
});
delay(16000).then(function () {
console.log("5")
});
|
Nlk,
Promise зачем? |
рони,
Для реализации последовательной анимации при загрузке страницы сайта. Я понял, спасибо. Промис тут не нужен для этого, оно и так будет реализовано. |
Nlk,
для данного кода не вижу разницы между
setTimeout(()=>console.log("1"), 5000);
и
delay(5000).then(function () {
console.log("1")
});
|
const obj = {
5000: () => {
console.log(1)
},
9000: () => {
console.log(2)
},
// etc
}
Object.keys(obj).forEach(t => setTimeout(obj[t], t))
|
рони,
Я изначально делал так.
setTimeout(function(){
console.log("1");
setTimeout(function(){
console.log("2");
setTimeout(function(){
console.log("3");
setTimeout(function(){
console.log("4");
setTimeout(function(){
console.log("5");
}, 2000);
}, 4000);
}, 1000);
}, 4000);
}, 5000);
но так не хорошо и решил переписать с помощью промисов. А с промисами у меня не получилось вызывать последовательную задержку после выполнения предыдущей задержки. Поэтому я сделал с нарастающим временем
delay(5000).then(function () {
console.log("1")
});
delay(9000).then(function () {
console.log("2")
});
delay(10000).then(function () {
console.log("3")
});
delay(14000).then(function () {
console.log("4")
});
delay(16000).then(function () {
console.log("5")
});
|
Теперь я понял что промис тут вообще не нужен.
Большое спасибо SuperZen, рони |
последовательное выполнение Promise
Nlk,
как я понимаю последовательность ...
const data = [
{ms : 5000, fn : () => console.log("1")},
{ms : 4000, fn : () => console.log("2")},
{ms : 1000, fn : () => console.log("3")},
{ms : 4000, fn : () => console.log("4")},
{ms : 2000, fn : () => console.log("5")}
];
data.reduce((promise, item) => {
const {ms, fn} = item;
return promise.then(() => new Promise((resolve, reject) => {
setTimeout(()=> (fn(),resolve()), ms)
}));
}, Promise.resolve());
|
const obj = [
{ time: 1000, foo: () => console.log(1) },
{
time: 500, foo: () => {
console.log(2)
}
}
]
obj.reduce(async (p, { foo, time }) => {
await p
return new Promise(res => setTimeout(() => (foo(), res()), time))
}, Promise.resolve())
|
рони,
Большое спасибо, изначально я стремился к данному варианту, но сделать этого не мог. SuperZen, Теперь, не уверен что мне нужен промис для загрузки разной анимации при старте. Больше склоняюсь к вашему первому варианту. Спасибо! Или даже так, на моем уровне это более приемлемо:)
function delay(f, ms) {
setTimeout(f, ms);
}
delay(function () {
console.log(1)
}, 5000);
delay(function () {
console.log(2)
}, 9000);
delay(function () {
console.log(3)
}, 10000);
delay(function () {
console.log(4)
}, 14000);
delay(function () {
console.log(5)
}, 16000);
|
| Часовой пояс GMT +3, время: 15:20. |