Conditional Statement + Truthy/Falsy + logical/comparison + short circuit evaluation + Ternary operator + Switch statement
Conditional statement:
Conditionals take an expression, which is code that evaluates to determine a value, and checks if it is true or false. If it’s true, we can tell our program to do one thing — we can even account for false to do another.
The following concepts:
If statement
In programming, we can also perform a task based on a condition using an if statement:
if (true) {
console.log('This message will print!');
}
// Prints: This message will print!
if...else statement
In many cases, we’ll have code we want to run if our condition evaluates to false.
If we wanted to add some default behavior to the if statement, we can add an else statement to run a block of code when the condition evaluates to false.
if (false) {
console.log('The code in this block will not run.');
} else {
console.log('But the code in this block will!');
}
// Prints: But the code in this block will!
Comparison operators
When writing conditional statements, sometimes we need to use different types of operators to compare values. These operators are called comparison operators.
Here is a list of some handy comparison operators and their syntax:
We can also use comparison operators on different data types like strings:
'apples' === 'oranges'//false
In the example above, we’re using the identity or strict operator (===) to check if the string 'apples' is the same as the string 'oranges'. Since the two strings are not the same, the comparison statement evaluates to false.
Strict equality compares two values for equality.
// If you try to test if the number 5
//is equal to the string “5” the result is true.
var a = 5;
var b = "5";
if ( a == b) --> true
//That’s because JavaScript figures out the value
//of this string is five, and five is the same as five,
//so therefore a equals b.
//But if you ever need to test to see
//if two things are identical, three symbols is the way to go.
var a = 5;
var b = "5";
if ( a === b) --> false
Logical Operators
Working with conditionals means that we will be using booleans, true or false values. In JavaScript, there are operators that work with boolean values known as logical operators.
Truthy and Falsy
consider how non-boolean data types, like strings or numbers, are evaluated when checked inside a condition.
Sometimes, you’ll want to check if a variable exists and you won’t necessarily want it to equal a specific value — you’ll only check to see if the variable has been assigned a value.
let myVariable = 'I Exist!';
if (myVariable) {
console.log(myVariable)
} else {
console.log('The variable does not exist.')
}
List of Falsy:* img from MDN
Say you have a website and want to take a user’s username to make a personalized greeting. Sometimes, the user does not have an account, making the username variable falsy. The code below checks if username is defined and assigns a default string if it is not
let username = '';
let defaultName;
if (username) {
defaultName = username;
} else {
defaultName = 'Stranger';
}
console.log(defaultName); // Prints: Stranger
If you combine your knowledge of logical operators you can use a short-hand for the code above. In a boolean condition, JavaScript assigns the truthy value to a variable if you use the || operator in your assignment:let username = '';
let defaultName = username || 'Stranger';
console.log(defaultName); // Prints: Stranger
short-circuit evaluation
Because || or statements check the left-hand condition first, the variable defaultName will be assigned the actual value of username if it is truthy, and it will be assigned the value of 'Stranger' if username is falsy.
Ternary Operator
let isNightTime = true;
if (isNightTime) {
console.log('Turn on the lights!');
} else {
console.log('Turn off the lights!');
}
//We can use a ternary operator to perform the same functionality:
isNightTime ? console.log('Turn on the lights!') : console.log('Turn off the lights!');
Tip: Ternary conditions can be chained.example below But not encouraged because of code readability.
function example(…) {
return condition1 ? value1
: condition2 ? value2
: condition3 ? value3
: value4;
}
if...else and else if
let stopLight = 'yellow';
if (stopLight === 'red') {
console.log('Stop!');
} else if (stopLight === 'yellow') {
console.log('Slow down.');
} else if (stopLight === 'green') {
console.log('Go!');
} else {
console.log('Caution, unknown!');
}
The else if statements allow you to have multiple possible outcomes. if/else if/else statements are read from top to bottom, so the first condition that evaluates to true from the top to bottom is the block that gets executed.Switch keyword
A switch statement provides an alternative syntax that is easier to read and write. A switch statement looks like this:
let groceryItem = 'papaya';
switch (groceryItem) {
case 'tomato':
console.log('Tomatoes are $0.49');
break;
case 'lime':
console.log('Limes are $1.49');
break;
case 'papaya':
console.log('Papayas are $1.29');
break;
default:
console.log('Invalid item');
break;
}
// Prints 'Papayas are $1.29'
Note: Without break keywords, the first matching case will run, but so will every subsequent case regardless of whether or not it matches—including the default. This behavior is different from if/else conditional statements that execute only one block of code.Review
*The ternary operator is shorthand to simplify concise if...else statements.
Reference
この問題について(Conditional Statement + Truthy/Falsy + logical/comparison + short circuit evaluation + Ternary operator + Switch statement), 我々は、より多くの情報をここで見つけました https://velog.io/@shinyo627/Conditional-Statement-TruthyFalsy-logicalcomparison-short-circuit-evaluation-Ternary-operator-Switch-statementテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol