Welcome back, my friend.
Welcome to our walkthrough.
I'm going to walk through the final version of this project so you don't have to do this.
You don't have to listen to this lecture if you're planning to work with me.
And that will start from the next lecture.
So if you don't plan to do to work with me, if you just want to know what the discourse I mean, what
this section is about, what we're going to do about this challenge, then I'm going to show you and
I'm going to explain you the final version of these six challenge.
So here I do have this clinic working.
You do have this report that I've shown you last night.
So you have the final and you have the story.
So I'm just going to open the Vasco here.
I'm going to navigate.
Just going to open the folder and I'm going to go to the final one, right, and in the final, you're
going to have index, you're going to have this image here, this image, I just grab it from Splash.
And that's why I'm saying thank you here.
And this is the finished version of our product of our application, and that is for this application
will be actually for practicing six skills.
Right.
OK, so let's start from DOT and I'm going to open.
I'm going to open this index open with the server and it's going to open up here, but I don't want
to use this Firefox.
I'm just going to close this.
I'm going to go to Google Google Chrome, open this bastard down here, and that's pretty much it.
Now, one thing here, my entire styling is this.
So I didn't worry too much because this is just for practicing this challenge, you see to get you better.
Right.
OK, I'm done with this.
So the first thing's first in our report, seeing that all of our clinics are parking, have a building
address in your built in, that is a perfect, perfect scenario for creating our corporate parent or
superclass.
So I'm going to name the superclass building it.
After that, I'm going to extend it to the parking into the clinic class that I have.
So this every class, every class needs to have a constructor in the address and your building goes
here.
Now we initialize them through the parameters we're passing here.
Now, this is our parent or super class.
Now let's create a parking class, know let's create a completely class, because that is pretty much
we are talking about clinic report in parking report.
Maybe you were thinking how many classes I need.
Wow.
It's simple.
You need to do some classes in one super class.
OK, now the solution is not a final solution.
You can create a better solution if you spend more time if you think more.
Right.
OK, this is just for practicing.
Debarking will have its constructor its own variables, except these two with its own parameters so
we can tackle the superclass in order to create that inheritance with this building.
Right.
So here you say this, that size.
Now, this is the size of a parking, including this is the size of the parking, including hourly in
all the parking.
Right.
That including should be.
Right.
So now, if the size I'm not going to use it in this project, but I put it there and I'm going to tell
you why.
So I have four spot spots, hourly spots, prize hourly in full day price.
Right.
We do have two spots we don't want mention there here.
But I just see average number of patients, every average number of all day parking that is full for
spots or all spots you can put in hourly spot spots.
And also they do have a separate pricing here, three dollars per hour and nine dollars for all day
parking, cuz that's why I do have this.
That's why I had it in the constructor.
Nice.
So the clinic, the clinic will have daily patient in this size, which I put it is the fault here.
This default will be used later in this method here.
But don't worry, at the beginning when you called it, if you got it together with me, we will leave
this size without the full value, some extending to the super class of the parent.
Right in initializing these two here.
OK, now don't worry about the methods.
Now inside, I'm going to create now the data.
This will be the data for clinics.
This will be the data for the parking's right.
So the data for the clinics, I will create a nursery full of new clinics so this scene can be achieved
if we create like this concept first clinic
equal to new.
And I can copy the rest of it.
Now, this is still OK.
So I'm creating a nuisance of a clinic class.
But for the second I will need to put second here.
Right.
And that's not obviously my solution.
It's not looking good.
So that's why I put it inside of an area.
Same goes for the parking space.
Now, this is why here my data, you can just change it.
Now, here for the clinic, we have the address, the Yarraville, and we have the total number of patients,
daily patients in these three is the actual size.
So I have three the second one, three again, then one.
Then to remember that we talk about that, the new data structure that allows you to create your own
data inside.
For example, you can have a string's you get as a key.
I'm saying as a key, you can have a different data type and you can have a stream, you can have a
numbers.
You can have a boolean values.
That's why I use the street.
OK, now same goes for bar.
Then after that, I create to function called clinical report, they will be empty at the beginning
and the parking report there will be empty at the beginning.
And I'm calling this function some passing data into those two functions, these two data here.
If I'm calling colleagues with different name, the same here.
So if he comes out of this clinic, it will contain this boy here if you call, because a lot of the
markings, it will contain this part of you.
OK, now you know how this is going to do is going to work.
So I'm going straight to work to clinics.
So create an instance of a new of the clinic glass like this.
I'm going to use it later that I'm using constant patient.
But this clinic is actually the data from here.
So I'm going to use the map method to loop through all of them through the current element.
And I'm just going to store it in a variable daily patients and that will give me this one hundred five
hundred seventy two that will create.
So if I do it like this, I'm going to show it to you.
Now, if it comes a lot of patients
now, I will have the number of all of the patients and you will see.
Here is area four 105 one seven two three three six six, as I told you, they're coming from this one
on five one seven to thirty three and six six.
Cool.
So what I'm going to do with this patient, so I do have them.
This map method helped me to store it as an area and put it here because remember Map Method will always
create a new every night.
So clinic that called patient and I'm passing this part here.
Good.
This is the clinic from here.
The instance it's not clinics don't get confused.
Right.
So passing this patients.
So let's find where it is called patient is.
So what you think because I'm calling it from the class clinic should be inside the class here is called
patient.
It's inside this class here.
Right.
So this class will take the data.
I will create a very will collect the patients and that will be equal to zero.
And I'm going to loop through each and every element here and why I use the element zero.
OK, I'm just going comes along the entire element and you will see why.
We're just going to refresh here, and I do have a area one only one element, and on the zero position,
he's 105.
So how do we grab that position?
Well, simply, if you put in the element of zero, it will just grab the numbers.
Here is right, so I can sum up all of the patients, so this is how we do that now, the connections
block everything, how we find the average.
So the average is what I have here after looping through all of this.
So it will have like a 500 Rizzotto three hundred and something in then I'm going to divide by the Aeris
length that I've passed in.
So that's the length is zero.
One, two, three, four.
So I'm going to divide it by four and that will give me the average.
Now the all of the patients is just here and income is if I multiply the number of patients by 50 and
if I want an average income, I just grab this and put it down.
Swiftie.
Now, before when we use the template literals, I never show you that we can do a simple math operations
here.
Now you know how to do it, and that's why the result will bring me these four here.
Cool.
Now let's move on.
I'm just going to get rid of this.
In my I don't have it.
OK, now I don't have it anymore, cool, just wait.
I need to get this one because I'm going to have multiple errors now.
I need to go five, six, seven and eight.
Good.
Now I need to go back to the clinic report and see what I'm doing for five, six, seven and eight.
OK, I'm going to use the structure here, but first I'm going to use this map again and I'm going to
go through all of these current elements and I'm just going to grab the euro build.
Then I'm going to put here inside the constant years details.
So if I cause a lot.
Your details, I would expect to have two thousand, so this is one three with four values, so I get
the index from zero until three, right.
And these are coming from twenty six thousand nineteen twenty twenty two thousand sixty.
Okey dokey.
Now, there you have it.
I'm feeling these three back to the get mean Max.
So where I do this function, I'm not calling it with clinic.
So what was my point then?
I can we use this function later for the parks.
But I'm not.
I'm not.
That will be your homework.
And so that get me Max is actually function outside is outside both the cleaning and parking.
Right.
It's outside.
So I can even put it inside, but I want to use it like this.
So now that data or actually the area that I have here, I'm going to use the sprint operator, this
map that mean it will actually, for example, I had four years here and it will spread it into four
variables.
And this means that that map don't mean it will go through that for variables and it will extract the
minimum value and it will store it here back.
The same goes for Max.
The screen operator will spread those four years into four different variables and it will find the
max that the value of those because they were numbers, right?
Actually, it doesn't matter because they were numbers and it can store it back.
So I'm returning an array of two these two values and that is good for the district tree.
I remember how we use the destruction.
Everything that we put on the left, we put two variables in the result from this is going to be attached
to this variable.
So that's why we can just print it out now.
We can do the same thing.
You can do the same thing for the smallest in the greatest number of patients.
So I'm using the same function again.
But instead of storing the years I'm putting here the clinic patients, I mean, I put this value here
one oh five one seven two thirty three.
So here the maximum will be one seven two and the median value will be three.
Let's have a look.
Here is the smallest number of patients.
Thirty three and the largest one seven to cut.
Now the last four is connected with that size variable that I've told you that we just put it to equal
to two.
For example, I'm doing clinics, all the data that I have on top.
Right.
And I'm doing a for each end with the error function.
I am accessing the current element, this building classification.
OK, so according to my belief, this was the best place to use maps.
So we create a concept called clinic size and that will be equal to new empty map.
And after that we set the map and we did one, two and three.
So the one to set was two here.
So if we don't specify a value.
Where was here so three, three, one, two.
So if we don't specify any value here in our data, then the default will kick in and it will immediately
be two.
That will be normal.
Right.
And I'm concerned about this address because I have the access to the super from the superclass.
Right, was built in.
Also, I have the access to the year in clinic site.
I'm getting this that size actually the size here.
So this size, it will not always be too, because I also have three three.
One, two.
OK, save it.
Now go back here and it will say big clinic, big, small, normal.
But look what happens if I don't specify the value here.
That's why we learned about the fault parameters.
So if I save it back, they all of them will be normal clinic.
Right.
Because this.
The full parental will start kick in.
Right, that's it, just going to go back, make it like this, we are done with the clinical reports.
Now, let's do with a parking report.
This has a little bit more calculation.
And I add, as I told you, I didn't expect to do everything here.
But, yeah, I just that's why we recorded the first lecture, because I need to put all of this here.
OK, now I'm going to do with these Parkin's data.
I'm going to map in I'm going to X into the current element with the Arrow function and I'm going to
create an array with one, two, three, four, four different their values in there now stored in these
parking data.
So if I do plug working data, cool, here it is.
I do have four areas and inside I have nineteen sixty three and these three is price it per hour and
this nine is full day price.
This 90 is actual full spot in these 60 is the hourly spot and the same goes for this, same goes for
this, the same goes for this.
You now have four arrays.
So what I'm doing this, I'm creating this call function again outside the parking, we can just put
it inside a parking because we never going to use it anywhere else.
Here it is.
So now your homework will be to put this function, if you want, inside parked here, because you can
because this function will never be used by anybody else.
But I just want to use it outside, OK?
Now, where was it called?
Here it is.
I create a couple of variables in these variables.
I initially initially declare and initialize in the same line.
I think we haven't done this before now.
It's a good idea.
So I'm looking through all of the data and I'm storing for everything here.
Now, this multiplication element of zero, I'm just going to tell you why I'm using element of zero.
So if it comes a lot element now, you will see what will happen.
Actually, I need to get rid of that one, so.
And yet no element of zero, this is 90, this is about full parking, element of one will be 60.
It's about hourly parking.
That's why I can access it.
That's why you need to store this here.
The income is element of zero this year, 90 multiplied by nine in the nine is the element number three.
Right.
That's why I did the same goes for number one.
And number two, I just want to multiply 60 times three.
And after that I'm returning all this in.
When I return this area, I can again use it, this restructuring method.
But the restructuring will help me everything that I grab from this part to put it inside these variables.
And I'm just pointing out that all of them, that's pretty much it.
Now, the last part is we need to find which of the parking's have click.
Should be parking here, has more than one hundred hourly or all the spots.
Now, I'm just using just going to lot of this one.
I'm just going to get rid of it.
Good.
Yeah.
I don't have anything else let you see.
By I will get rid of that as well.
I think just put it here, we don't need this one anymore.
I just wanted to make it clean.
Good.
Now, now where we are.
Here it is.
We are in this seven and eight.
So finding which.
Parking has more than one hundred hourly or all day spots.
OK, so I'm going to use for the first time finding index.
So indexer, that is going to be the constant.
And I'm going to look through it again with a map method and I'm going to grab all of these four spots.
So that will create an array of indexes.
And I'm going to say find the index where the element is greater or equal to 100.
Right now, when I know this index, I can especially grab the parking index, for example, if it's
going to be zero and that has more or equal to a hundred.
All the parking spots in the same goes for here.
Now, I'm just going to tell you how it's going to work.
OK, here it is.
So we actually look for this value and this value, so ninety one hundred eighty one seventy six actually.
Right.
So which is the heart, which is the greatest number here.
That will be the right street.
Right.
Because I'm just going to happy brightness.
Speed for nine has more than an equal to 100.
All the parking spots.
Good.
And the same goes for this value here.
So this one looks a little bit off, right.
Because I'm just going to save it like this in order to show you.
So I'm looking for this.
Don't worry about this.
One hundred and fifty because it's something else.
It's of the size now, which is the greatest year.
Nineteen hundred eighty seven to six hundred.
So that's why these Bridon Street is going to be picked up.
Cool.
The same goes for the hourly.
Which one has a hundred or more.
This one Dockland.
So that's why it's going here.
Good.
Now if you don't understand some of the next three join me.
You know we will do step by step.
But if you're happy with the way I explain it to you, you don't have to.
You're just going to graph.
You can just grab the final one, tweak some things.
If you have something in mind to change it.
That's the out and practice.
That is pretty much it.
So I hope you enjoyed this.
And this is something that I do because I want to save your time if you don't want to listen to me doing
all the codings.
Right.
Thank you very much.
But I hope that I'm going to see you in the next lecture where I explain how are we going to start with
this?
That's it.
See you in the next one.