Original subtitles

1 1

It's now time for your final coding challenge 2

2

in this section. 3

3

And this one is gonna allow you to assess 4

4

whether you actually understood 5

5

how the ternary operator works. 6

6

So it's gonna be really fun and actually really short. 7

7

So let's do that now. 8

8

And here it goes, 9

9

so Steven wants to build a very simple tip calculator 10

10

for whenever he goes eating in a restaurant. 11

11

Now in his country, it's usual to tip 15% 12

12

if the bill value is between 50 and 300. 13

13

And if the value is different, 14

14

so if it's not between this range between 50 and 300, 15

15

then the tip is usually 20%. 16

16

So your task is to calculate the tip 17

17

depending on the bill value, 18

18

according to the rules that I just mentioned, 19

19

and to do this, you will create a variable called tip, 20

20

which is then gonna store the tip value. 21

21

And probably you should also create a bill variable 22

22

which just gonna hold the test data. 23

23

So first 275, 1040, and then 430. 24

24

So you should test your bill calculator 25

25

for these three bill values. 26

26

Okay, now what's important here is that it's not allowed 27

27

to use an if else statement, all right. 28

28

Now, if it's easier for you, 29

29

you can first do this calculation using an if else statement 30

30

and then convert that to a ternary operator, 31

31

but the final solution should not contain 32

32

the if else statement, okay. 33

33

Then once you have to calculate it, 34

34

print a string to the console, 35

35

which will contain the initial bill value, the tip value, 36

36

and also the final value. 37

37

So that's gonna be the bill plus the tip 38

38

and as an example, for example, when the bill is 275, 39

39

the output string will be like this, okay. 40

40

So once more, I hope you managed to do this 41

41

and actually I have two hints to help you solving this, 42

42

but if you want to try this on your own without the hints, 43

43

then just pause the video right now. 44

44

But if you actually need to hints, then well, here they go. 45

45

So to calculate, for example, 20% of a value, 46

46

all you need to do is to multiply the value by 20 47

47

divided by 100, which is 0.2. 48

48

So multiply it, okay. 49

49

So that's how we calculate the percentage of a value, 50

50

which you need here for these rules. 51

51

So 15% and 20% 52

52

Now as a second hint, 53

53

to check whether the value is between 50 and 300, 54

54

you do basically this comparison. 55

55

So it needs to be greater or equal than 50, 56

56

and it needs to be less or equal 300. 57

57

That's what it means to be between 50 and 300, okay. 58

58

And with these two hints 59

59

and the knowledge from the last lecture, 60

60

I really hope that you manage to implement 61

61

this simple tip calculator. 62

62

So pause the video now and I see you in a second. 63

63

Okay, so I hope you successfully did that 64

64

and so let's try to solve it now together, 65

65

or actually let me show you my solution 66

66

so that you can see how it compares with yours. 67

67

And as always, you can also find my solution 68

68

in the final folder, in the GitHub repository, okay. 69

69

Now actually let's start with the bill variable, 70

70

which I'm gonna set to 275, 71

71

which is here the first test value, 72

72

and now the tip and let's calculate it 73

73

using the ternary operator. 74

74

So, let's implement this rule, 75

75

which is if the value is between 50 and 300, 76

76

then the tip should be 15% of the bill value. 77

77

So that means that bill must be less or equal 300, 78

78

and at the same time, bill must be greater or equal than 50. 79

79

Right, and again, that's what it means for the bill value 80

80

to be between 300 and 50. 81

81

It's gonna be less or equal 300, 82

82

and at the same time, greater or equal than 50. 83

83

So 40 for example is of course less than 300, 84

84

but it's also less than 50 85

85

and so this part here will then be false. 86

86

and so this entire expression here, 87

87

which is stand true and false will be false as well. 88

88

Right, so in this case, 89

89

the tip here will be the bill value times 15%, 90

90

which as I explained here, 91

91

all we need to do is to multiply it by 15 divided by 100. 92

92

So that 0.15 and else it's 20%. 93

93

So bill times 0.2, give it a safe and that's actually it. 94

94

So that's number one. 95

95

And now as number two, 96

96

let's lock the string to the console 97

97

as is requested here in number two. 98

98

So let's actually grab this template here 99

99

so then we just have to replace the values, 100

100

and so since we're building a string, we are again, 101

101

relying on the template literal. 102

102

So here we're gonna put the bill value 103

103

here we're gonna put the tip 104

104

and we're missing the curly braces 105

105

and here the total value is gonna be the bill plus the tip. 106

106

So we can, as you already know, 107

107

write an expression here using this operator 108

108

so the plus operator, 109

109

and that's actually it. 110

110

So let's try it and with this bill value, 111

111

the output should actually be exactly 112

112

like it's written up there and it is. 113

113

So 275, the tip is a 4125, so just like here 114

114

and the total value is 316.25. 115

115

Great, and just to understand this one, 116

116

so this condition a little bit better, 117

117

let's just take this one and paste it here into the console. 118

118

And so we see that this one is true 119

119

and of course that's because 275 is less than 300 120

120

and more than 50. 121

121

So it is between this range and therefore 122

122

this part of the ternary operator here will be executed 123

123

and to become the result of this operator, essentially. 124

124

Right, so the result of this operator 125

125

will be bill times 0.15 and that's the value 126

126

that will then be assigned to the tip variable, okay. 127

127

Now let's try another one. 128

128

So 40, and now the tip was eight. 129

129

Let's try this one here again, 130

130

and now the condition is false. 131

131

So remember that here in the console, 132

132

we have access to all the variables 133

133

that we have declared here. 134

134

So if I write bill now, you will see that it's actually 40. 135

135

So bill is obviously below 300, but it's also below 50. 136

136

So this part is false and true and false gives false. 137

137

And so in this case, the value 138

138

that's gonna be assigned to tip is 40 times 0.2 139

139

and that's exactly eight. 140

140

So it's what we see here. 141

141

Okay, and now just for the sake of completion, 142

142

let's do the last one as well 143

143

and now this should have worked as well 144

144

because now this one is false again 145

145

and that's because this time 430 is above 300 146

146

and so 86 should be 430 times 0.2. 147

147

Let's quickly check that 0.2 and that's right. 148

148

That's the 86 that we have up here. 149

149

Great, so hopefully you did this and once more, 150

150

if you did it a little bit differently, 151

151

that's not a problem at all. 152

152

I just hope that you made it work, okay. 153

153

And actually this concludes the coding part of this section 154

154

there's just one more lecture left, 155

155

which is going to be a deeper dive into JavaScript versions, 156

156

especially into and ES5 and ES6. 157

157

So it's gonna be an interesting one and yeah, 158

158

I'm waiting for you there.