Hopefully, you realized from the last example, that if we can tell a Boolean variables to alternate its value between true
and false
, we could easily change the state of a sketch. We could use this changing state to alternate or flicker the color fill of the ellipse form the last page between red and blue.
There are two easy ways of alternating a Boolean variables state or value between true
and false
;
If we can check a variable’s Boolean state, we can change it to the opposite state. To do this, after checking it, we can re-assign the variable to false
in the true function block or true
in the false function block. In other words,
In code, this would like like;
1
2
3
4
5
6
7
8
9
10
11
12
var boolState = true;
function draw() {
// check the variable's Boolean state
if( boolState ) {
// if true, set to false
boolState = false;
} else {
// if false, set to true
boolState = true;
}
}
In the above code, we;
boolState
to be true
boolState
to false in line 7.boolState
to _true in line 10.draw()
loop, the state of boolState
will alternate between true and false.This is also demonstrated more fully in the below code. The following example builds on the previous, by using the value of boolState
to also change the value of a variable holding onto color values fillColor
, between 'red'
and 'blue'
. This is then passed to the fill()
function, which results in the alternating color of the ellipse. The value of the Boolean variable, boolState
, is also displayed as text.
[ Code Download ] | [ View on GitHub ] | [ Live Example ] |
Before we look at the second method for alternating Boolean state, we need to discuss another operator first.
The new operator is the Logical Not Operator. This new operator is similar to the Unary Negative Operator. The Unary Negative Operator flips the sign of a Number value. The Unary Negative Operator (-
) is proceeded by a Number or a variable holding a Number, (i.e. -10
or -num_var
).
A unary operator is called as such, because it only effects a single parameter or value. As opposed to a binary operator (i.e.
+
,-
,*
,/
,%
), where with a value on each side, the program tries to computer the arithmetic result of both numbers together.
// negative 10
-10
// store -22 in a variable.
var num_var = -22;
// the following returns +22
-num_var;
The Logical Not Operator is another unary operator, that is applied or used with a single Boolean value. This operator returns the opposite of the Boolean state. In other words, using this operator with a Boolean value of true, returns not true or false. Likewise, using this with a Boolean value of false return not false or true.
The Logical Not Operator is the exclamation mark (!
). As with the Unary Negative Operator, the Logical Not Operator is used by preceeding the value it is to act on.
!true // ⇒ would result in "not true" or false.
In the below code example, not true (!true
) is passed to the if statement. As a result the false function block is the one executed by the program.
[ Code Download ] | [ View on GitHub ] | [ Live Example ] |
In the following sketch, the value of !false
, is added to a string and printed. This further demonstrated that the use of the Logical Not Operator returns the opposite of a Boolean value state.
[ Code Download ] | [ View on GitHub ] | [ Live Example ] |
Following from everything just presented, we can use the Logical Not Operator to return the opposite of a Boolean values state. If the result of this is reassigned back to the same variable, the state of the Boolean variables value has been “flipped”. Let’s alter the above example that demonstrated how to flip the state of a Boolean variable value using if statements.
Now, instead of reassigning the value in an if statement, we will use the Logical Not Operator to return the opposite of the current state, and then reassign that to the same boolState
variable. This will occur at the top of the draw loop (line 21). Then we can reduce the number of extraneous lines in the if statement.
[ Code Download ] | [ View on GitHub ] | [ Live Example ] |