Aikakatkaisut ja keskeyttäminen AbortControllerilla
Lisää asynkroniseen koodiin aikakatkaisuja ja peruuta työ AbortControllerilla; välitä signaalit tehtäviin, jotta ne voidaan pysäyttää ajoissa
Aikakatkaisut ja keskeyttäminen AbortControllerilla on ilmainen JavaScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 2/3. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu JavaScript Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. JavaScript Academy-kurssilla on yhteensä 3 oppituntia.
Miksi aikakatkaisuja ja keskeytyksiä?
Tavoite: Pysäyttäkää pitkään kestävät tehtävät turvallisesti.
- Yksinkertaisen aikakatkaisun lisääminen
- AbortController-olion käyttäminen
- signal-arvon välittäminen tehtävälle
- Ajastinten siivoaminen
Signaalin huomioiva tehtävä
Luokaa tehtäviä, jotka listen to signal.abort ja pysäyttävät ajastimen peruutuksen yhteydessä.
// Fake fetch that respects AbortSignal
function fakeFetch(ms, value, signal) {
return new Promise(function (resolve, reject) {
// Abort handler
function onAbort() {
clearTimeout(t);
reject(new Error("aborted"));
}
// If already aborted
if (signal && signal.aborted) {
return reject(new Error("aborted"));
}
// Finish timer
const t = setTimeout(function () {
if (signal) {
signal.removeEventListener("abort", onAbort);
}
resolve(value);
}, ms);
// Listen for abort
if (signal) {
signal.addEventListener("abort", onAbort);
}
});
}
fakeFetch(5, "OK").then(function (v) {
console.log("fakeFetch:", v);
});
Abort toiminnassa
Luokaa ohjain, välittäkää sen signal-arvo ja kutsukaa abort()-metodia peruutusta varten.
// AbortController cancels signal-aware tasks
const controller = new AbortController();
fakeFetch(20, "Too slow", controller.signal)
.then(function (v) {
console.log("done:", v);
})
.catch(function (e) {
console.log("catch:", e.message);
});
// Abort after a short delay
setTimeout(function () {
controller.abort();
console.log("aborted");
}, 5);
Aikakatkaisun kääre
Käyttäkää Promise.race-menetelmää hylkäämiseen, jos tehtävä kestää liian kauan. Tyhjentäkää ajastin finally-lohkossa.
// Add a timeout to any Promise with Promise.race
function withTimeout(promise, ms) {
return Promise.race([
promise,
new Promise(function (_resolve, reject) {
const t = setTimeout(function () {
reject(new Error("timeout"));
}, ms);
// Small trick: clear timer when the main promise settles
promise.finally(function () { clearTimeout(t); });
})
]);
}
// Demo: this will time out
withTimeout(fakeFetch(30, "late"), 10)
.then(function (v) { console.log("value:", v); })
.catch(function (e) { console.log("timeout:", e.message); });
Aikakatkaisu ja keskeytys yhdessä
Jos aikakatkaisu voittaa, kutsukaa abort()-metodia, jotta taustalla oleva työ pysähtyy aikaisemmin.
// Combine: abort if timeout fires
async function fetchWithTimeout(msWork, msTimeout) {
const c = new AbortController();
const task = fakeFetch(msWork, "data", c.signal);
// If timeout wins, abort the task
try {
const result = await withTimeout(task, msTimeout);
return result;
} catch (e) {
c.abort();
throw e;
}
}
fetchWithTimeout(25, 10)
.then(function (v) { console.log("got:", v); })
.catch(function (e) { console.log("failed:", e.message); });
Vinkit ja tarkistuslista
Vinkit:
- Tyhjentäkää ajastimet aina finally-lohkossa.
- Välittäkää signal tehtäville ja tarkistakaa signal.aborted.
- Suosikaa yhtä ohjainta pyyntöä kohden.
AbortController-perusteiden koe
Pikatarkistus: Peruutusmalli.
Kertaus
Kertaus: Rakensitte signaalin huomioivan tehtävän, peruutitte sen AbortControllerilla, lisäsitte aikakatkaisun Promise.race-funktion avulla ja yhdistitte nämä turvallisia ennenaikaisia lopetuksia varten.
Opi JavaScript tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 59
- Oppitunnit
- 200
Usein kysytyt kysymykset
Onko oppitunti ”Aikakatkaisut ja keskeyttäminen AbortControllerilla” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa JavaScript Academy-oppimispolun 3 oppituntia, myös oppitunnin “Aikakatkaisut ja keskeyttäminen AbortControllerilla”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. JavaScript Academy-kurssilla on yhteensä 3 oppituntia.
Mitä opin oppitunnilla ”Aikakatkaisut ja keskeyttäminen AbortControllerilla”?
Lisää asynkroniseen koodiin aikakatkaisuja ja peruuta työ AbortControllerilla; välitä signaalit tehtäviin, jotta ne voidaan pysäyttää ajoissa Harjoittelet JavaScript Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni JavaScript Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin JavaScript Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 2/3.
Kuinka kauan ”Aikakatkaisut ja keskeyttäminen AbortControllerilla”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä JavaScript Academy-oppitunnilla?
Kyllä. Jokainen JavaScript Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- Asynkronisten funktioiden kirjoittaminen; try/catch; rinnakkainen ja peräkkäinen suoritus
- Aikakatkaisut ja keskeyttäminen AbortControllerilla
- Uudelleenyritys- ja backoff-mallit