JavaScript Operators & JavaScript Conditionals | JavaScript Tutorial #4

Key Takeaways

in this video you will learn with very simple examples and visualizations everything about conditionals and comparison operators in JavaScript so first let's see what comparison operators are let's consider as an example Facebook feature to display birthdays of its users so basically if today is your birthday Facebook will show a birthday icon and will send notifications to all your friends and for Facebook to check whether it's your birthday today basically it has to compare today with your birthdate right so that comparison or equals in JavaScript is expressed with 3 comparison sites like this so one comparison sign is reserved for assigning variables as we saw in one of my previous videos of variables so double or triple equal signs are used to check the Equality of two values so it's the difference between the two so let's say I have a variable age 30 so if I compare value of variable age to 30 then I get true right if I triple compare that I also get true so same results now if I compare the value with a string representation of 30 I also get true however if I triple check I get false and this is a difference between these two the double comparison checks equality of the values on tooth sides so checks the value here checks the value here and compares them by the value the triple equality compares value and also the type the data type of those values so if I have a number here and a number here which are same values then it's going to be true if I have a number value here which is defined here and a string value here of the same value I get false because the data types are not the same so that's the difference and obviously if I put here another value it's gonna be false in any case right like this or like this doesn't really matter and that little difference can actually have a big impact that's why these concept is important in JavaScript general rule is that you should in most cases use the triple equation to compare two values now let's consider another example where you order something on Amazon it says that shipping is free above purchase of 20 euros so when you add things to your cart program checks whether your order total is above 20 or below 20 and then calculates the shipment costs based on that and let's say charges you 5 euros if your if your total order is under 20 euros so now we don't have the equal check anymore but rather is it higher or is it lower so the way to check that is let's clear these so let's define variables so you have the total price let's say you gathered items that are 19 euros and now the program checks if total price is greater than 20 euros you get a boolean expression of false because this condition is wrong in the same way the program can also check the opposite direction so you can check whether your total price is below 20 but notice that we don't check for value 20 so what happens if the total price is exactly 20 so basically here we need to check that if total price is below 20 or 20 euros in both cases you get charged for the shipping so in order to do that you can combine those two expressions and say like this so either it should be less than 20 or to be exactly 20 for that to be true and as you see each of these comparisons return to you a boolean expression of either or true only one of these outcomes is possible so what this means is that in the program you check if this condition comes out as true then you want to offer free shipping otherwise you want to charge five euros for shipping and the way it's going to be written inside of the program using JavaScript syntax is if your price is greater than twenty here will be code that lets say calculates or sets the price of shipping so here we set it to zero there is no shipping cost otherwise is expressed with else shipping cost equals to five euros so this is how the conditions are used in JavaScript to check the condition and based on that divided this or if we switched that condition we can also check if total price is less than or equal to twenty then shipping cost will be set to five otherwise the shipping cost will be zero so to go back to some technical terms in JavaScript this here is called if-else statements whatever is inside if is called a condition so this thing here that evaluates to either true or false is a condition and this here that compares those two values is called a comparison operator so greater smaller equals etc all these are comparison operators but let's say you have a case where you have three different shipping costs right so for example if the price is below ten euros you get charged five euro shipping costs if it's below twenty you get charged only three euros and if it's above twenty you get charged nothing now you don't have if-else only but you have three conditions it's also super simple to do that with if-else so basically you check again if total price is less than or equal to ten you get charged five euros and here you are gonna say else/if which is another statement where you can write the conditional where we're gonna check where the total price is less than or equal to 20 in that case you get charged three euros and there comes our final else which is zero so now I have three conditions here so the first condition here says it's less than or equal to ten the first one checks another condition and the third one important thing to note here that the last else or the the else here doesn't have a condition explicitly but it implies that both of these above conditions were false so both of them were wrong B and because it's implicit we don't have to check it explicitly here so you could also go here and do that else if price is greater then 20 and this will work just fine however because it's implicit we don't need that so we sell comparisons between two values using equals higher or lower the final operator is not equals for example consider a feature where a web application checks whether user is a Premium Member or not obviously if you are not a premium user you won't see the cool features they have or you won't be able to access some premium content so when you log in program will check is user membership premium so with equals or it can check use a membership not premium and in order to express that negative comparison you use this syntax so not equals in JavaScript is expressed with exclamation mark and double equals and to show that in if-else statements let's say if user membership is not premium show user non-premium contents or maybe even recommend a premium upgrade as a marketing measure and else show premium contents and finally you can combine all these conditions so for example if today is your birthday and you have displayed that on your profile only then the program will show the notification so both conditions must be true so if today state is the same as your birth date and birthday displayed is true so here you can use a comparison with boolean true or false so both these conditions must be true for notification to be sent and in JavaScript the syntax for end is this so this basically is also a valid condition that you can also put inside of the if condition so if this whole thing is true then show notification else do not or another example back to the shipment cost let's say you don't pay for the shipment if the total price is over 20 euros or you have Amazon Prime account so the way to express that would be total price over 20 euros or amazon prime equals so here only one of them has to be true for you to get free shipment or in JavaScript is expressed with double pipes and again you can put that in if statement and say if either this or this is true then give a free shipment otherwise don't and you can also use negation in conditions for example you want to check whether this whole thing is false and the way to do that is using the exclamation mark and the brackets so basically this will check whether this whole condition is false now even if you understood all this concept it's always a good idea to practice them yourself so that you get it better so because of that I'm gonna put a link to practical exercises for conditionals and competitors in the video description below so make sure to check that out and practice yourself with a couple of examples and once you do that you can come back for another JavaScript video and if you don't want to miss that you can subscribe to my channel and click the notification bell so that you can notified when the next video is out so thanks for watching and see you in the next video