Methods and objects in javascript

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
hey there how's it going on I hope you're doing good and let's move forward in our series of JavaScript I hope you're enjoying it because I'm enjoying it so much recreating the cities again with much more in depth and by the way just would I would like to keep bring this to your notice that I do have a website learn code online dot in its dot in so just go ahead and try to take a look we have a whole lot of courses and again it's not really a market place all of these courses are personally designed by me so quality is 100 percent there and the prices are like unexpected you're gonna love the content and everything again I'll just take a look in case you want to have a look otherwise it's okay we can still be friends okay enough of that now let's go back up here and here we are gonna take a look on how things are gonna be there so previously we were working on this ten objects now we will be working on this objects part two now this is one of the most important part of the object that we are gonna discuss in this one so we're gonna borrow some code from the previous code file we're gonna copy this user object again just to give you a brief memory we define a user with the equal sign and then use curly braces and everything inside the object is a key value pair we got first name is key again there is no double quotes wrapping this first name but value if it is being wrapped it can be a string but it can also be a number or a boolean value so no problem till now we have got everything covered and this is all okay we have been actually we were able to use any of that by saying user and then putting it dot notation I told you a couple of ways of having that but right now let's just go for the basic one and we're gonna just run this one it gives me the name okay no problem so far it's not really a big deal now let's go ahead and add a few more properties and try to understand how the object method actually works or also known as a function so first and foremost let's just say I do have a course list or key which is an empty array by default so let's just say a user logs in into the website again my website learn code online so as a default he gets course list as empty that means he is having no course access as of now but later on we're gonna define some methods through which he can buy some courses so let's just say we cannot call this one as by course but this is not going to be just any number or available it's gonna be a method so how we define the method inside the object is little tricky just in the syntax wise rest of them is pretty simple so we regularly put a colon there and if you want to have a method then you simply first and formost call it a simple function then pair of parentheses and then curly braces yes it's different again one more type of how we define function in the previous one we were saying function then ABC colon and let's just like that but since this ABC or whatever the name is is actually shifted up here that's why we don't write it again here and this is the perfect valid syntax so we're gonna hit enter and we're gonna see that how we can have a function which can give you the course access so let's just say whenever this function is going to be coming up it's gonna simply have a course name and we are gonna just insert this whatever the course name it is we're gonna insert that inside this array since we have studied a whole lot about DS array it should be really really simple but the only tricky thing how am I gonna access this course list because there might be some other variable here which is going to be course list or something like for course list and that is actually a true so it's not possible to insert into this one so there can be confusion because there might be couple of variables with this so if you want to refer to a variable which is inside the same object that you want to refer then we use the keyword this at that point of time when we were studying it this simply means the current context or the current reference of the global object but that was for the windows or in the case of node it was empty but in the case right now inside this Worr user object this simply refers to this user so whenever you say this dot it simply means user dot just like we are using it here user dot so since inside we cannot actually refer and say a user dot because we are already inside the user that's why we came up with the keyword this and now you can access this course list this course lists at line number seven has nothing to do with the 12 because this is making it a 100% sure that your talking about this one here okay so how do we add the values we can simply go ahead and say push and we're gonna directly push this course list not list we are gonna directly push this course name here there you go you got a simple method which gives you a course access and somehow whenever we are giving access to the user login we are checking how many course lists he is there in his account pretty simple assumption okay but there is one more thing let's just say we're gonna create another method which is gonna be saying get course count we can actually dump down the entire list of the courses individually but we haven't actually studied that much we haven't studied about the map much we haven't studied about looping through the arrays that's gonna come up later on so that's why we are having a method which is get course count we're gonna only get the count of course again how do we do it simply define a function yes there are other advanced way as well but let's go with the basic one this method it doesn't really need to access or pass on any parameters so we can just go for that but we're gonna access a few things so we're gonna have a returned key string we're gonna put these back takes and then I'm gonna use these dollar sign and I'm gonna refer to my first name so this dot first name is n rolled in and then I'm gonna write total number of courses in that and rolled in total come on total off and I'm gonna say five courses but this should not be hard-coded so we're going to replace five with a dollar sign and curly braces and we're gonna simply say this dot course list and make sure you put a dot and then we access the property length which we studied and that is the reason why I showed you that understanding the arrays so much in depth is very crucial you're going to be using this almost all the time I'm gonna save this and again this is a very simple line of code I can actually hide this so that we can see all of it at one time there we go so nice and easy we got an axis now let's go ahead and play with it a little bit I'm going to still keep the course list because if we have any issues it will be shown them directly here let's access a few methods so I'm gonna simply log the values again it's important that I log the value because this get course count actually just returns the string it doesn't really print it out so when I say user dot get course count and again since this is a method it needs to be run here if you just want to pass on a reference that's a different thing but here we want to run this one so I'm gonna save this one and try to run this and it says that hatay is enrolled in total of zero courses make sense because right now the user is logged in this by course method never actually was running there let's go ahead and run this so we're gonna say user and user is gonna buy courses so what should we buy first let's just say react.js course and we're gonna get a duplicate of this we'll move it at the bottom again I use keyboard shortcuts a lot I'm habitual of that so get course is it running first then we are allowing the user to buy a course and then again we are running this get users here get course list run that and there we go I forgot to save it my bad I'm gonna clean this up and run that again and there we go first I was enrolled in zero courses then I'm enrolled in one courses now although we are not making any check that the user should not be allowed to purchase the same course again again but right now this is also gonna work but I'm gonna simply say that angular not jeaious angular course there's a difference between angularjs and angular so we're gonna run that and there we go now I am enrolled in total two courses now surely we are not getting too much of in depth that we are checking for uniqueness here or referring that somebody is not passing on empty string but again that's not the point the point is how we grab these methods or how we insert these method inside the object this is gonna be very crucial and as I told you as we move forward in the series this will get much much clearer automatically as we write more lines of code so there we go nice and easy okay now it's time that you define one more method as well so what I want you to say is I want you to create a method which is info what info is gonna do info is gonna dumb down all of the information from here to here it's gonna tell me how much of the course list so it's gonna kind of produce a table for me so course list or course number rather how many course numbers are there is he logged in from Facebook is he logged in from login count roll last name first name info gives me all the information that is available right now so go ahead and design that method I think it's gonna be very very simple and gonna be fun as well go ahead click a photo tag me up on Instagram a video assignment and I would be super happy to see that let's go ahead and catch up in next one [Music]
Info
Channel: Hitesh Choudhary
Views: 26,552
Rating: undefined out of 5
Keywords: Programming, LearnCodeOnline, javascript, javascript for beginners, javascript course, javascript tutorials, learn javascript, udemy, coursera, udacity, learn js online, javascript projects, js tutorials
Id: gqBaQHXHwm0
Channel Id: undefined
Length: 9min 27sec (567 seconds)
Published: Sun Aug 02 2020
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.