Conditional Code
Sometimes a block of code should only be run under certain conditions. Flow control — via if
and else
blocks — lets you run code if certain conditions have been met.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
|
While curly braces aren't strictly required around single-line if
statements, using them consistently, even when they aren't strictly required, makes for vastly more readable code.
Be mindful not to define functions with the same name multiple times within separate if/else blocks, as doing so may not have the expected result.
Truthy and Falsy Things
In order to use flow control successfully, it's important to understand which kinds of values are "truthy" and which kinds of values are "falsy." Sometimes, values that seem like they should evaluate one way actually evaluate another.
1
2
3
4
5
6
|
|
1
2
3
4
5
|
|
Conditional Variable Assignment with the Ternary Operator
Sometimes a variable should be set depending on some condition. An if
/else
statement works, but in many cases the ternary operator is more convenient. The ternary operator tests a condition; if the condition is true, it returns a certain value, otherwise it returns a different value.
The ternary operator:
1
2
3
|
|
While the ternary operator can be used without assigning the return value to a variable, this is generally discouraged.
Switch Statements
Rather than using a series of if
/else
blocks, sometimes it can be useful to use a switch
statement instead. Switch
statements look at the value of a variable or expression, and run different blocks of code depending on the value.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
|
Switch statements have somewhat fallen out of favor in JavaScript, because often the same behavior can be accomplished by creating an object that has more potential for reuse or testing. For example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
|
Objects are covered further in the Types and Objects sections.