Note: Eloquent JavaScript was recommended to me by Leon from #100Devs. While I’ve been participating in a JavaScript study using The Modern JavaScript Tutorial, I had an itch to also read Eloquent JavaScript as a refresher.
Eloquent JavaScript TIL - Chapters 4 and 5.
Chapter 4 - Data Structures
[]
brackets can be used to access the n-th index of an array, as well as a property of an object (note: if you are putting the name of the property into the[]
, you have to wrap the property name with quotes).- If you omit the quotes around the square bracket property name, this name is evaluated to get the property name. Therefore, (
myUser[name]
andmyUser['name']
are not the same). - Object properties can be accessed using dot notation as well (
Math.max
). You can’t use the dot notation with numbers (need bracket notation). null
andundefined
do not have properties- Accessing an object’s non-existent property results in
undefined
Mutability
- Primitive values such as strings, numbers, and Booleans are all immutable - you cannot change values of those types; they cannot be altered. The variable bound to a primitive value can be reassigned to a new value, but the existing value itself (e.g. the number 120, or string ‘hello’) cannot be changed in ways like mutable data structures can.
- Variables with objects stored aren’t actually storing the object, but rather their reference value (e.g. kind of like a street address).
- Two different variables could hold the same reference value for the identical object, so if you
- You can still add properties to
const obj = {}
even when you created the object usingconst
keyword because the reference value pointing to the object remains the same even if you add properties.
Array loops
- Instead of using the classic
for
loop you can also usefor ... of
to loop through arrays (as well as strings - any iterable structure).
Array and String methods
Array.slice()
creates a new array, whereasArray.splice()
methods the array in place.String.trim()
removes whitespace (including spaces, newlines, tabs from the start and end of a string)String.padStart(desired length, padding character)
checks whether a given string is equivalent todesired length
parameter and if not pads more characters usingpadding character
.
Rest parameter vs. Spread operator ...
- I always get these confused because they use the same three dot notation.
- Rest parameter - when you set a parameter during function declaration/definition to have
...
with a variable name, this is the rest parameter. You are putting all the parameters together into an array. - Spread operator - used when passing an argument during a function call. This spreads the elements of an array into each element.
- You can use spread operator to spread another array or object into a new array/object.
Chapter 5 - Higher-order Functions
- Abstraction: hides the details (the “how”) of the program and focuses more on only revealing the “what”.
- Higher-order functions: functions that operate on other functions by either a) taking them as arguments, or b) returning functions
- Higher-order functions can take another function as its argument and modify its behavior (wrapper)
Array.reduce(array, combine, start)
- you can leave off thestart
parameter if the array you’re passing has at least one element.