What follows is my breakdown of Chapter 1: Values, Types, and Operators from Eloquent JavaScript: A Modern Introduction to Programming, written by Marijn Haverbeke.
JavaScript Values
- JavaScript values are just like bash variables.
4 Different Value Types to Consider When Getting Started with JavaScript
- Numbers
- Strings
- Booleans
- Undefined
Numbers
- Any number can be used as a value.
- 64 bits max, or 2**64 (18 quintillion) numbers.
- There are really only 9 quintillion possible numbers due to decimal places going to 15 places max.
- Scientific notation:
2.998e8 = 2.988 x 10^8 = 299,800,000
- Arithmetic:
(100 + 4) * 11
- Operators include:
/
divide,*
multiply,+
add, and-
subtract. %
is used to give remainders:314 % 100
returns14
144 % 12
returns0
Infinity
and-Infinity
are numbers.NaN
= Not a Number0 / 0
returnsNaN
Infinity - Infinity
returnsNaN
Strings
- Text strings are a type of value.
"Patch my boat with chewing gum"
is a string.'Monkeys wave goodbye'
is also a string.- Line breaks use the
\n
character:"This is the first line\nAnd this is the second"
- returns:
This is the first line
- returns:
And this is the second
- The escape character is
\
.console.log("A newline character is written like \"\\n\".")
- returns:
A newline character is written like "\n".
- Use
+
to concatenate strings:"con" + "cat" + "e" + "nate"
- returns:
concatenate
"comb" + "in" + "a" + "tion"
- returns:
combination
Unary Operators
- These are written word operators.
typeof
names the type of value for the given string.console.log(typeof 4.5)
- returns:
// ► number
console.log(typeof "x")
- returns:
// ► string
Binary Operators
- Binary operators take two values.
- E.g.,
+
to concatenate is binary. - Unary operators take only one value (e.g.,
typeof
).
Booleans
- Examples of Boolean values are: On/Off; True/False; Yes/No; and OK/Cancel.
console.log(3 > 2)
... Asks: "Is 3 greater than 2?"- returns:
// ► true
... Yes, it is. console.log(3 < 2)
- returns:
// ► false
console.log("Aardvark" < "Zoroaster")
... This compares the lengths of the two strings.- returns:
// ► true
... 'Aardvark' is shorter than 'Zoroaster'. console.log("Itchy" != "Scratchy")
... Asks: "Is 'Itchy' not equal to 'Scratchy' in length?"- returns:
// ► true
... Yes, it is true that it is not equal. console.log(NaN == NaN)
... Asks: "Is thisNaN
the same as thatNaN
?"- returns:
// ► false
...NaN
is not a real number. There is nothing to compare.
Logical Operators
&&
and: If both are true, returntrue
.||
or: If one or both are true, returntrue
.!
not: Negates whatever follows.console.log(true && false)
- returns:
// ► false
console.log(true && true)
- returns:
// ► true
console.log(false || true)
- returns:
// ► true
console.log(false || false)
- returns:
// ► false
console.log(!true)
- returns:
// ► false
Precedence
- Precedence determines the Order of Operations for a given line of JavaScript which contains multiple operators:
||
is the lowest in precedence; it is computed last.&&
is next.- The comparisons
== != === !== < > <= >=
are next. - The remaining operations follow; they are computed first and are highest in precedence.
console.log(1 + 1 == 2 && 10 * 10 > 50)
- returns:
// ► true
- Consider that
2 == 2 && 100 > 50
becomestrue == true
, which, again, equates totrue
.
- Consider that
Ternary Operators
- Ternary Operators, also known as Conditional Operators, use three values each.
- The left-most (first) value determines which one of the remaining two values will be returned.
- Example formula:
VALUE1 ? VALUE2 : VALUE3
- If
VALUE1
istrue
thenVALUE2
is returned. - If
VALUE1
isfalse
thenVALUE3
is returned.
- Example formula:
console.log(true ? 1 : 2);
- returns:
// ► 1
console.log(false ? 1 : 2);
- returns:
// ► 2
Undefined Values
- The
null
andundefined
values carry no meaningful information. - For many practical purposes they are identical.
- They denote the absence of any meaningful value.
Automatic Type Conversion
- Be aware: JavaScript will try to accept any program given to it, even very odd programs:
console.log(8 * null)
- returns:
// ► 0
console.log("5" - 1)
- returns:
// ► 4
console.log("5" + 1)
- returns:
// ► 51
console.log("five" * 2)
- returns:
// ► NaN
console.log(false == 0)
- returns:
// ► true
- The heuristics for type conversion vary; e.g., string concatenation will be attempted before addition if both are present.
- The computation of the comparison operator
==
changes when given values of two different types. First, JavaScript will try to convert one value type to the other's type.null1 == null2
returnstrue
.null1 == realvalue2
returnsfalse
.
console.log(null == undefined);
- returns:
// ► true
console.log(null == 0);
- returns:
// ► false
null
can be used with==
to test other values and determine whether they have real or null value.0
,NaN
, and""
are interpreted as false in Boolean calculations.console.log("" == false);
- returns:
// ► true
===
is used to determine if A is precisely equal to B.!==
is used to determine if A is not precisely equal to B.console.log("" === false);
- returns:
// ► false
Short-Circuiting of Logical Operators
- If
VALUE1
in an||
/or
statement istrue
, onlyVALUE1
is evaluated before returningtrue
. - If
VALUE1
in an||
/or
statement isfalse
butVALUE2
istrue
, JavaScript will evaluate both before returningtrue
. console.log(null || "user")
- returns:
// ► user
... Becausenull
is automatically interpreted asfalse
. console.log("Karl" || "user")
- returns:
// ► Karl
... If both are real values; return the first without evaluating the second. - If
VALUE1
in an&&
/and
statement isfalse
, onlyVALUE1
is evaluated before returningfalse
. console.log(true || X)
- returns:
// ► true
... OnlyVALUE1
is evaluated. console.log(false && X)
- returns:
// ► false
... Again, onlyVALUE1
is evaluated. - 'Short-Circuit Evaluation' can be used for testing.
- Conditional/Ternary Operators can also do short-circuit evaluation.
- In Conditional/Ternary Short-Circuit Evaluation,
VALUE1
is always evaluated, followed by eitherVALUE2
orVALUE3
, but not both.
NOTE: Any of these operations and code snippets can be tested in Eloquent JavaScript's Code Sandbox. You can also read the book online for free. And don't forget to support the author by buying a paperback copy if you like it or if, like me, you just prefer physically having the book.