Hello and welcome.
In this video we are going to create the logic that or make the loan calculator work.
So let's create a new file that we will use to write our javascript code.
So this is our page CML.
I'm just going to click on the file option here and click on new file and I'm going to save this file
to save as inside the directory called Zone calculator.
And when you save these as loan calculator dot G S and make sure the dropdown.
I'm going to select javascript safe so any code that idea now will be a javascript code.
O K through the function I'm going to create I'm going to call it compute loan because I've already
made references to it here inside my hasty AML code.
So are typing the word function to create a function you do function space followed by the name of the
function and the function is going to be called compute loan.
Notice I've used camel case which means the first letter is lowercase and the first letter of the next
word is uppercase.
And next I need to place parentheses.
And then curly braces are now separate the curly braces in between the curly braces is where I will
add the logic for the loan first and I want to do I'm going to add some variables.
So let me run through the variables with you on Line 3.
I've created a variable called amount.
This would be this will represent the amount of loan that you want to borrow.
And I'll set it to equal to document to get element by a deep and a path theme the I.D. of amount.
If you're wondering where you got this idea for values from is from the hasty melon side of things.
So here we've got an idea called amount.
So that's what I'm referring to here.
And then the dot value basically refers to the value that you would input as the amount.
Line 4.
I've got a variable caught interest on the score rate and I'll set that to equal to the document or
get element by a D.
And the idea is interest on the score rate.
So whatever value we have as the interest rate is going to grab that 2 again if I go into my hate mail
can see we've got an idea.
Caught interest on the score rate.
That's what he's referring to.
Line 5.
I've got a variable called months.
Again this is equal to the document don't get element by a T.
And the idea is months.
Can we add any value that it's entered for that value for that month or be attached to the variable.
So if we come here a game we've got an I.D. code months.
That's what he's referring to here we've got a variable called interest.
So this is going to represent the actual interest.
So the interest on the loan is going to be the amount which it is a man variable times the interest
on the score rate times 0 1.
Any time you have values surrounded by parentheses the old values are computed first.
So it will do the interest rate times 0.01 first before the division and the multiplication.
Okay.
So the point one basically gives it a two decimal places so to have two decimals after the figure lines
seven here I've got a variable called payment.
And this variable is gonna be caused to the amount.
This will represent the monthly payment that the loan borrower have to pay.
So it's going to be equal to the amount divided by the month's plus the interest.
And then here we attach attaching to fixed method.
Basically this enables you to have two decimal places or two numbers after the decimal place.
That's what that is for next we're going to add a line of code that will be ripped rip responsible for
putting commas on numbers for three digits.
So it will look trigger value and then place a comma after every three digit so I'm gonna try and explain
this line aid as much as I can here.
The payment basically here is going to equals to the payment to string.
Basically converting the value to string and then we replace it.
This is where it's going to convert it into a money format then convert the format format into money
and you're doing that using this replace method and inside the replace method here we've got these values.
I'll try and explain these as much as I can this slash B here.
Basically is used to look within a word boundary.
And what that means is that it can't be part of another type of work.
It has come of a pattern.
It has to look for.
And then this here this question mark basically the question mark on the equals two tells it to find
what our group is looking for.
For example a to look for is using these these last three here to look for three digits so it to look
for any three digits in a row and then place a comma that the plus this plus basically marks the three
digits wrapped in parentheses to make sure that is treated as a block of three so basically helps to
repeat the pattern.
So he knows where to place the comma after every three digits.
I've added another block another line of code line line here.
Line name basically is going to be responsible for displaying the output.
So he's going to say document we're using the document to get element by a method and we are grabbing
the I.D. which is this.
Here this idea here.
This page to tag.
So he's going to grab that.
This is where it will inject the result of the computed loan repayment.
So it will grab that and it will replace that div the contents of it with this dot in a hasty AML.
And the value of this in our hate mail is this here.
So it will now output inside the DB here.
It will output the word monthly payment.
It would then give the value of the monthly payment which is going to be in dollars plus the payment.
Okay.
So that's what it's going to do.
So I'm just going to save that to the file and save all and I'll go into my directory which is this
and just double click on the loan calculator dot hash tag AML to run the application.
So let's quickly test it.
Let's say I want to borrow ten thousand.
You can either input the value or you can use this little hand goes here to move it forward.
So I'm going to put in 10000 and let's say the interest rate on that is 10 percent let's say I want
to borrow that over twelve months.
This is what I'm going to repay every month nine wants six point six seven.
So these values are changeable.
So feel free to play around with the values to test the app.
So that's basically it.
And we've got the main functionality of the app working in the next lecture.
I'm just going to add some CSF to make it look a bit nicer.
So that's it for this lecture.
Thank you for watching.
Bye for now.