1
00:00:00,730 --> 00:00:01,930
In this video.

2
00:00:01,960 --> 00:00:02,920
Let's dive in.

3
00:00:02,920 --> 00:00:05,510
More to talk about cost.

4
00:00:06,220 --> 00:00:15,100
So again, what is called stuck where the cost tag is a data structure that is used to track the execution

5
00:00:15,100 --> 00:00:16,630
of function calls.

6
00:00:16,870 --> 00:00:19,460
Well, so let's see the steps involved.

7
00:00:19,480 --> 00:00:23,800
Let's say that we have the function that we want to call.

8
00:00:24,040 --> 00:00:33,460
Remember, we have two types of code that we write, whether asynchronous programming code or asynchronous

9
00:00:33,460 --> 00:00:34,180
code.

10
00:00:34,360 --> 00:00:40,570
So when you say asynchronous code, they are code that does not block other code from running.

11
00:00:41,050 --> 00:00:48,280
But for asynchronous programming or code, the code blocks other from run, meaning it runs in order,

12
00:00:48,280 --> 00:00:50,180
as you saw in the previous video.

13
00:00:50,200 --> 00:00:56,410
That's why it says that JavaScript is a single threaded programming language, but it also says that

14
00:00:56,410 --> 00:00:58,950
JavaScript is also non blocking.

15
00:00:58,960 --> 00:01:02,980
So now let's say that we have this function that we want to run.

16
00:01:02,980 --> 00:01:04,480
Let's see the flow.

17
00:01:04,660 --> 00:01:10,240
Well, first of all, this function will be passed to what is called event loop.

18
00:01:10,630 --> 00:01:17,020
But before it gets even loop, the function will put on to what is called callback queue.

19
00:01:17,380 --> 00:01:24,970
Well, so the event loop manages which callback function to be put inside the code stack.

20
00:01:25,760 --> 00:01:31,150
So in the mix here, we have a component called the callback queue.

21
00:01:31,160 --> 00:01:36,680
So this function we put inside this callback queue and the event loop will always check.

22
00:01:36,680 --> 00:01:40,380
Is there any function or callback that has to be executed?

23
00:01:40,400 --> 00:01:43,540
Then the event loop will put it inside the callback.

24
00:01:43,550 --> 00:01:44,510
So let's see.

25
00:01:44,870 --> 00:01:51,710
So now the event loop is now checking where we have a function to be called, assuming this function

26
00:01:51,710 --> 00:01:53,720
has been pulled inside the callback queue.

27
00:01:53,750 --> 00:01:54,560
Have a look.

28
00:01:54,590 --> 00:01:59,660
Now, the event loop will now put this function inside the coaster.

29
00:02:00,460 --> 00:02:06,280
And then assuming there's is a function that you want to call now, it is inside our stack.

30
00:02:06,460 --> 00:02:10,300
And let's say that we have, let's say, three functions that you want to call.

31
00:02:10,509 --> 00:02:14,560
So the event loop always put it inside on a code stack as that.

32
00:02:14,830 --> 00:02:22,270
Now, assuming that it's yet to be executed well, so in the first run, let's say that this function

33
00:02:22,270 --> 00:02:26,080
has finished executing, then it'll pop up from the call stack.

34
00:02:26,530 --> 00:02:32,140
Likewise, the other one finishes, it pops up and lastly also finishes pop up.

35
00:02:32,140 --> 00:02:34,810
And lastly, our costs are destroyed.

36
00:02:35,350 --> 00:02:39,970
So that is it about the cost in a basic flow?

37
00:02:40,210 --> 00:02:47,860
Well, with this concept in mind, to help you to understand the next topic that we are going to talk

38
00:02:47,860 --> 00:02:51,860
about what is called asynchronous and synchronous programming.

39
00:02:51,880 --> 00:02:58,810
Well, we always revisit this idea to enhance our knowledge when it come to JavaScript.