Class, Constructor & Method - TypeScript [Protractor Tutorial] | LetCode

Louis my name is bachi can we'll come back and let code in previous couple of videos we have learned dopes concept in JavaScript like classes methods in it is concept and constructed static and everything in detailed right so we are going to learn the same thing same example same code same everything but instead of JavaScript we are going to do that same things in the dead skipped so we already know right types key pieces of superset of JavaScript so whatever the code we have in your JavaScript that is going to be exactly same in typescript as well but there are few differences and few benefits comparing to JavaScript so let's see how to write a class in typescript so this is actually typescript compiler online compiler so this is known as Ted playground so you can head over to this particular URL and you can use this compiler so this is very handy for the learning purposes right so in the left hand side I am going to write the type skip syntax where in the right hand side we can see the JavaScript syntax is so first we are going to write this class and then followed by the same example so mobile and curly brace aside so this is how we have to write a class in typescript that is going to be exactly same in JavaScript as well but let us see what are other differences so let us think that we want two variables here so here I am going to save modern name equal to one plus and we connect to the value here itself or else maybe you can take that from our constructor so I am just going to remove this and here I can just leave this as it is or else we know that this is all types cube where we can denote that type explicitly right so here I am going to say this model number I mean the model name it's going to be of type string and then for bye we are also going to give a model number and that is going to be of type number right so here I can say number that's it pretty much fine right now we are going to write a constructor so of course the struktur keyword and within this we are going to I mean we are going to get two values here so here I can say model name and here I'm going to get this as a string and then followed by comma and then we are going to get that model number right and of course that's going to be of type number so that's pretty much enough now here what are the value we are going to get from our constructor we can assign that to our class variables right so for that we have to use this this keyword then followed by the same syntax here so here I have to say model name this would be model number and that's it and here we are going to say this dot model name equal to so this model name so that's it pretty much fine now here we can see so see this should be of models named numbers so here we can see we are able to declare two class variables but in terms of JavaScript that will be declared within the constructor itself so this and then front by the variable actually refers that this variable are present within the class itself but internship we can declare this outside of the class directly right so that's fine let's try to create a object first so here I am going to say Const and then followed by my mobile equal to new keyboard to make an object to create an object and then followed by the constructor now we know that in the constructor we have to pass two values right now here if I mouse over here you can see that it says that expected two arguments but zero passed so that is the advantage of using types get here in the compile time itself it will show you like what are the errors now doesn't matter that I'm using this compiler or even if you use your PS code that's going to be absolutely fine in typescript as soon as you going to write some code it is going to give you this error exception like this right combating exception but whereas in terms of JavaScript here you can see this of course it's also asking for the variables but it doesn't gives any exception here so that is the major differences in terms of JavaScript and typescript of course there are other benefits as well now here I am going to pass the name so that is going to be one plus and here when he says fast in number so maybe six so that's pretty much fine and then let us try to call this model name here right so here we are going to log that so console dot log and here I can say object him that is my mobile dot here I can say model name right so if I do like this of course I can access this value now to see the result we have to open our inspect mode so here if I right click and do inspect I have told you can use and then go to your console and just clear this and here you have to click on this Run button now here you can see we are getting this as six why we are getting six because we are printing this model number so I want the model name so let me change that and if I click on the center I'm in turn here you can see we are getting this as on plus right so that's pretty much cold right that's fine now let us also understand that we can declare a play public and private variable in type scheme of course we can do that in the JavaScript as well so we have to use the hash symbol in JavaScript right but here it is going to be very simple so here I can say like private so that's it and if you want to make something public by default each and every variable or the methods within the class are public if you want to say explicitly you can make this as public or based on your economy yet you can make that private or even we can use this as a protected that is not available in the Java step but it is available in text if we'll talk about that maybe in our inheritance video so that's fine right here as soon as we compile I mean as soon as we make some changes it's of course doing the compilation and here we can see that here it says that here you are trying to access it private value variable but that is accessible within the class only you cannot call that outside of the class right so typescript is saying is that hey this is not possible but in terms of JavaScript you can see here we are not getting any exception like that so that is the difference as I can say of course we will talk about this more until like why we are using that if not as you asked so that's fine let's mean come on this and let us write another function so here I am going to say I want a public function so here I am going to say public method I can say not function so what the same but in terms of transmissibility for this has methods not functions so here we are going to say maybe same example so make call and here let us just log this so console dot log and here I'm going to say he calling something like that in your message so that's fine and that's it now I can call this outside I mean using the object so here I am going to say my mobile dot make that's finite so of course we can run this and go to our console so here's right-click inspect and go to your console and here we can see all the output side so let me just me myself it so here you can see it says that he calling that so we are able to get the output now in case just in case if I change this to private variables so that's not going to work for sure we know that that so private means of course we can do anything with that variable of the method within the class not outside of the class so I'm just going to make this as default not if also default in the sense it's going to be public for sure so nothing like default here and this method we know that this is not very written as anything so if something is not returning us anything then we can use the keyword called Boyett right so here I can say void so that means it is not going to return us anything now just in case let us assume that it is going to return a string right so here if I say in string and then now this is going to throw me error says that he Koscheck you're trying to return this as boy but I mean you are trying to return this as a valley of string but here it says that here it says like nothing so that means of course it is going to give us some exception so here I can use this written keyboard and here I can make this a string so that your method can understand okay we are returning this value as string so of course this method return type should be off string but in terms of JavaScript if you see here we do not have any such concept like what is that type it is going to return or something so basically JavaScript is dynamic in nature so whatever the value you are going to pass to it in the runtime it is going to decide and based on that it is going to give us the functions based on that particular value right for example here if I say that moving mobile make call dot and here if I give dot and here you can see we are getting all the functions related to our string class right so we have already discussed about string in detail in our video so when we go and check that so here we can see we are getting this all the stinging related methods so like splice or split or inside start so it so we are getting all the methods right so test if knows that this method is going to return the type of string so based on that to be a thing to use those functions from the from those string classes like I'm just in case if I return make this as void so of course I want to get anything here and here also it's going to give us error so let me come and this and here I can go and check so here if I give dot an through space of course I'm not going to get anything related through the string class so that is how it works or any props I can say ok so I think this is very pretty much cool on this very simple video so this is how we have to create a class and then we have to use this private variable or the public variable and the followed by the constructor right and this is how we have to create the method so we make you use public or the private so apart from this public and private we also have two other access modified like read-only and protected you will see that in our next video obsessive now this is pretty much defined I believe so if you know JavaScript then I can say you know if skip already just you have to understand the syntactic sugar that means the syntax how this is going to work right so that's it for my sexy in the next one place [Music]

Channel: LetCode with Koushik

Views: 4,445

Keywords: typescript tutorial, typescript vs javascript, typescript crash course, typescript tutorial for beginners, typescript classes, typescript class constructor, ts classes, ts oops, typescript, automation testing, angular js testing, protractor tutorial, protractor with typescript tutorial, protractor testing tutorial, protractor tutorial in tamil, protractor automation testing tutorial, protractor jasmine typescript tutorial, leetcode koushik, typescript tutorial 2020

Id: ie-_GoRll2k

Length: 11min 34sec (694 seconds)

Published: Fri Jun 12 2020