#2 - Type, Type Inference, Type Annotations in TypeScript

hey guys this is Navia welcome back to navine automation labs and back to our typescript Series so in this video we are going to talk about that how can you prove the typescript is a statically type language we will see the concept of type inference also and the type annotations as well we know that okay JavaScript when we write the JavaScript code here and if I'm creating any a variable for example let's say I'm creating a variable let age and let's see I'm not giving any value to this particular age right so let's see if I'm writing H dot see I have no idea that what operations I can perform it here right same thing if I let's say I'm going to create one uh first name variable and in the first name I'm not giving any value right and then I'm writing that the first name dot see it's not giving me any Properties or any methods over here right so JavaScript is not a statically typed language here you don't need to give that what kind of data you want to hold in this are age so for example age is equal to 30 but in the next line I'm writing age is equal to naven also in that case so in that Casey it is allowing me to use it so AG could be numeric value also age could be a a string value also AG could be a a Boolean value also here in the JavaScript so this is not statically type language but when you talk about in the typescript so for example in the typescript if I'm writing that okay this let and then let's write the first name here and then here we are defining the first name should be the string type now in this particular F name I can hold only and only string type of data for example let's see I'm holding navine here but in the first name if I'm defining let's see 40 here it will give you the error at the compile time so this is the this is called the typescript is a statically typed language here you can give the data type right whatever the type of data you can Define it here so this feature is called type annotations in typescript right for example let's see now if I really want to Define any numeric type of data or any a number type of data let's take a numeric value here so let's see here I'm writing that number should be a number right so in that case in this particular number I can Define only and only number type of data so let's see if I'm writing number is equal to 90 but now I cannot store any other data here like true and false or string values I cannot Define it here it's giving me the error at the compile time right so this is called statically type language now what if I'm defining let's see a number here once again so let's see n I'm defining and N is a variable name and writing that number is equal to 50 so if you really want to assign in the same line that also you can do it here so here what is the difference here I'm not assigning anything then in the next line whenever I want to assign I can assign it but here in the same line you can just creating a variable and assigning the value also whatever the value that you want to assign you can assign it here if I really want to assign let's see some uh some name or anything so let's see I'm writing that okay what is the last name I say okay last name should be the string type and the last name let's see here I'm writing uh Peter here like that so here like this also you can Define it okay but let's see if if I'm creating a variable and then the variable name is let's see pop or uh let's see some any variable name let's see test variable that I'm going to create and then here I'm writing the test is equal to let's see I'm writing typescript whatever the double code value that I have given means the string value I have given here but see this here I have not given any type of test so this is a property of the typescript that at the compile time itself it will decide that what kind of on the basis of the data that you have assigned it means what is the type of test so in this case the type of test is what the type of test is actually a string type of data that will be decided at the CT CT means at the compile time it will not be decided at the run time so you have two choices you can assign the specific data type also you can write it or without data type also on the basis of the value it will be decided so this feature is called type inference okay so at the compile time the type inference will be applied and this feature when you write colon data type see colon number colon string something like this this feature is called type annotations okay if someone is asking you about what do you mean by type annotations it means we are explicitly defining the type of the variable here if you don't give the type of the variable then at the compile time on the basis of the given value it will be decided that what will be the type of the respective variable so this feature is called type inference for example let's see if I'm creating another variable let's see here I'm writing that your bill amount and then I'm not giving any data type like colon number or something and bill amount is let's say 6,000 so what is the type of this the type of this will be a number will be decided at the compile time and that's why this feature is also called the type in refence here right okay now so just like that we have string number so can we have other data types also of course we can have different various data type Boolean null undefined void any any type of data type we can decide it over here for example let's see if I really want to declare a Boolean let's see a user is active or not something like this let's see I'm creating a variable here I'm defining that okay no it should be Boolean and and the current value of this is true here like that so this is active is behave like a Boolean data type other than Boolean true or false I cannot assign any value here perfect so that also we can do it and remember in the number whenever we declared a specific number number can hold any integer value any numeric value or any floating value in the string we can Define any character or any string value we can Define it there in the Boolean we can Define any Boolean type of data we can Define it here perfect now if I want to declare for example let's see null type or undefined type so let's say I really want to Define some null and undefined can we Define that do we have any type something like this yes in typescript that is also supported so for example let's see if I'm creating a variable let variable and the variable name is here I'm writing let's see City and then I'm writing city is right now null type of data and then I'm assigning the null over here so what is the type of City the type of city is actually null here so you can Define like this also then let's see again I'm writing let's see country variable and then country is not defined so here I can write undefined is the type of country and what is the value of undefined the value of value of undefined is undefined so how exactly it will be treated city is equal to null and country is equal to undefined and the type of city and Country will be null and undefined respectively here so you can Define like this also okay then we have another type that is called any type any is means any type of data I can hold in this particular variable for example let's say I'm declaring a variable and the variable is let's see value variable and the value I'm defining that with the data type any see any is a keyword that you can write it here and initially let's see I'm declaring with 80 here so initially I have given that any is sorry value is equal to 80 which is any type of data I can hold it in this value so now in the value let's see I'm assigning some other value some a string value for example let's see if I'm writing it so here I'm writing let's see uh Dev here that also I can assign it can I write value is equal to true or false that's yes that also we can assign it here so any means any type of data we can store it here so if you are not sure about that what is the type of that variable you can write any generally used for the dynamic data whenever we have to use a dynamic data data could be coming in the form of numeric or a string or anything then we can Define this type of data then let's talk about the void data type void type generally we used it for the function right a function vo means function generally we use it with the function does not return any value so it means if a function is declared with the void data type or void type annotation it cannot return any value so for example let's see if I'm writing a function here that function let's see the function name is just I'm writing print hello this function job is just to printing the hello so here I'm writing that okay fine that let's print hello here and this does not return anything so although if you don't want to write that is also fine so what will happen the return type of this function is is a void by default at the compile time itself it will be added but if you really explicitly if you want to tell that okay no this function is a void type so in other programming languages what you used to have let's see for example in the Java or in CA we used to write void here but here you don't need to write void here like this after the method name after these two parenthesis put a colon and then you write void so don't get confused with the syntax that what is void here void is a return type can we have another data type also or sorry another return return type integer or or number or a string or anything yes of course we can have it so for example let's see if I'm creating a function and the function name is let's see some get a number put it like this and then colon and I know that okay this will give me some number here okay like this and then get number I have created it means now the return type what is the return type of uh the this function the return type of this function is number here which will be decided at the compile time because we have given it here so now if I'm creating let's see return some number here 1 2 3 now the error is gone so remember one thing if you have return number here now it is mandatory for this function to return a number but let's see I'm writing instead of one 123 here I'm writing that a test here I'm returning a string this is giving you error that that how can you return a string because your return type is number so that's why it says the type string is not assignable to type number right so that's what if you have given number you have to return a number only like 1 2 3 only same thing if a particular function is declared with void in nature it cannot return anything it means if I'm writing a return let's see 1 2 3 here void and return cannot be together remember because here both are contrary right because here you are saying that void is not returning anything but here you are returning it so this is not allowed here like this but if you have return like this this is allowed it means void and return generally cannot be together but here I'm not returning anything I'm returning a blank value I'm not returning anything from here so like this also you can write it okay so to avoid the confusion generally we don't write any return keyword with the void function so return type could be anything it could be a number also it could be void also it could be string Boolean whatever you want to return you can return here you can write any also you can write it so for example let's see here I'm writing function and then let's see I'm writing get any value here like this and then here I'm defining that okay yeah the return return type should be any now it's up to you whatever you want to return so now I'm writing fine that let's return uh something let's see uh testing here you can return testing also right so it's not giving me any error so what is the return type RT means the return type is equal to any in that case it will be decided at the compile time once again on the basis of the value that you are returning so right now the return type is testing with double code so that's why the return type actual return type will be decided at the compile time okay finally we are returning a string from this function okay so this is called whenever you write colon and the data type this concept is called the type annotation so for your reference I'm writing it here let's see whatever the variable name that you are writing for example number and I'm defining the data type here number like this right like this also you can do it for example let's say if I'm defining name what is a data type I'm writing a string here so this is called type annotation if you don't write anything for example this is called type in this is also type inference here because here I'm not writing any colon or something if you don't write it that is also fine it will be added at the compile time it will be checked that what type of data that you are defining typescript in double code okay fine that the return type or the data type of this variable will be the string type or for this guy will be the number type okay so if you write it or don't write it J typescript is always a statically typed language the typee of data will be decided it at the compile time not at the run time so I hope this is clear right and the rest of the things will remain same if you really want to call any function and everything you can just simple call it and then again you have to compile it it will convert to ajs file and then you can use it anytime whenever you want to use it let's take one more example that what if in a particular function I really want to Define some parameters so can we pass the function parameters with the type of parameters yes that also we can do it here so let's see how to do this so let's take a simple example first let's see I'm creating one function and this function name is let's see one addition function here like this it mean this function will add two numbers so here I'm writing let's see I'm not defining uh any data type here no type annotations here I'm simply writing a comma B that's it and then I'm writing that okay return a + b from this function so see I'm not writing any a colon number or a plus b colon number or something like that so again what will happen at the compile time the type inference concept will be applied as what as number right how exactly it will decided because when I call this particular function addition let's see I'm passing 10 comma 20 so what will happen in that case 10 will be given to this guy 20 will be given to B so 10 + a plus b is equal to what a plus b in this case 30 and 30 is what at the compile time it will be decided that the 30 is the resultant of a plus b is a number so 30 is a number so this function is actually giving me a number here perfect so that will be decided at the runtime here but if you really want to say that okay no I explicitly want to define the type annotation means I really want to give the type of A and B also so in that case what will you do so let let's create this particular another function let's see one add function that I'm creating it so here I'm writing a that give me what type of a give me number comma B this is also you have to give me the number here like that and then I'm writing that return something from this function something means return a plus b so obviously at the compile time what is the return the return also will be a number will be decided here if you explicitly want to Define you can Define once again the return type of this function is what I explicitly say that okay return return type of this function is a number so this is the perfect example you can check in the function also that the data type or sorry the parameter type of data the parameter type is what both are numbers and return is also num so how will you read this particular function this function name is add this function is having two parameters a which is what a number type and another parameter this is also B this is also a number type and what is the return type of this function the return type of this function is a number here like that so this is more flexible more readable the type annotation and the type inference concept it looks like we are writing the code in Java or other uh statically type languages like C or Java but same thing is not possible in JavaScript in JavaScript you don't need to Define any number everything will be I mean you don't need to Define any data type everything will be decided at the run time okay so that's why the developer First Choice is always typescript as compared to Java script in most of the Frameworks like react or view or in test automation Frameworks also because it's giving me more flexibility and more easy to uh easy way to write the code better readability plus you can find the errors and the catch the errors while writing the code instead of after running the code you are getting the error so I hope this feature is uh clear what do you bean by statically type language that's why the name itself is type because type of data is very important that's why they have given the name as type script here that's all for this video thank you so much I'll see you in the next video guys

Channel: Naveen AutomationLabs

Views: 3,453

Keywords: TypeScript, TypeScript tutorial, Learn TypeScript, TypeScript for beginners, TypeScript fundamentals, TypeScript basics, TypeScript programming, TypeScript crash course, TypeScript for web development, TypeScript course, Advanced TypeScript, TypeScript for JavaScript developers, TypeScript type annotations, TypeScript classes, TypeScript interfaces, TypeScript functions, TypeScript best practices, TypeScript tips and tricks, TypeScript debugging, TypeScript vs JavaScript

Id: -7NeC2CuuT8

Length: 18min 20sec (1100 seconds)

Published: Fri Oct 13 2023