Compound Conditionals in TypeScript
In this guide you'll learn how to use compound conditionals in TypeScript programs, including how to work with the: and, or and not programming mechanisms.
Guide Tasks
  • Read Tutorial
  • Watch Guide Video
Video locked
This video is viewable to users with a Bottega Bootcamp license

In this guide I'm going to go through our last topic on conditionals and I'm going to talk about compound conditionals so I brought back our password conditional that checks to see if a password is equal to this value or if it's equal to this value by using the if and then the else if conditional With else as a default. However we can actually shorten this code by using a compound conditional.

AND &&

I can use a double ampersands and then paste this conditional in. And now if I run this then if it is. This value and its this value it'll pass. But now take a look at it really quick and think if this is going to pass or not and then I'm going to run it. So if you look at this code. See if there's anything the matter with it. I'm going to switch over to the terminal. Let me verify this. Tsconfig and I’ll switch over so it will run our code. OK. Now if I run compound conditionals you can see that says permission denied.

Let email : string = ‘test@test.com’;

If (password == ‘asdfasdf’ && password == ‘qwerqwer’) {
  Console.log(‘Password id correct’);
} else {
  console.log(‘Permission denied’);
}

But why is that. We have both of these items in and this one should pass right. Well not quite. And the reason for this has to deal with a topic in computer science called boolean logic and what Boolean logic means is that this value right here even if it passes if we have double ampersands this value to the right also has to pass. So the only way that this code would actually work in terms of coming in and making this condition true is if both of these values were set to this. And that's because when ever use an AND statement you're checking to make sure that both of these items are right. If you're wondering when you would use this because obviously this doesn't seem very helpful. Is let's say that we had something like an e-mail and the e-mail was test@test.com. And now we actually have a real authentication system here where we're checking for an e-mail and we're saying OK if the password is this and the e-mail is this then say. You are authorized. And now let's try to run this.

let email : string = ‘test@test.com’;
let password : string = ‘asdfasdf’;

if (password == ‘asdfasdf’ && email == 'test@test.com') {
  console.log(‘You are authorized’);
} else {
  console.log(‘Permission denied’);
}

And it says you are authorized So that is working and this is actually kind of close to how you would implement a very basic authentication system. Usually you'd look inside a database obviously for these values you wouldn't want to store all right here but this is kind of the basic concept. So you have the ability to verify that both of these are what we're looking for. Now what happens if someone comes in and types in the wrong e-mail address. He probably already guessed what could happen because we've kind of run through it. We run this says permission denied because it's validating both of these.

OR ||

Now going back to our other example let's say that we have we're checking for multiple passwords. I'm. Going to grab a password over here and we'll give our. Other password. Now how can we get this to work because there may be times where you want to have one value true or the other value true but you don't really care if both of them are true. When that's the case you can get rid of the ampersands and do double pipes || and if you do not know what this character is or where it is on your keyboard look right above your return key and are right there. If you hit shift and then press that button you're going to be able to get these pipes and the pipe character usually in most programming languages represents the or when it has two of them. So this is kind of the opposite of. And in the sense that and required both of these values to pass or says I'm fine if this one passes. Or if this one passes. So now let's come here let's run the code. And now it says you are authorized So everything is working there.

let email : string = ‘test@test.com’;
let password : string = ‘asdfasdf’;

if (password == ‘asdfasdf’ || password == ‘zxcvzxcv’) {
  console.log(‘You are authorized’);
} else {
  console.log(‘Permission denied’);
}

NOT

Now I want to talk about one other item I'm going to comment this out and this is something that you may or may not come across when you're building applications which is the ability to have a logical NOT operator. So let's check our e-mail here. We're going to say if e-mail is equal to test @test.com. Then I want you to console log that you are authorized. Now if I run this this is going to work because we know this values here. However there may be times where you want to take a whole condition and you want it kind of almost flip it on its head. When you do that if you hit shift and the exclamation mark right here that is going to be able to give you that kind of behavior. We have a little typescript error here because it is it says oh it's expecting another value so we need to actually wrap all of this in a number of parentheses. And then that's going to be working. But what it's going to do whenever you have the logical NOT operator it's going to take whatever is inside of here. So it's going to say OK if this value is equal to true if the condition is true then make it false. This is not something you're going to use on a day in day out basis. However you most likely will come across it. So I want you to be familiar with it when you see this not operator in front of a conditional so coming down running this code when we run it nothing should happen and nothing does. Because even though we know that this test@test.com It should make the person authorized because we're using the logical NOT operator.

if (!(email == ‘test@test.com’)) {
  console.log(‘You are authorized’);
}

It's flipping it on its head if you're coming from a language like Ruby the not operator is actually very similar to using the unless system. So instead of doing if and then whatever you have for the condition Ruby has the ability to say unless this is true. This is kind of like doing this I personally am not a big fan of writing this. I do not remember the last time where I actually use this in this kind of context. However there have been times I've come across code libraries that had this in place in so it's very important to know. Just so you're not confused when you get the exact opposite behavior that you're really looking for. So these are the three items that are going to be your logical operators that allow you to place compound conditionals inside of typescript programs.

Resources