1 00:00:07,070 --> 00:00:16,820 In this particular video, let's have a look at features of JavaScript or characteristics of JavaScript. 2 00:00:17,030 --> 00:00:24,110 If I ask you to explain what is JavaScript, we can do so in so many ways. 3 00:00:24,110 --> 00:00:27,820 So let us learn more about JavaScript. 4 00:00:27,830 --> 00:00:37,040 Well, one point about JavaScript is that JavaScript is a single threaded language for each point that 5 00:00:37,040 --> 00:00:38,570 we are going to raise. 6 00:00:38,750 --> 00:00:40,760 We are going to explain it in detail. 7 00:00:40,760 --> 00:00:47,660 So don't worry as you move on, we are going to take them and dive in and explain more about each point. 8 00:00:48,080 --> 00:00:58,850 The second point about JavaScript is that it is a dynamically typed language and it is also an object 9 00:00:58,850 --> 00:01:01,490 oriented programming language. 10 00:01:01,940 --> 00:01:05,720 Again, it is called a garbage collector. 11 00:01:05,990 --> 00:01:10,790 Next is it is a client site programming language. 12 00:01:11,090 --> 00:01:15,620 Next point, it is also a server side programming language. 13 00:01:15,860 --> 00:01:20,180 Next is it is a non blockchain programming language. 14 00:01:20,330 --> 00:01:26,720 And lastly, it is a high level programming language with JavaScript. 15 00:01:26,750 --> 00:01:32,340 We have all these characteristics that define the language. 16 00:01:32,360 --> 00:01:36,020 So let's have a look and take them one by one. 17 00:01:36,050 --> 00:01:41,650 Let's start with JavaScript is a single threaded language. 18 00:01:41,660 --> 00:01:43,280 What does it mean? 19 00:01:44,020 --> 00:01:50,620 This means that JavaScript execute code line by line. 20 00:01:51,310 --> 00:01:54,790 This is because it is using one thread. 21 00:01:54,820 --> 00:02:02,770 Then you may be thinking that well, if JavaScript execute code line by line, then it can affect performance. 22 00:02:02,860 --> 00:02:03,580 Right. 23 00:02:03,700 --> 00:02:06,310 But the answer is no. 24 00:02:06,520 --> 00:02:09,280 And I'll prove to you as we move on. 25 00:02:09,310 --> 00:02:16,420 So with this one, let's get back to visual, see the code and see whether JavaScript run code line 26 00:02:16,420 --> 00:02:17,410 by line. 27 00:02:17,680 --> 00:02:27,220 So back to my Visual Studio code, I have one a HTML and one JavaScript file inside my HTML. 28 00:02:27,250 --> 00:02:36,430 I have only each one and have connected my JavaScript here and inside my JavaScript there is nothing 29 00:02:36,430 --> 00:02:37,180 inside. 30 00:02:37,450 --> 00:02:42,190 So let's see if JavaScript runs code line by line. 31 00:02:42,190 --> 00:02:45,580 So let's comment here and say this is for single. 32 00:02:47,070 --> 00:02:48,420 Third grade. 33 00:02:48,420 --> 00:02:49,290 So here we go. 34 00:02:49,290 --> 00:02:56,790 So let's declare a variable, say my name and is equal to John. 35 00:02:58,070 --> 00:03:01,340 And after that, let's declare age. 36 00:03:01,970 --> 00:03:09,710 Let's say the age variable here is 30, and then let's also declare a function called display. 37 00:03:11,360 --> 00:03:20,030 Cars, display name and every function here and let's say, just console.log. 38 00:03:20,060 --> 00:03:24,620 Let's say my name inside that, my name above. 39 00:03:25,040 --> 00:03:30,050 And after that I also have a function that says Say hello. 40 00:03:30,050 --> 00:03:33,290 So const say hello. 41 00:03:34,300 --> 00:03:36,970 Now when I use arrow function also. 42 00:03:37,210 --> 00:03:38,830 And there you go. 43 00:03:38,860 --> 00:03:41,530 Just say console.log. 44 00:03:41,560 --> 00:03:43,030 Let's say hello. 45 00:03:43,870 --> 00:03:44,610 Great. 46 00:03:44,620 --> 00:03:48,260 So let's call this function, these two functions. 47 00:03:48,300 --> 00:03:48,930 Okay. 48 00:03:48,940 --> 00:03:52,360 So the first function is called display name. 49 00:03:52,630 --> 00:03:56,050 The second function is also say say hello. 50 00:03:56,530 --> 00:03:57,130 Great. 51 00:03:57,130 --> 00:04:05,200 So now before I save this, let's open our console and there you go, let's refresh it. 52 00:04:05,200 --> 00:04:07,900 So when I save it, have a look. 53 00:04:08,080 --> 00:04:12,520 We see that indeed it is running line by line. 54 00:04:12,910 --> 00:04:20,350 When you call this function on line number 13, it comes before line number 14, which says say hello 55 00:04:20,560 --> 00:04:24,730 and remember that console.log is also a function. 56 00:04:25,030 --> 00:04:31,480 So if I bring console that log here, let's say I'm called when I save it. 57 00:04:31,510 --> 00:04:32,950 Let's see the order. 58 00:04:32,950 --> 00:04:37,710 Say hello, will run first, then console.log and then display name. 59 00:04:37,720 --> 00:04:39,400 Have a look when I save it. 60 00:04:39,400 --> 00:04:44,170 And indeed the order is as what you see inside the console. 61 00:04:44,200 --> 00:04:47,890 That is why we see is that JavaScript is a single threaded. 62 00:04:47,920 --> 00:04:53,680 It is waiting for this one to finish running before it goes here and then it goes here. 63 00:04:53,680 --> 00:04:57,970 As we move on, we learn more about how these things happen. 64 00:04:57,970 --> 00:05:04,660 That is one point about JavaScript as a single threaded programming language. 65 00:05:04,750 --> 00:05:11,260 The next point is that JavaScript is dynamically typed language. 66 00:05:11,260 --> 00:05:12,730 What does it mean? 67 00:05:13,000 --> 00:05:20,230 This means that the type of a variable can be changed during the program execution. 68 00:05:20,830 --> 00:05:21,760 What does it mean? 69 00:05:21,940 --> 00:05:30,730 Well, there is a debate about this particular point, that JavaScript must be a strict type programming 70 00:05:30,730 --> 00:05:33,190 language, not dynamically type language. 71 00:05:33,190 --> 00:05:36,870 So what actually is this dynamically typed language? 72 00:05:36,880 --> 00:05:38,680 Well, let's have a look. 73 00:05:38,710 --> 00:05:49,540 So back to visual, see the code here, let's have a comment says dynamically typed language or type 74 00:05:49,540 --> 00:05:50,260 for short. 75 00:05:50,380 --> 00:05:54,460 So let's declare a variable, say full name. 76 00:05:55,160 --> 00:05:59,030 Which is equal to John Doe, for example. 77 00:05:59,600 --> 00:06:11,840 And then let's say the age also is equal to or equal to 28 for this, let's age equal to 28, I think 78 00:06:11,840 --> 00:06:12,800 I have eight being declared. 79 00:06:12,830 --> 00:06:13,670 So let me comment. 80 00:06:13,670 --> 00:06:20,230 This one's out here and now here we have two variables full name and age. 81 00:06:20,240 --> 00:06:28,520 For this we have a variable called full name which holds a string of John Doe and age holds a value 82 00:06:28,550 --> 00:06:33,050 28, which is a number when we say dynamically type language. 83 00:06:33,050 --> 00:06:38,360 Well, we need to specify that for this particular variable. 84 00:06:38,360 --> 00:06:41,960 Indeed, it's supposed to be a string always. 85 00:06:41,960 --> 00:06:49,550 So if you try to update this particular variable, I can change the data type to a boolean or to a number 86 00:06:49,550 --> 00:06:50,390 or whatever. 87 00:06:50,600 --> 00:06:56,300 So let's try to console.log the full name for the meantime and see what we did in the console. 88 00:06:58,820 --> 00:06:59,270 Now. 89 00:06:59,270 --> 00:07:06,670 Indeed, I see John Doe, but I can override this one and change this one to even a boolean or whatever. 90 00:07:06,680 --> 00:07:09,190 So let's update the variable here. 91 00:07:09,200 --> 00:07:10,430 So a full name. 92 00:07:10,430 --> 00:07:13,160 Now I will change this one to, let's say, true. 93 00:07:14,090 --> 00:07:15,260 If I save it. 94 00:07:15,290 --> 00:07:22,670 You can see that I have changed the the full name to true even though at first it was a string, but 95 00:07:22,670 --> 00:07:25,610 now it's a boolean and it works. 96 00:07:25,790 --> 00:07:30,260 That is why we say that JavaScript is dynamically typed. 97 00:07:30,290 --> 00:07:31,330 Language. 98 00:07:31,340 --> 00:07:38,240 Well, it means there are no restrictions on the type of data that can be stored in a variable. 99 00:07:38,390 --> 00:07:46,340 We can store any type of data in a variable, but unlike C++ programming language, we cannot do that. 100 00:07:46,460 --> 00:07:54,170 Well, so if you need a strict type in checking programming language, then we can use a language called 101 00:07:54,170 --> 00:07:55,280 TypeScript. 102 00:07:55,610 --> 00:07:56,210 All right. 103 00:07:56,210 --> 00:07:57,400 So let's continue. 104 00:07:57,440 --> 00:08:03,320 That is one point about is what is dynamically type language. 105 00:08:03,350 --> 00:08:09,720 Next point about JavaScript is that it is object programming language. 106 00:08:09,740 --> 00:08:10,970 So what does that mean? 107 00:08:11,330 --> 00:08:19,340 It is a programming paradigm that uses object as a primary way of representing data, which uses what 108 00:08:19,340 --> 00:08:22,180 is called prototype inheritance. 109 00:08:22,190 --> 00:08:26,370 And this is also a topic on its own for the meantime. 110 00:08:26,390 --> 00:08:29,060 Let's make it very simple here. 111 00:08:29,240 --> 00:08:37,370 When we say prototype, it's a way to create new objects that inherit properties and methods from another 112 00:08:37,370 --> 00:08:38,150 object. 113 00:08:38,179 --> 00:08:39,919 Let me show you in a second. 114 00:08:39,919 --> 00:08:42,650 So back to our Visual Studio code here. 115 00:08:43,070 --> 00:08:45,410 I would say let's say objects. 116 00:08:46,490 --> 00:08:48,590 Oriented programming, Opie. 117 00:08:48,800 --> 00:08:53,270 Let's say we have this simple array with these values. 118 00:08:53,270 --> 00:08:56,060 One, two, three, four, five. 119 00:08:56,910 --> 00:09:01,920 So with the variable that we got, we have all the array methods. 120 00:09:01,920 --> 00:09:06,540 For example, push, pop and shift, let's say pop. 121 00:09:07,700 --> 00:09:10,730 Or a red dot push. 122 00:09:11,640 --> 00:09:16,140 So all these methods, it is not me or you who made it. 123 00:09:16,470 --> 00:09:21,060 This is possible because of what is called prototype inheritance. 124 00:09:21,090 --> 00:09:27,270 That is why we say that JavaScript is object oriented programming language. 125 00:09:27,600 --> 00:09:36,480 The next point is that it is a garbage collector and this means it is a process that frees up memory 126 00:09:36,480 --> 00:09:40,650 by removing objects that are no longer used in the program. 127 00:09:40,650 --> 00:09:43,410 And it's called Garbage Collection. 128 00:09:43,440 --> 00:09:46,270 This is a cool feature about JavaScript, right? 129 00:09:46,320 --> 00:09:51,990 And JavaScript runs in the browser, as you all know, until this point. 130 00:09:52,020 --> 00:09:58,560 Apart from running JavaScript in the browser, we can also run JavaScript on the server with the help 131 00:09:58,560 --> 00:09:59,850 of Node.js. 132 00:09:59,880 --> 00:10:06,390 Now, lucky for us, we can run JavaScript in the browser at the same time on the server to create back 133 00:10:06,390 --> 00:10:07,710 end application. 134 00:10:07,740 --> 00:10:15,810 The next point about JavaScript is that it is non blocking, which means that it is the code that runs 135 00:10:15,810 --> 00:10:21,390 concurrently in the background with the help of what is called event loop. 136 00:10:21,870 --> 00:10:26,370 Event loop is also a big topic on its own. 137 00:10:26,400 --> 00:10:30,930 As you move on, we will be more and explain what is event loop. 138 00:10:31,230 --> 00:10:40,380 The next point is that JavaScript is non blocking, which means that it is a code that runs concurrently 139 00:10:40,380 --> 00:10:44,940 in the background with the help of what is called event loop. 140 00:10:45,270 --> 00:10:49,030 Event loop is also a big topic on its own. 141 00:10:49,050 --> 00:10:53,300 As we move on, we will diving more and see what it means. 142 00:10:53,310 --> 00:10:59,490 Well, with this particular point being raised, I think you will still have some doubt in your mind 143 00:10:59,670 --> 00:11:00,210 that. 144 00:11:00,210 --> 00:11:06,930 Well, the first point is that JavaScript is a single threaded language, but one is that for here we 145 00:11:06,930 --> 00:11:09,460 can run more code concurrently. 146 00:11:09,480 --> 00:11:12,990 Why is because of what is called the event loop? 147 00:11:13,020 --> 00:11:17,940 For this one, if I try to explain to you where. 148 00:11:18,940 --> 00:11:21,340 You may not be able to understand Parliament. 149 00:11:21,370 --> 00:11:24,910 Try my best and see what you can do for the sick, for some people. 150 00:11:25,060 --> 00:11:26,380 So let's see that. 151 00:11:26,380 --> 00:11:33,160 Let's write a code that runs concurrently, meaning it doesn't wait for other code to finish running 152 00:11:33,310 --> 00:11:35,600 for the first implementation day. 153 00:11:35,640 --> 00:11:38,690 We see that it runs the code line by line. 154 00:11:38,710 --> 00:11:41,950 So let's have a look for this particular example. 155 00:11:41,950 --> 00:11:47,920 We are going to tweak, let's see Java a little bit to delay the execution of some code. 156 00:11:47,980 --> 00:11:48,910 So let's see. 157 00:11:48,940 --> 00:11:55,120 So let's comment here and say non blocking meaning it doesn't block other code from running. 158 00:11:55,150 --> 00:11:55,980 So let's see. 159 00:11:55,990 --> 00:12:03,100 So let's declare a variable, can't say hi, simple function error function as that. 160 00:12:03,100 --> 00:12:09,010 And now let's say just console log, say hi for this one. 161 00:12:09,010 --> 00:12:17,560 Now here comes the question how can we delay a certain function to be called at some point in time and 162 00:12:17,560 --> 00:12:23,260 you are going to use a built in function or API call set timeout. 163 00:12:23,500 --> 00:12:25,090 If we don't know it's a timeout. 164 00:12:25,090 --> 00:12:29,800 That timeout is a function that's going to be called at some point in time. 165 00:12:29,800 --> 00:12:31,240 So this is how we use it. 166 00:12:31,240 --> 00:12:32,560 Set timeout. 167 00:12:33,890 --> 00:12:38,920 And then as a function and this function takes in two arguments. 168 00:12:38,930 --> 00:12:41,120 One is a function. 169 00:12:43,490 --> 00:12:48,270 And next is the time you want this function to be called. 170 00:12:48,290 --> 00:12:53,840 Let's say I want to call my callback function after 2 seconds, meaning 2000 milliseconds. 171 00:12:54,050 --> 00:12:55,160 Is that so? 172 00:12:55,220 --> 00:12:59,330 Inside my callback function here, I can do whatever I want. 173 00:12:59,510 --> 00:13:01,730 I would say go to park. 174 00:13:03,700 --> 00:13:04,300 Great. 175 00:13:04,390 --> 00:13:07,390 So if I save this one, check the console. 176 00:13:07,420 --> 00:13:13,330 You can see that after 2 seconds, something is going to be rendered, as you see, go to park. 177 00:13:13,510 --> 00:13:17,740 So with this logic, we can delete this function call. 178 00:13:18,070 --> 00:13:18,460 All right. 179 00:13:18,460 --> 00:13:26,230 So we can call the function here inside this set timeout called say hello as a function as that. 180 00:13:26,560 --> 00:13:31,510 Now I'm delaying this function to be called after 2 seconds. 181 00:13:31,900 --> 00:13:37,870 Well, so down here or up here, let's console.log a function. 182 00:13:37,870 --> 00:13:39,880 Say, go to bank. 183 00:13:40,780 --> 00:13:43,360 Let's copy this function as my console. 184 00:13:43,360 --> 00:13:48,190 Log down here and say Go to park. 185 00:13:49,030 --> 00:13:53,500 If I save this file, what would be the order of execution? 186 00:13:54,250 --> 00:13:57,870 If we are sticking to JavaScript is a single threaded. 187 00:13:57,880 --> 00:14:05,920 It means that this function will call first immediately after I save the file and then after 2 seconds 188 00:14:05,920 --> 00:14:07,360 this function will be called. 189 00:14:07,390 --> 00:14:09,670 After that this will only be called. 190 00:14:09,670 --> 00:14:12,610 That's a normal flow of JavaScript. 191 00:14:12,610 --> 00:14:20,800 But with this using such timeout, the execution will be will be changed, meaning that let me increase 192 00:14:20,800 --> 00:14:23,440 this one a little bit, let's say after 5 seconds. 193 00:14:23,680 --> 00:14:29,380 So it means that this function down here will wait until this function calls. 194 00:14:29,380 --> 00:14:32,200 But let's see when I save this. 195 00:14:32,200 --> 00:14:33,100 Have a look. 196 00:14:33,130 --> 00:14:35,530 You see that other response I got? 197 00:14:35,530 --> 00:14:41,350 Go to bank and go to pot, and after 5 seconds I got high. 198 00:14:41,350 --> 00:14:44,560 Meaning this function has the code, which is this one. 199 00:14:45,130 --> 00:14:51,820 It means that this function did not block this particular function down here. 200 00:14:52,120 --> 00:14:58,780 That is why as soon as I see the file, this one get called, go to bank this one, and then it skipped 201 00:14:58,780 --> 00:15:03,850 this one and then got here and then display, I mean, go to park. 202 00:15:03,850 --> 00:15:08,470 And lastly, after 5 seconds, I got this one as we see here. 203 00:15:08,650 --> 00:15:13,360 And this is possible because of what is called the event loop. 204 00:15:13,750 --> 00:15:17,860 And I said it would be more about why this one happened. 205 00:15:18,010 --> 00:15:18,570 Great. 206 00:15:19,120 --> 00:15:26,590 The next point is that JavaScript is a high level programming language, which means that any programming 207 00:15:26,590 --> 00:15:34,660 language uses resources of a computer talking about computer memory CPU network before the application 208 00:15:34,660 --> 00:15:35,410 can run. 209 00:15:35,500 --> 00:15:44,110 But for low level programming languages like C and C++ and Java, developers need to manage these resources 210 00:15:44,110 --> 00:15:46,210 manually by themselves. 211 00:15:46,360 --> 00:15:54,250 But for high level programming languages like JavaScript, Python and Ruby programmers don't do this. 212 00:15:54,250 --> 00:15:56,590 It is done for us automatically. 213 00:15:57,040 --> 00:16:02,980 So that's why we say that JavaScript is what a high level programming language. 214 00:16:03,340 --> 00:16:09,820 And when it says that JavaScript is a multi paradigm language, it means that we have different style 215 00:16:09,820 --> 00:16:10,660 of approach. 216 00:16:10,660 --> 00:16:19,630 How we can structure our code, we can write a code style called functional programming or object programming 217 00:16:19,630 --> 00:16:21,730 or procedural programming. 218 00:16:21,730 --> 00:16:27,730 So with one language we can adopt any of this approach to write our code. 219 00:16:28,030 --> 00:16:30,310 That is what we call JavaScript. 220 00:16:30,310 --> 00:16:34,450 A is a multi paradigm language, so that is it. 221 00:16:34,450 --> 00:16:37,780 In this video we will talk about the V8 engine.