One thread can still have overlapping operations

First, build a mental model

Concurrency means multiple operations can be in progress. An await creates a place where other work can proceed. A value read before that boundary may be stale when the operation resumes.

1. JavaScript can interleave asynchronous operations without executing their statements simultaneously on the same thread.
2. A read followed by a delayed check/write is not automatically an atomic operation.
3. Local state, HTTP transport, an API's authority and a database transaction are different boundaries with different guarantees.
4. A retry can repeat an operation whose first result was lost. Stable operation identity helps distinguish another attempt from another intended action.
5. Use the authority closest to shared data to enforce critical invariants; browser-side checks improve feedback but cannot replace server or database enforcement.

let stock = 5;
async function reserve(quantity) {
  const observed = stock;
  await Promise.resolve(); // another operation can run
  if (observed < quantity) return false;
  stock = observed - quantity;
  return true;
}
const results = await Promise.all([reserve(4), reserve(4)]);
console.log(results, stock); // module context

1. First read

   The first request reads stock 5 and suspends.

2. Second read

   The second request also reads 5 before either continuation writes.

3. Resume

   Both report success and write 1. Eight units were accepted from an initial stock of five.