Instructor: It's now time for your final coding challenge
in this section.
And this one is gonna allow you to assess
whether you actually understood
how the ternary operator works.
So it's gonna be really fun and actually really short.
So let's do that now.
And here it goes,
so Steven wants to build a very simple tip calculator
for whenever he goes eating in a restaurant.
Now in his country, it's usual to tip 15%
if the bill value is between 50 and 300.
And if the value is different,
so if it's not between this range between 50 and 300,
then the tip is usually 20%.
So your task is to calculate the tip
depending on the bill value,
according to the rules that I just mentioned,
and to do this, you will create a variable called tip,
which is then gonna store the tip value.
And probably you should also create a bill variable
which just gonna hold the test data.
So first 275, 1040, and then 430.
So you should test your bill calculator
for these three bill values.
Okay, now what's important here is that it's not allowed
to use an if else statement, all right.
Now, if it's easier for you,
you can first do this calculation using an if else statement
and then convert that to a ternary operator,
but the final solution should not contain
the if else statement, okay.
Then once you have to calculate it,
print a string to the console,
which will contain the initial bill value, the tip value,
and also the final value.
So that's gonna be the bill plus the tip
and as an example, for example, when the bill is 275,
the output string will be like this, okay.
So once more, I hope you managed to do this
and actually I have two hints to help you solving this,
but if you want to try this on your own without the hints,
then just pause the video right now.
But if you actually need to hints, then well, here they go.
So to calculate, for example, 20% of a value,
all you need to do is to multiply the value by 20
divided by 100, which is 0.2.
So multiply it, okay.
So that's how we calculate the percentage of a value,
which you need here for these rules.
So 15% and 20%
Now as a second hint,
to check whether the value is between 50 and 300,
you do basically this comparison.
So it needs to be greater or equal than 50,
and it needs to be less or equal 300.
That's what it means to be between 50 and 300, okay.
And with these two hints
and the knowledge from the last lecture,
I really hope that you manage to implement
this simple tip calculator.
So pause the video now and I see you in a second.
Okay, so I hope you successfully did that
and so let's try to solve it now together,
or actually let me show you my solution
so that you can see how it compares with yours.
And as always, you can also find my solution
in the final folder, in the GitHub repository, okay.
Now actually let's start with the bill variable,
which I'm gonna set to 275,
which is here the first test value,
and now the tip and let's calculate it
using the ternary operator.
So, let's implement this rule,
which is if the value is between 50 and 300,
then the tip should be 15% of the bill value.
So that means that bill must be less or equal 300,
and at the same time, bill must be greater or equal than 50.
Right, and again, that's what it means for the bill value
to be between 300 and 50.
It's gonna be less or equal 300,
and at the same time, greater or equal than 50.
So 40 for example is of course less than 300,
but it's also less than 50
and so this part here will then be false.
and so this entire expression here,
which is stand true and false will be false as well.
Right, so in this case,
the tip here will be the bill value times 15%,
which as I explained here,
all we need to do is to multiply it by 15 divided by 100.
So that 0.15 and else it's 20%.
So bill times 0.2, give it a safe and that's actually it.
So that's number one.
And now as number two,
let's lock the string to the console
as is requested here in number two.
So let's actually grab this template here
so then we just have to replace the values,
and so since we're building a string, we are again,
relying on the template literal.
So here we're gonna put the bill value
here we're gonna put the tip
and we're missing the curly braces
and here the total value is gonna be the bill plus the tip.
So we can, as you already know,
write an expression here using this operator
so the plus operator,
and that's actually it.
So let's try it and with this bill value,
the output should actually be exactly
like it's written up there and it is.
So 275, the tip is a 4125, so just like here
and the total value is 316.25.
Great, and just to understand this one,
so this condition a little bit better,
let's just take this one and paste it here into the console.
And so we see that this one is true
and of course that's because 275 is less than 300
and more than 50.
So it is between this range and therefore
this part of the ternary operator here will be executed
and to become the result of this operator, essentially.
Right, so the result of this operator
will be bill times 0.15 and that's the value
that will then be assigned to the tip variable, okay.
Now let's try another one.
So 40, and now the tip was eight.
Let's try this one here again,
and now the condition is false.
So remember that here in the console,
we have access to all the variables
that we have declared here.
So if I write bill now, you will see that it's actually 40.
So bill is obviously below 300, but it's also below 50.
So this part is false and true and false gives false.
And so in this case, the value
that's gonna be assigned to tip is 40 times 0.2
and that's exactly eight.
So it's what we see here.
Okay, and now just for the sake of completion,
let's do the last one as well
and now this should have worked as well
because now this one is false again
and that's because this time 430 is above 300
and so 86 should be 430 times 0.2.
Let's quickly check that 0.2 and that's right.
That's the 86 that we have up here.
Great, so hopefully you did this and once more,
if you did it a little bit differently,
that's not a problem at all.
I just hope that you made it work, okay.
And actually this concludes the coding part of this section
there's just one more lecture left,
which is going to be a deeper dive into JavaScript versions,
especially into and ES5 and ES6.
So it's gonna be an interesting one and yeah,
I'm waiting for you there.