Guide to TypeScript Conditionals
In this guide we'll walk through how to use conditionals in the TypeScript programming language.
Guide Tasks
  • Read Tutorial
  • Watch Guide Video
Video locked
This video is viewable to users with a Bottega Bootcamp license

In this guide we're going to talk about conditionals in typescript. Conditionals are some of the most commonly used constructs in programming and if you are new to programming then this may be a guide that you want to review a few times. If you're coming from a different language and you're simply wanting to learn the syntax and the flow of typescript then this is going to be a pretty basic type of guide.

IF

I'm going to start off by creating a variable it's going to be a string variable called Password. And I'm going to set the password equal to asdfasdf very secure password. Now. To do a basic conditional then I can simply type in the if command. And if you have Sublime Text with the typescript autocomplete on I can just hit return and Ill fill this out for me and will build a basic if construct. It's very straightforward though. It's just if followed by a Parenthesis which you place a conditional inside and then whatever you want to happen, if that condition is true is what gets run. So in this case I'm going to say if the password is equal to what I know the passwords are going to equal then I want this to say console log. And say yes this is the password.

let password : string = ‘asdfasdf’;

if(password == ‘asdfasdf’) {
  console.log(‘Yes, asdfasdf is the password’);
}

Now that's a very basic one. But let's still run it though. Run tsc And now run node 011_conditionals. And it says yes this is the password.

ELSE

So that's a syntax just for creating a very basic if conditional but now usually you're going to want to have if then else because say that the user got the password wrong you're going to want to give some feedback on that. So in order to add it else it's pretty easy. Just type in else and then you can give curly braces right afterwards. I will copy this and paste it in and say "Sorry permission denied". Now if I come and rerun this. And run the program again you can see everything still working.

let password : string = ‘asdfasdf’;

if(password == ‘asdfasdf’) {
  console.log(‘Yes, asdfasdf is the password’);
} else {
  console.log(‘Sorry, permission denied’);
}

Now what happens if we change this if we change the password to equal this other set of characters. Running the program again. Should now give us our other feedback and it does it says "Sorry permission denied".

ELSE IF

So if you have never worked with conditionals before. Essentially what we're doing is we're creating a flow statement here where we're passing data through this if else conditional. And we're saying first check to see if this condition is true if it is then only care about the information in here. If not then drop down into this else block and then print these values out. Now this is great if you have a very straight forward kind of conditional. But there are many times where you need to chain a few of these together and thankfully there is another thing we can do here. Which is else if and with else if we can pass in another conditional and another Block. And so inside of this condition I'm just going to copy this and grab the value we're using here. And I'll pass this value in. And as you can see we don't have any errors we own a syntax issues.

let password : string = ‘asdfasdf’;

if(password == ‘asdfasdf’) {
  console.log(‘Yes, asdfasdf is the password’);
} else if(password == ‘zxcvzxcv’) {
  console.log(‘Yes, zxcvzxcv is the password’);
} else {
  console.log(‘Sorry, permission denied’);
}

And so what we're doing is we're saying if the password is equal to this value then execute whatever code is inside of this block and if that's true it's going to ignore all the rest of the code here. Now if it's not true it's going to completely ignore this console log statement. It's going to drop down into this second stage share into this else if here and then it's going to check this condition and say ok well if this one isn't true is the password equal to this. If it is true it's going to run whatever code is inside of the block and it's going to bypass this. As long as we have an else statement here this code is always going to be run it's kind of kind of like our fallback plan and whenever you're building something like an authentication engine then you're obviously going to want to have a fallback plan because if someone types in the wrong username or password you want to let them know. So now let's run this code and let's see what happens. Running this will say that "Yes, zxcvzxcv is the password".

So that is how you use a standard if else if else conditional in typescript.

Resources