Logic
- The building blocks of interactivity
- Computers can do basic logical checks
- Greater than / greater than or equal to
- Less than / less than or equal to
- Equal to
- Not equal to
- These checks all turn out to be true or false
Less than
var resultOne = 5 < 7; //true
var resultTwo = 7 < 5; //false
Greater than
var resultOne = 5 > 7; //false
var resultTwo = 7 > 5; //true
Equal to
var resultOne = 5 == 5; //true
var resultTwo = 7 == 5; //false
Not equal to
var resultOne = 5 != 5; //false
var resultTwo = 7 != 5; //true
The if statement
-
Only runs a block of code if something is true
-
A block of code is anything inside of curly brackets { }
-
An example:
if(true)
{
//this code runs
}
Else
- The else statement only runs if the thing within the if statement is false
if(4<5) {
alert("All is right with the world.");
}
else
{
alert("Something has gone terribly wrong");
}
Confirms
These are awful. Never use them in real development. And yet, for our purposes here, they can be useful.
In short, using the confirm method in JavaScript pops up a window that displays some text and lets the user respond with a yes or a no.
This response turns into a boolean true or false.
var yesOrNoHmmm = confirm("Yes or no?");
console.log(yesOrNoHmmm); //will be either true or false
Nesting conditionals
- It is entirely possible to have if statements within if statements
//get user's input if they want to read a book
var readAbook = confirm("Do you want to read a book?");
var doHomework = confirm("Do you also want to do you homework?")
if(readABook == true)
{
//if the user wants to read a book
if(doHomework==true)
{
//if the user wants to do their homework
alert("Excellent!");
}
}
else
{
//if the user does not want to read a book
alert("Your mind will rot!")
}
Quick question
- With the code above, is there a chance the user will not see a final alert?
Logical operators
- The previous example can be simplified down a bit using logical operators
&& //('AND')
|| //('OR')
How the logical operators work
- looks for a true/false one either side
- Turns into a single true/false
true || false // true
true || true // true
false || false // false
true && true // true
true && false // false
false && false // false
Simplifying our previous if/else statement
//get user's input if they want to read a book
var readAbook = confirm("Do you want to read a book?");
var doHomework = confirm("Do you also want to do you homework?")
if(readABook == true && doHomework == true)
{
//if the user wants to read a book AND do their homework
alert("Excellent!");
}
else
{
//if the user does not want to read a book
alert("Your mind will rot!")
}
Else if
Else ifs will only run if the previous if does not evaluate to true. They come after a closing curly bracket, and you can have also many as you want.
var grade:number = 85;
if(grade >= 90) {
console.log("Hooray.");
} else if (grade >= 80) {
console.log("good enough.");
} else if (grade >=70) {
console.log("I am avergae.");
} else {
console.log("Count have done better...");
}
A brief note about formatting
- Note that every time a { appears, the next line is tabbed in
- And once that block exits with a }, the following lines are not longer tabbed in
- Get in the habit of doing this
- Yes, it will be worth points