You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Sometimes you only want to run a block of code under certain conditions. Flow control — via if and else blocks — lets you run code only under certain conditions.
8
8
9
9
<javascriptcaption="Flow control">
10
-
var foo = true;
11
-
var bar = false;
12
-
13
-
if (bar) {
14
-
// this code will never run
15
-
console.log('hello!');
16
-
}
17
-
18
-
if (bar) {
19
-
// this code won't run
10
+
var foo = true;
11
+
var bar = false;
12
+
13
+
if (bar) {
14
+
// this code will never run
15
+
console.log('hello!');
16
+
}
17
+
18
+
if (bar) {
19
+
// this code won't run
20
+
} else {
21
+
if (foo) {
22
+
// this code will run
20
23
} else {
21
-
if (foo) {
22
-
// this code will run
23
-
} else {
24
-
// this code would run if foo and bar were both false
25
-
}
24
+
// this code would run if foo and bar were both false
26
25
}
26
+
}
27
27
</javascript>
28
28
29
29
<divclass="note"markdown="1">
@@ -42,18 +42,18 @@ kinds of values are "truthy" and which kinds of values are "falsy." Sometimes,
42
42
values that seem like they should evaluate one way actually evaluate another.
43
43
44
44
<javascriptcaption="Values that evaluate to true">
45
-
'0';
46
-
'any string';
47
-
[]; // an empty array
48
-
{}; // an empty object
49
-
1; // any non-zero number
45
+
'0';
46
+
'any string';
47
+
[]; // an empty array
48
+
{}; // an empty object
49
+
1; // any non-zero number
50
50
</javascript>
51
51
52
52
<javascriptcaption="Values that evaluate to false">
53
-
''; // an empty string
54
-
NaN; // JavaScript's "not-a-number" variable
55
-
null;
56
-
undefined; // be careful -- undefined can be redefined!
53
+
''; // an empty string
54
+
NaN; // JavaScript's "not-a-number" variable
55
+
null;
56
+
undefined; // be careful -- undefined can be redefined!
57
57
</javascript>
58
58
59
59
## Conditional Variable Assignment with The Ternary Operator
@@ -65,9 +65,9 @@ condition is true, it returns a certain value, otherwise it returns a different
65
65
value.
66
66
67
67
<javascriptcaption="The ternary operator">
68
-
// set foo to 1 if bar is true;
69
-
// otherwise, set foo to 0
70
-
var foo = bar ? 1 : 0;
68
+
// set foo to 1 if bar is true;
69
+
// otherwise, set foo to 0
70
+
var foo = bar ? 1 : 0;
71
71
</javascript>
72
72
73
73
While the ternary operator can be used without assigning the return value to a
@@ -81,48 +81,47 @@ at the value of a variable or expression, and run different blocks of code
81
81
depending on the value.
82
82
83
83
<javascriptcaption="A switch statement">
84
-
switch (foo) {
84
+
switch (foo) {
85
85
86
-
case 'bar':
87
-
alert('the value was bar -- yay!');
88
-
break;
86
+
case 'bar':
87
+
alert('the value was bar -- yay!');
88
+
break;
89
89
90
-
case 'baz':
91
-
alert('boo baz :(');
92
-
break;
90
+
case 'baz':
91
+
alert('boo baz :(');
92
+
break;
93
93
94
-
default:
95
-
alert('everything else is just ok');
96
-
break;
94
+
default:
95
+
alert('everything else is just ok');
96
+
break;
97
97
98
-
}
98
+
}
99
99
</javascript>
100
100
101
101
Switch statements have somewhat fallen out of favor in JavaScript, because
102
102
often the same behavior can be accomplished by creating an object that has more
103
103
potential for reuse, testing, etc. For example:
104
104
105
105
<javascript>
106
+
var stuffToDo = {
107
+
'bar' : function() {
108
+
alert('the value was bar -- yay!');
109
+
},
106
110
107
-
var stuffToDo = {
108
-
'bar' : function() {
109
-
alert('the value was bar -- yay!');
110
-
},
111
+
'baz' : function() {
112
+
alert('boo baz :(');
113
+
},
111
114
112
-
'baz' : function() {
113
-
alert('boo baz :(');
114
-
},
115
-
116
-
'default' : function() {
117
-
alert('everything else is just ok');
118
-
}
119
-
};
120
-
121
-
if (stuffToDo[foo]) {
122
-
stuffToDo[foo]();
123
-
} else {
124
-
stuffToDo['default']();
115
+
'default' : function() {
116
+
alert('everything else is just ok');
125
117
}
118
+
};
119
+
120
+
if (stuffToDo[foo]) {
121
+
stuffToDo[foo]();
122
+
} else {
123
+
stuffToDo['default']();
124
+
}
126
125
</javascript>
127
126
128
127
We'll look at objects in greater depth later in this chapter.
0 commit comments