This is an article with the notes that I summarized after learning「Introduction To JavaScript」in Codecademy. All the notes are in English because I found it very hard to translate everything from English to Chinese.

Control Flow

With control flow statements, JavaScript programs can make decision by executing codes based on certain conditions. For example, if I want to design a program that can turn a heater on when the temperature inside the room is below 20℃; and turn the heater off when the temperature is above or equal to 20℃. The following codes demonstrate how this might work.

In this example, I made a temperature variable, and assigned the value 16 to the variable. Below the first line, I wrote if/else statements, which is an example of control flow statements. (temperature < 20) is the condition of the statements, if this condition is true, then the codes after the condition within { } will run. Otherwise the computer will look at the next line, and if the condition is met, it will run the next line.

let temperature = 16;

if (temperature < 20) {
  // turn the heater on
} else {
  // turn the heater off
}

If the condition contains the following values, it will not be considered as true:

• false
• 0 and-0
• " " and ' ' (empty strings)
• null
• undefined
• Nan
• document.all

The exclamation point

If the exclamation point is used in the condition, then the condition will become its opposite. For example, if the condition is true, its opposite is false.

In this case, the variable isNotCold is assigned with the value true, which means "it is not cold outside". But with the exclamation point in the condition (!isNotCold), the condition is now false, which means "it is cold outside".

let isNotCold = true;

if (!isNotCold) {
  console.log("Let's not go outside.");
} else {
  console.log("Let's go outside and play!");
}

Comparison operators

• Less than: <
• Greater than: >
• Less than or equal to: <=
• Greater than or equal to: >=
• Check if two things are equal: ===
• Check if two things are not equal: !==

let season = 'spring';

if (season === 'spring') {
  console.log("It's a beautiful season with flowers.");
} else if (season === 'summer') {
  console.log("It's the season for swimming!");
} else if (season === 'autumn') {
  console.log("It's a season for harvest.");
} else if (season === 'winter') {
  console.log("It's a season with snow!");
} else {
  console.log("Error: wrong input");
}

Because the variable season is assigned with 'spring', the result will be It's a beautiful season with flowers..

Logic operators

• both must be true: &&
• either can be true: ||

let weather = 'cold';
let isRaining = true;

if (weather === 'cold' && isRaining) {  
  console.log("You should wear more and take an umbrella");
} else if (weather === 'cold') {
  console.log("You should wear more");
} else {
  console.log("You should take an umbrella");
}

Because both conditions weather === 'cold' and isRaining are true, so the result will be "You should wear more and take an umbrella".

Switch statement

Switch statement is another type of control flow, which is mainly consisted of 3 parts: switch (expression) { }, case, break;. expression here is something that you want to evaluate, and case is something to compare with expression. break; is used to stop the process of comparison after the code in the matched case is executed.

let season = 'spring';

switch (season) {
  case 'spring':
    console.log("It's a beautiful season with flowers.");
    break;
  case 'summer':
    console.log("It's the season for swimming!");
    break;
  case 'autumn':
    console.log("It's a season for harvest.");
    break;
  case 'winter':
    console.log("It's a season with snow!");
    break;
  default: 
    console.log("Error: wrong input");
    break;
}

To compare the switch statement with the if/else statement, case is like if, and default is like else. Switch statement always has a break after each case; it uses : instead of {.

Ternary operator

Ternary operator is a shortened way of writing if/else statement, here is an example that is converted from if/else statement to the expression using ternary operator.

// without ternary operator
let isThirsty = true;

if (isThirsty) {
  console.log("I need water");
} else {
  console.log("I don't need water");
}

//with ternary operator
isThirsty ? console.log("I need water") : console.log("I don't need water");

In the codes with ternary operator, ? checks if isThirsty is true or false. If it is true, then console.log("I need water") will be executed; if it is false, then console.log("I don't need water") will be executed.