Let's talk about JavaScript.
Run time.
JavaScript runtime simply means the environment where we run our JavaScript code.
JavaScript has too environment where we can run it and one is inside the browser and the other option
is we can also run JavaScript on the server with the help of Node.js.
For this particular video, we are going to focus inside the browser.
If we go to Node.js or backend development, you also see how we can run JavaScript on this server.
So what actually is the JavaScript runtime?
Well, JavaScript runtime in a layman's point of view, it is like a box that contains all the things
we need to run our code.
So onto this point.
Can you tell me some of the things that we need to run our code?
Well, example is a browser itself.
So inside the browser we have other components that can help us to run our code.
And one of them is what we call the console, because the console can also help us to run JavaScript
code with the help of the repo.
Okay.
So apart from that, we also have what is called the VH engine itself.
So all these components are in the browser.
So let's have a look at the other component that makes up the JavaScript runtime inside the browser.
Let's see the first component, and that is the JavaScript engine.
And for these we have talked about it before in the previous video.
So the JavaScript engine runs our code.
So inside the JavaScript engine we also have the other component, and the first component is what we
call core stack.
Well, we have dedicated video to talk more about core stock, but in short, the core stock is a data
structure that is used to track the execution of function calls.
And again, it is used to keep track of the order in which function calls are made.
So let's say that we have a function, one that is yet to be called.
It is put on top of the core stock.
And when the function execution is done, it pops up from the coast.
So let's say that we have these functions yet to be run function one, function two, and function three.
After the function three has finished, run it to pop up, meaning it will remove from the coast tag
in that order.
And apart from the cost tag, we also have what is called heap.
So what is heap?
Well, the heap contains all objects that are created.
But the cost tag also contains any reference to those objects.
That is the heap for you.
And apart from the JavaScript engine, we also have what is called web APIs and these web apps are built
inside the browser.
And one of them is what you call timers.
So for this web API, we also have other components called Dom, of which we will cover in the upcoming
videos.
So the DOM also help us to run JavaScript code and apart from the DOM also have what is called timers.
And you talk about it before one of them is what you call the set timeout.
And again, we have a video to talk more about timers like set timeout and then set interval.
So the web API plus the JavaScript engine, help us to run our code successfully.
And apart from the Web API, we also have what is called the callback queue.
So what is a callback queue?
Well, the callback key contains all the callbacks that are waiting to be executed.
All right.
So, for example, set timeout, set interval or place inside the callback queue.
And for that one too, we also have another technique called event loop.
Well, so the web API is the event loop, the callback queue, the JavaScript engine, the code and
a heap.
All these are some of the environments that we can use to run JavaScript code.
So what is event loop?
Again, we have a section to talk more about event loop and see how it works.
Do you remember that we said that JavaScript is non blocking programming language and you made an example
where we use that timeout to execute code concurrently.
Do you remember because of the event loop?
So we talk more about all these terms over here.
So in short.
When a function has a callback, it put inside a callback queue and always the event loop will check
that.
Okay.
Is there any function or callback that's yet to be called?
If there's one, then the event loop will now take that function and put it on a callback queue.
So on the course tag as that.
So the event loop always check if there's a function here and then if there is one, the event loop
will check if this one is empty then to put it on the cost tag.
That is it about the event loop.
Well, so this example of the JavaScript runtime, the next video, we will talk more about the cost.