Booleans

Lesson material made by Jason. Can be found on GitHub.

A beginner lesson companion for yes/no questions, boolean values, comparison operators, and expressions that evaluate to true or false.

Today we focus on:
  • true and false
  • Boolean expressions
  • Comparison operators

Boolean

A data type with only two possible values: true or false.

Boolean Expression

An expression that evaluates to a boolean value.

Comparison Operator

A symbol that compares values and returns a logical result.

1

Yes/No Questions

A series of yes/no questions can help us make decisions.

Example

Guess the object:

Is it electronic? true

Is it on the ceiling? false

Code

var isAnElectronic = true
var isOnTheCeiling = false

Notes

  • Booleans model yes/no questions.
  • true means yes.
  • false means no.
2

Boolean Values

A boolean is like a switch: either on or off.

Example

true / on
false / off

Code

var isInThisRoom = true
var hasButtons = true
var isOnTheCeiling = false

Notes

  • Do not put quotes around booleans.
  • true is a boolean.
  • "true" is a string.
3

Comparison Operators

Comparison operators compare operands and return booleans.

Example

17 > 3 true

25 < 12 false

7 == 7 true

Code

console.log(17 > 3)
console.log(25 < 12)
console.log(7 == 7)

Notes

  • == checks equality.
  • < checks less than.
  • > checks greater than.
4

Equality vs Strict Equality

== may cast values. === checks value and type.

Example

1 == "1" true

1 === "1" false

1 === 1 true

Code

console.log(1 == "1")
console.log(1 === "1")
console.log(1 === 1)

Notes

  • == tries to cast values to the same type.
  • === is strict equality.
  • For beginners, prefer === when checking equality.
5

Inequality

Inequality asks whether two values are not equal.

Example

1 != 1 false

1 != 2 true

1 !== "1" true

Code

console.log(1 != 1)
console.log(1 != 2)
console.log(1 !== "1")

Notes

  • != means not equal.
  • !== means not strictly equal.
  • !== is the opposite of ===.
6

Less Than And Greater Than

Use these operators to compare size or amount.

Example

1 < 2 true

1 <= 1 true

2 >= 3 false

Code

console.log(1 < 2)
console.log(1 <= 1)
console.log(2 >= 3)

Notes

  • <= means less than or equal to.
  • >= means greater than or equal to.
  • If both sides are equal, <= and >= can be true.
7

Bank Balance Comparisons

Comparison operators become useful when values change over time.

Example

Alice === Bob: true. Alice > Bob: false.

Code

var aliceBankBalance = 500
var bobBankBalance = 500

aliceBankBalance += 200
bobBankBalance += 300
aliceBankBalance -= 300
bobBankBalance -= 400

console.log(aliceBankBalance === bobBankBalance)
console.log(aliceBankBalance > bobBankBalance)

Notes

  • += adds to a variable.
  • -= subtracts from a variable.
  • The boolean result changes when the balances change.
8

Mini Playground: Compare Two Values

Choose an operator and see the boolean result.

Example

1 === 1 is true.

Code

var result = leftValue === rightValue
console.log(result)

Notes

  • Every comparison returns true or false.
  • Try 1 == "1" and 1 === "1".
  • This is why strict equality matters.

Slide Coverage Map

Slides 1-6: title, yes/no game, boolean values, and switch analogy are covered in sections 1 and 2.
Slides 7-14: simple questions, comparison expressions, equality, and strict equality are covered in sections 3 and 4.
Slides 15-24: inequality, strict inequality, less/greater comparisons, and the operator table are covered in sections 5 and 6.
Slides 25-32: Alice and Bob balance changes are covered in the interactive bank demo.
Slides 33-37: summary, questions, and practice are covered by the final notes and playground.