JavaScript code runs on a single thread, in event loop when method push to web apis return callback function to queue, listener queue and callstack is empty push callback function execute it in callstack, so the asynchronous execution is really just changing the execution order of the functions? Why?
Due to JavaScript being single-threaded, it is technically only concurrent, not parallel. That is, no two instructions are ever executed at the same time, but the event loop allows us to coordinate the order in which instructions are executed such that certain instructions are non-blocking.
To see why this is useful, consider the following sequence of steps:
Step 1 could take quite some time, and we may want to do some other work in the meantime while we wait for it to complete, making it a blocking call. In a purely sequential world, this means that step 2 will not execute until step 1 has been completed. In comparison, if we make this asynchronous, and therefore non-blocking, we can execute steps 1 and 2 concurrently. This happens because the event loop will run an iteration of our synchronous code first (step 2), then run our asynchronous code (step 1) - it is changing the order instructions are executed in such a way that our code is non-blocking. Interestingly, this means an asynchronous delay of 0 seconds will run after the next synchronous iteration of code.
Say we introduce step 3, in which we need the response from the API call in step 1. To do this, we can use an async-await, which will be blocking until step 1 completes. This is not purely sequential, as Step 2 does not need to wait for step 1 to complete, but at step 3 we are able to create a synchronous point in our code via async-await. So we are able to keep our code non-blocking where it matters, and still introduce a particular sequence of events.