What I learned, what I’m still figuring out, and where I might go next.

Conditionals

if statements in JavaScript use parentheses around the condition:

if (height > 4) {
  console.log("You are tall enough!");
}

else if and else are supported as you might expect:

if (height > 6) {
  console.log("You are super tall!");
} else if (height > 4) {
  console.log("You are tall enough!");
} else {
  console.log("You are not tall enough!");
}

Comparison Operators

5 < 6; // evaluates to true
5 > 6; // evaluates to false
5 >= 6; // evaluates to false
5 <= 6; // evaluates to true

The equality operators, however, are a bit… different. To compare two values to see if they are exactly the same, use the strict equality (===) and strict inequality (!==) operators:

5 === 6; // evaluates to false
5 !== 6; // evaluates to true

The “normal” equality (==) and inequality (!=) operators are a bit more… flexible:

5 == 6; // evaluates to false
5 == "5"; // evaluates to true

5 != 6; // evaluates to true
5 != "5"; // evaluates to false

The “strict equals” (===) and “strict not equals” (!==) compare both the value and the type. The “loose equals” (==) and “loose not equals” (!=) attempt to convert and compare values of different types. With the loose versions, the string '5' and the number 5 are considered “equal”, which, in good code, is usually not what you want.

Logical Operators

In JavaScript, the equivalent logical operators use symbols:

• && (and) - Returns true if both conditions are true
• || (or) - Returns true if either of the conditions are true
• ! (not) - Returns true only if the input is false

true && true; // true
true && false; // false
true || false; // true
false || false; // false
!false; // true
!true; // false

Switch

Switch statements are a way to compare a variable against multiple possible values. They are similar to if-else statements, but tend to be more readable when there are many potential options.

const os = "mac";
let creator;
switch (os) {
  case "linux":
    creator = "Linus Torvalds";
    break;
  case "windows":
    creator = "Bill Gates";
    break;
  case "mac":
    creator = "Steve";
    break;
  default:
    creator = "Unknown";
    break;
}

console.log(creator);
// Steve

Unlike some languages where fall-through doesn’t happen by default, JavaScript will continue to execute the next case until it reaches a break or return statement.

99 times out of 100, you’ll want to include a break/return statement after each case to prevent this behavior.

Ternary Operator

Sometimes using 3-5 lines of code to write an if/else block is overkill. The ternary operator makes it easy to write a conditional as a single expression.

const price = isMember ? "$2.00" : "$10.00";

Read it in English as:

If isMember is true, evaluate to $2.00, otherwise evaluate to $10.00

let price;
if (isMember) {
  price = "$2.00";
} else {
  price = "$10.00";
}

Why Ternary?

Ternary’s latin root means “3”, and it’s the only JavaScript operator that takes three operands.

• A condition followed by a question mark (?)
• An expression to execute if the condition is truthy followed by a colon (:)
• The expression to execute if the condition is falsy.

Truthy and Falsy

A “truthy” value is a value that is considered true when encountered in a Boolean context. In JavaScript, you don’t need to explicitly convert a value to a Boolean before using it in a conditional:

if ("hello") {
  console.log("hello is truthy");
}
if (42) {
  console.log("42 is truthy");
}
// hello is truthy
// 42 is truthy

A “falsy” value works the same way, but for values that evaluate to false:

if (0) {
  console.log("0 is falsy");
}
if (null) {
  console.log("null is falsy");
}
if (undefined) {
  console.log("undefined is falsy");
}

Common truthy values include:

• true
• 42 (any number that isn’t 0)
• "hello" (any non-empty string)
• [] (an empty array)
• {} (an empty object)
• function() {} (an empty function)

Common falsy values include:

• false
• 0
• "" (an empty string)
• null
• undefined
• NaN (Not a Number)

Nullish Coalescing

The nullish coalescing operator ?? is a way to handle these cases in a more concise way.

let myName = null;
console.log(myName ?? "Anonymous"); // "Anonymous"

myName = "Jay";
console.log(myName ?? "Anonymous"); // "Jay"

If the value on the left of ?? is null or undefined, the value on the right is returned. Otherwise, the value on the left is returned. It’s a way to set sane defaults for variables that might be empty.

Still Curious About