ProgramGuru

Cancel Unneeded Requests

Cancel Unneeded Requests

An AbortController exposes a signal that an operation can observe. A changing school lookup should cancel obsolete work and also avoid letting an older response replace the latest view. This example demonstrates the signal state without making a network call.

Before this topic, review Combine Independent Results if its terms are unfamiliar.

What you’ll learn

  • Explain cancel unneeded requests through the school example.
  • Trace the shown operations and distinguish their result from displayed output.
  • Make the practice change and explain its consequence: Without aborting, the signal stays active. No request was actually sent in this demonstration.

Work through the school example

This is JavaScript using language features and the host console. Read the initial values, then follow each operation to its displayed result. A declaration names a value, a function call performs an operation, and console.log displays its arguments.

JavaScript · school.js · complete example

const controller = new AbortController();
console.log(controller.signal.aborted);
controller.abort();
console.log(controller.signal.aborted);

Expected output

false
true
Run in JavaScript compiler →

Recognize the important boundary

Pass signal to fetch for a real request. Cancellation does not roll back server work that already occurred, and timeout policies are separate decisions.

Try a small variation

JavaScript · original source for practice

const controller = new AbortController();
console.log(controller.signal.aborted);
controller.abort();
console.log(controller.signal.aborted);

Your task: Replace controller.abort(); with /* keep request active */. Predict the result before running the edited program.

The source is repeated here. If the edit targets the HTML rather than the script, use the markup repeated below; the worked answer also repeats the changed markup.

Worked answer and reasoning

Without aborting, the signal stays active. No request was actually sent in this demonstration.

JavaScript · complete worked variation

const controller = new AbortController();
console.log(controller.signal.aborted);
console.log(controller.signal.aborted);

Expected output

false
false
Run in JavaScript compiler →

Predict the original program

JavaScript · original program for this question

const controller = new AbortController();
console.log(controller.signal.aborted);
controller.abort();
console.log(controller.signal.aborted);
What does the original JavaScript program display, in order?
Choose one answer. You can try again.

Answer and explanation

false → true

An AbortController exposes a signal that an operation can observe. A changing school lookup should cancel obsolete work and also avoid letting an older response replace the latest view. This example demonstrates the signal state without making a network call. Pass signal to fetch for a real request. Cancellation does not roll back server work that already occurred, and timeout policies are separate decisions.

Check the important distinction

Can aborting a POST guarantee the server undoes its earlier changes?
Choose one answer. You can try again.

Answer and explanation

No. Cancellation does not guarantee server rollback.

The server may have already processed the request; idempotency and transactional policies are separate.

Keep the useful idea

An AbortController exposes a signal that an operation can observe. A changing school lookup should cancel obsolete work and also avoid letting an older response replace the latest view. This example demonstrates the signal state without making a network call.

Check your variation against this explanation: Without aborting, the signal stays active. No request was actually sent in this demonstration.

Use the JavaScript array reference library for individual array operations and boundary tests to check a rule independently.

Reaching the recap and completing the quizzes are separate milestones.

    Next lesson: Recognize Syntax, Reference and Logic Errors →