Counter (Closure - Day2) - Leetcode 2620 - JavaScript 30-Day Challenge

Key Takeaways

hey everyone welcome back and let's write some more neat code today so today let's solve leak code 2620 counter and by the way this is day two of leak cod's JavaScript challenge I think more and more companies are asking these types of questions especially to front-end devs so I highly recommend checking these out we are given an integer n and we want to return a counter function the counter function should initially return n and then returns one more every time it's called so on the first call it should return n next call it should return n plus1 etc etc well there's not much for us to visualize here so let's go ahead and actually jump into the code now okay so now let's get into the code we do have some boiler plate here but before we get into the code itself I want to show you how it's actually going to be used so down here we have a create counter that create counter is obviously defined up here it's a function as you can see but it actually returns another function and that's what we're going to be implementing once that counter is created remember it's a function not just a Val Val so we're actually going to call this counter even though it's a variable it's a function we can call it and it's going to return 10 because 10 was the value passed in we call it again it'll return 11 then 12 etc etc so this is pretty weird if you've never used JavaScript before because this sounds like object-oriented programming but JavaScript originally didn't support that so people used functions and closure to get around it what closure means is that this inner function has access to variables defined outside of it we don't have to declare like a count in here and set it to n or whatever the value was passed in we can just reuse the value defined outside here what that means is we can do basically just this return n ++ so what that's going to do is increment n but before it increments n it's actually going to return n so it's going to return 10 and then increment it so the value n will be set to 11 but the value that's returned is going to be 10 the next time we call it it's going to do the same thing the value is currently 11 and that's what's going to be returned and then the value is going to be incremented again basically n is sort of a hidden state right it was only passed in once right we only passed 10 in here but somehow that value still exists somewhere and we can't find it we can't access it it's there we just can't access it pretty much like objects with like private variables so now let me just run this to show you that it works and as you can see yes it does but I'm going to continue with this example cuz to make it even more obvious that we're doing objectoriented programming here and I'm surprised that it passed even though I had this uncommented so let me just comment that again but to make it look even more like object-oriented programming pretty much from our previous video for day one what we had was we declared a variable like the count and set it equal to n and then from here we can just go ahead and return the count but of course here we're missing the incremental so we should basically just do count Plus+ so this looks more like objectoriented programming from other languages and I'll run this as well and this also works and to go even further Beyond let's actually translate this code into a class because es6 JavaScript I think it came out in like 2015 did add support for classes so let's create a class calling it counter and so now more traditionally we can actually create a Constructor with the keyword Constructor let's say it takes in the same value n pretty much like the outer function did out here and just like above this variable of course will not go out of scope Well normally it actually will but we can make a member variable for it with the this keyword this n is going to be equal to n so now we pretty much have what we did up above here I guess I could name this count well I'll leave it as is nobody really cares now let's just Define an increment method which yeah you don't need the function keyword in a class to do that I know it's kind of weird but yeah when you're dealing with classes you actually don't need the function keyword so let's create that increment method what's it going to do probably just return uh this dotn we could do Plus+ but this way it will return the original value or we could add this Plus+ to the beginning to increment it before returning I'm going to leave it at the end though and now I'm going to create a counter with the counter Constructor that we have up above passing in let's say 10 again and then I'm just going to call counter. in increment and what this will do is it'll log 10 I believe the first time I guess it's not really incrementing the value so maybe we could have moved this to the beginning actually let's do that let's move that to the beginning just to illustrate it prefix incrementing will increment this before returning so if it was given a 10 we will increment it and then return an 11 and we can do this many more times just like down here I know we pretty much talked about this in day one's video I didn't realize that they were going to be doing this in day two I would have saved it for this video if I knew but if you found this helpful please like And subscribe if you're preparing for coding interviews check out n code. it has a ton of free resources to help you prepare thanks for watching and hopefully I'll see you pretty soon