0:03 hello and welcome to another complete
0:06 course by proad me this course is about
0:09 typescript a super set of JavaScript
0:11 that means typescript is a programming
0:14 language which is built up on JavaScript
0:16 unlike JavaScript typescript has many
0:18 features which allow us to write less
0:20 error prone and cleaner code with some
0:22 exciting new features which is not
0:25 available in JavaScript yet so in this
0:26 course you will learn all about
0:28 typescript from scratch you don't need
0:30 to know anything about typescript to get
0:32 started but if you have a basic
0:34 JavaScript knowledge that is more than
0:37 enough to get started with this course
0:38 in this course you will learn all the
0:41 basics of typescript how it works why we
0:43 use it and the different advantages it
0:45 provides over using
0:47 JavaScript and slowly we will dive into
0:50 more and more advanced concepts of
0:53 typescript with this in this lecture
0:55 let's have a brief introduction of what
0:57 is typescript and what advantages does
1:00 it provides over JavaScript
1:02 in simple terms we can say that
1:05 typescript is a super set of JavaScript
1:07 typescript has all the features which
1:09 JavaScript provides plus it has some
1:12 extra features like interface access
1:14 modifiers Etc which is currently not
1:16 available in the latest version of
1:19 JavaScript and typescript makes writing
1:22 JavaScript easier and more powerful with
1:24 additional features which it
1:26 provides however we have one huge
1:28 disadvantage with
1:30 typescript typescript code cannot be
1:32 executed directly by the JavaScript
1:34 runtime like the browser or the nodejs
1:38 environment browsers or nodejs cannot
1:41 execute typescript code then why should
1:44 we use typescript and more importantly
1:45 how do we execute
1:48 it we have already answered the first
1:50 question before why should we use
1:53 typescript typescript has additional
1:55 features which does not exist in
1:57 JavaScript and hence it makes writing
2:00 JavaScript code much easier and faster
2:03 and also less error prone with
2:06 typescript now to answer how can we
2:09 execute typescript code typescript is
2:11 not just a programming language it is
2:13 also a tool it is a very powerful
2:16 compiler which can run and compile
2:19 typescript code into JavaScript so when
2:21 you run typescript code it gives you
2:23 JavaScript code in return and JavaScript
2:25 code can be executed by JavaScript
2:28 runtime like browser and nodejs so using
2:31 typescript we write typescript code
2:33 where we can utilize all the new
2:36 features of typescript and at the end we
2:38 get JavaScript code from that typescript
2:40 code which can be executed by the
2:42 browser or other JavaScript runtime we
2:44 do not write JavaScript code directly
2:46 when working with typescript instead we
2:49 write our code in typescript and when we
2:50 compile that typescript code it gets
2:52 converted into
2:54 JavaScript now that brings up one
2:58 another very important question how can
3:00 typescript use new features which is not
3:02 available in JavaScript and at the end
3:05 it gives us regular JavaScript code the
3:07 answer is the typescript compiler
3:09 compiles the new features of typescript
3:12 to JavaScript using some workarounds in
3:14 JavaScript for example we can write some
3:16 code in typescript using its new
3:19 features in a nice and simple way but
3:21 when it gets compiled to JavaScript
3:23 there that same nice and simple code
3:26 will have complex JavaScript logic and
3:28 syntax to achieve the same thing so
3:30 there is no magic here of course
3:32 typescript cannot output some JavaScript
3:34 code with features which JavaScript does
3:37 not support while converting typescript
3:39 code to JavaScript the new features will
3:41 be converted to JavaScript code using
3:44 existing features of JavaScript but in
3:46 typescript that code will be easy to
3:49 write with new features but same code in
3:51 JavaScript will be a little bit complex
3:53 and will use existing features of
3:55 JavaScript another very important
3:57 feature of typescript which does not
4:00 exist in JavaScript is typescript is
4:03 strongly typed it allows you to specify
4:06 a type for a variable explicitly on the
4:09 other hand JavaScript is dynamically
4:11 typed so here in the left hand side we
4:13 have JavaScript code and in the right
4:16 hand side we have typescript code so
4:18 when we create a variable in JavaScript
4:21 using let or const keyword there we
4:23 simply specify the variable name we
4:25 don't specify the type of data which
4:27 that variable is going to store for
4:29 example here I'm creating a variable num
4:33 to that we assigning this value 10 so
4:35 since JavaScript is dynamically typed
4:38 the data type of this num will be
4:39 calculated based on the value which we
4:41 are storing in it in this case the data
4:44 type of this num variable will be number
4:46 in the same way in this esta variable we
4:49 are storing a string value so its data
4:52 type will be dynamically calculated and
4:54 since we are storing a string value to
4:57 it its data type will be set to string
5:00 now the problem here is that
5:02 let's say I'm creating a variable using
5:04 let keyword and initially I'm assigning
5:07 100 to it so here the data type of this
5:10 Val variable will be number and in the
5:13 letter point of time to that same Val
5:15 variable now I'm assigning a string
5:19 value so here the data type of this Val
5:21 variable will change to string earlier
5:23 it was number now since we are storing a
5:25 string value in it its data type has
5:27 changed to string and that's why we say
5:30 that JavaScript is dynamic Ally typed
5:32 the data type of a variable in
5:34 JavaScript is determined by the value
5:37 which we are storing in it and the
5:39 variables data type can change based on
5:42 what type of value we are storing in it
5:44 but that is not the case in typescript
5:47 typescript is strongly typed that means
5:49 here when we are creating this num
5:52 variable and we assigning 10 to it the
5:54 data type of this num variable will be
5:57 set to number in the same way when we
5:59 are creating this SDR variable and when
6:01 we we assigning a string value to it its
6:04 data type will be set to string so
6:06 letter we cannot go ahead and assign a
6:09 number to it for example here we are
6:12 creating this Val variable again in
6:14 typescript and to this I'm assigning a
6:17 numeric value so the data type of this
6:19 well variable will be set to number now
6:21 in the letter point of time in the same
6:23 well variable if I try to assign a
6:26 string value we will get an error
6:28 because its data type has already been
6:30 set to number so we cannot assign a
6:33 string value to it also if we want in
6:37 typescript we can explicitly specify the
6:39 data type of a variable for example here
6:41 as you can see for this num I'm
6:43 explicitly specifying that this num
6:45 variable is only going to store a
6:48 numeric value this SDR variable it is
6:50 only going to store a string value if we
6:52 try to assign any other type of value to
6:55 this variable it is going to throw us an
6:57 error now what is the advantage of
7:01 typescript being strongly typed Ty well
7:03 it gives us an opportunity of
7:05 identifying any errors in our code
7:08 earlier before we run and compile the
7:11 code and it also allows us to identify
7:13 and fix any bugs at the earlier stage of
7:16 our development let's understand this
7:17 with an
7:20 example so again in the left hand side I
7:22 have JavaScript code and in the right
7:24 hand side I have typescript code and
7:25 here what we are doing is we are
7:27 creating a function called add which
7:29 should add two numbers and return return
7:32 us the result now here when we are
7:34 specifying this parameter num one and
7:36 num two we are not specifying that this
7:38 num one and num two should only receive
7:40 a numeric value right because that is
7:42 not possible in JavaScript you cannot
7:44 specify a data type for a variable or a
7:47 parameter so when we are going to call
7:49 this add function like we are doing here
7:51 at that time for this num one and num
7:53 two we can pass any type of value we can
7:56 pass a string value we can pass a
7:58 numeric value we can pass a Boolean
8:01 value we can pass n undefined anything
8:02 and that will be assigned to this num
8:03 one and num two
8:06 parameter so in this case if a user
8:08 tries to add two numbers three and five
8:10 but he has passed that number as a
8:13 string value like we are doing here in
8:16 that case the expected output will be 8
8:20 but here the result will be 35 why
8:22 because since we are trying to use this
8:25 plus operator on two string values those
8:27 two strings will get
8:29 concatenated it will not add the them it
8:31 will concatenate them because they are
8:34 string values so in that case we are
8:37 going to get an unexpected result but if
8:39 the same thing we try to do in
8:41 typescript there we can explicitly
8:44 specify what type of data we are
8:46 expecting for this num one and num two
8:49 parameter in this case we explicitly
8:51 specifying that for Num one and num two
8:54 we only want to get the numeric value so
8:57 while calling this add function if we
8:59 try to pass a string value or a Boolean
9:01 value for this num one and num two we
9:03 will immediately get an error and we can
9:07 Rectify it so here the typescript will
9:10 only allow us to pass a numeric value
9:12 for this num one and num two and in this
9:14 way we can avoid that bug we can avoid
9:17 that unexpected result so this is the
9:19 advantage of typescript being strongly
9:22 typed and we are going to talk about
9:23 this feature in great detail in our
9:26 coming lectures in this course so let's
9:29 quickly recap the advantages of using
9:31 typescript which we have talked about so
9:34 far first of all we can explicitly
9:36 specify the data type of a variable
9:39 which allows us to catch any error and
9:41 avoid bugs while writing the code
9:43 another Advantage which we talked about
9:46 is typescript also provides extra
9:48 features which is not available in the
9:51 current version of JavaScript and this
9:53 makes writing certain Logics in
9:56 typescript easy and simple without these
9:58 features writing the same code writing
10:00 the same logic logic might be a little
10:03 bit complex but using the new features
10:05 it makes writing the complex code easier
10:08 and simple and also less error
10:11 prone apart from new features typescript
10:14 also has meta features like decorators
10:17 which we will talk about in great detail
10:17 in this
10:21 course and typescript is also highly
10:23 configurable in this course you will
10:25 also learn in detail about typescript
10:28 compiler and how to configure it so you
10:30 can fine-tune the typescript compiler to
10:32 your requirement to make sure that it
10:35 behaves in the way you want it to behave
10:37 the only disadvantage with typescript is
10:41 that it has one extra step of compiling
10:43 the typescript code to JavaScript before
10:45 it gets executed by the JavaScript
10:48 runtime so this is the only disadvantage
10:49 of using
10:52 typescript all right so this was a very
10:53 high level overview of what is
10:56 typescript and why you might want to
10:59 learn and use it in your project in the
11:02 next lecture let's install and let's
11:04 start using typescript this is all from
11:06 this lecture thank you for listening and