Basics

If...else

1
if (condition) {
2
code to run if condition is true;
3
} else if (condition 2) {
4
code to run if condition is true;
5
} else {
6
run some other code instead;
7
}
8
​
9
# Ternary operator - https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals#ternary_operator
10
( condition ) ? run this code : run this code instead
11
let greeting = ( isBirthday ) ? 'Happy birthday Mrs. Smith β€” we hope you have a great day!' : 'Good morning Mrs. Smith.';
Copied!

Switch

1
# Source: https://www.digitalocean.com/community/tutorials/how-to-use-the-switch-statement-in-javascript
2
​
3
# Example 1
4
​
5
switch (expression) {
6
case x:
7
// execute case x code block
8
break;
9
case y:
10
// execute case y code block
11
break;
12
default:
13
// execute default code block
14
}
15
​
16
# Example 2
17
// Set the student's grade
18
const grade = 87;
19
​
20
switch (true) {
21
// If score is 90 or greater
22
case grade >= 90:
23
console.log("A");
24
break;
25
// If score is 80 or greater
26
case grade >= 80:
27
console.log("B");
28
break;
29
// If score is 70 or greater
30
case grade >= 70:
31
console.log("C");
32
break;
33
// If score is 60 or greater
34
case grade >= 60:
35
console.log("D");
36
break;
37
// Anything 59 or below is failing
38
default:
39
console.log("F");
40
}
Copied!

Function

1
// Multiplication function
2
function multiply(n1, n2) {
3
return n1 * n2;
4
}
5
​
6
# Examples
7
<script>
8
9
function add7(n) {
10
return n + 7;
11
}
12
​
13
function multiply(n1, n2) {
14
return parseInt(n1) * parseInt(n2);
15
}
16
​
17
function capitalize(string) {
18
let result = string.toLowerCase();
19
return result.charAt(0).toUpperCase() + result.slice(1);
20
}
21
​
22
function lastLetter(string) {
23
return string.slice(-1);
24
}
25
26
</script>
Copied!

Arrow function

1
// Example 1
2
let func = (arg1, arg2, ..., argN) => expression;
3
​
4
let func = function(arg1, arg2, ..., argN) {
5
return expression;
6
};
7
​
8
# Example 2
9
let sum = (a, b) => a + b;
10
​
11
# Example 3
12
let sayHi = () => alert("Hello!");
13
​
14
sayHi();
15
​
16
# Example 4
17
let age = prompt("What is your age?", 18);
18
​
19
let welcome = (age < 18) ?
20
() => alert('Hello') :
21
() => alert("Greetings!");
22
​
23
welcome();
24
​
25
# Source: https://javascript.info/arrow-functions-basics
26
​
27
// method 1
28
<button onclick="alert('Hello World')">Click Me</button>
29
​
30
// method 2
31
<!-- the HTML file -->
32
<button id="btn">Click Me</button>
33
// the JavaScript file
34
const btn = document.querySelector('#btn');
35
btn.onclick = () => alert("Hello World");
36
​
37
// method 3
38
<!-- the HTML file -->
39
<button id="btn">Click Me Too</button>
40
// the JavaScript file
41
const btn = document.querySelector('#btn');
42
btn.addEventListener('click', () => {
43
alert("Hello World");
44
});
45
Source: https://www.theodinproject.com/paths/foundations/courses/foundations/lessons/dom-manipulation-and-events#events
Copied!

Loops

1
// for...of
2
for (const item of array) {
3
// code to run
4
}
5
​
6
// for
7
for (initializer; condition; final-expression) {
8
// code to run
9
}
10
​
11
// while
12
initializer
13
while (condition) {
14
// code to run
15
​
16
final-expression
17
}
18
​
19
// do...while
20
initializer
21
do {
22
// code to run
23
​
24
final-expression
25
} while (condition)
26
​
27
Source: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Looping_code#which_loop_type_should_you_use
Copied!

While Loop

1
let i = 10;
2
while (i > 0) {
3
console.log(i);
4
i--;
5
}
Copied!

Do..While Loop

1
let i = 0;
2
do {
3
console.log(i);
4
i++;
5
}
6
while (i < 3)
Copied!

For Loop

1
for (let i = 0; i < 3; i++) {
2
console.log(i);
3
}
Copied!