Deep JavaScript Foundations, v3
Learning Paths:
Table of Contents
Introduction
Introduction
Kyle Simpson introduces the course and makes a case for why it matters to think deeply about JavaScript.
Understanding Your Code
Kyle describes how incorrect assumptions about how code is working causes bugs.
Course Overview
Kyle breaks down JavaScript into three main pillars which will be covered during the course.
Types
Primitive Types
Kyle digs into JavaScript's type system and debunks the myth that everything in JavaScript is an object.
typeof Operator
Kyle discusses the behavior of the typeof operator and focuses on cases that typically cause confusion.
BigInt
Kyle explains how BigInt differs from other numbers in JavaScript.
Kinds of Emptiness
Kyle dissects the various ways something can be empty in JavaScript: undefined, undeclared, and uninitialized.
NaN & isNaN
Kyle discusses what a NaN, how to use isNaN, and common sources of error in the usage of both.
Negative Zero
Kyle gives the context of -0 in JavaScript and explains how operations on it can cause unexpected results.
Type Check Exercise
Students are instructed to define a new function that implements what was learned in the previous section.
Type Check Exercise Solution
Kyle live codes the solution to the exercise.
Fundamental Objects
Kyle defines fundamental objects in JavaScript and foreshadows why it is wise to use them selectively.
Coercion
Abstract Operations
Kyle introduces the operations JavaScript uses under the hood to perform coercion, starting with toPrimitive.
toString
Kyle discusses the behavior of the abstract operation toString.
toNumber
Kyle discusses the behavior of the abstract operation toNumber.
toBoolean
Kyle discusses the behavior of the abstract operation toBoolean.
Cases of Coercion
Kyle walks through typical situations where number to string, string to number, and any type to boolean coercions occur.
Boxing
Kyle introduces boxing and gives an example.
Corner Cases of Coercion
Kyle makes a case for learning situations where coercion causes unexpected results.
Philosophy of Coercion
Intentional Coercion
Kyle explains how to use coercion successfully by having a coding style that makes types obvious.
Culture of Learning
Kyle advocates for a culture where less experienced developers are encouraged to learn correct practices.
Code Communication Q&A
Kyle discusses code comments and the role of notation standards like JSDoc in code communication.
Implicit Coercion
Kyle advocates for code that is clear in its usage of types, which allows for the use of implicit coercion.
Understanding Features
Kyle argues it is a better approach to seek understanding of JavaScript features than to avoid them.
Coercion Exercise
Students are instructed to define two validation functions.
Coercion Exercise Solution
Kyle live codes the solution to the exercise.
Equality
Double & Triple Equals
Kyle compares the behavior of double equals and triple equals, which are often mistakenly defined.
Coercive Equality
Kyle discusses the choice to use double equals or triple equals and how linters can both help and hurt code.
Double Equals Algorithm
Kyle analyzes the spec on coercive equality to understand completely each step of the double equals comparison.
Double Equals Walkthrough
Kyle walks through a few lines of code that utilize the double equals for coercive equality.
Double Equals Summary
Kyle gives a summary of what double equals does when it is used in a program.
Double Equals Corner Cases
Kyle uses a code example to make the argument that famous corner cases are often pulled from situations unlikely to occur.
Corner Cases: Booleans
Kyle demonstrates what happens when an empty array is coerced into a boolean in multiple situations.
Corner Cases: Summary
Kyle offers advice on using double equals for coercive equality comparisons.
The Case for Double Equals
Kyle makes the case that double equals is preferable to triple equals, which can be used as a sign that types are unknown.
Equality Exercise
Kyle introduces the exercise on equality, which is to handle corner cases in equality comparison.
Equality Exercise Solution
Kyle codes the solution to the exercise.
Static Typing
TypeScript & Flow
Kyle discusses the benefits and drawbacks of using tools like TypeScript and Flow for type checking.
Inferencing
Kyle defines what inferencing is in static typing.
Custom Types
Kyle defines what custom types are and explains how they can help to reduce type misassignments.
Validating Operand Types
Kyle makes the assertion that the validation of operand types is a useful aspect of static typing.
TypeScript & Flow Summary
After mentioning an article on TypeScript compared with Flow, Kyle summarizes his thoughts on these two tools.
Static Typing Pros
Kyle discusses benefits of static typing.
Static Typing Cons
Kyle discusses the drawbacks of static typing.
Understanding Your Types
Kyle encourages students to understand JavaScript's type system sufficiently to use coercion with confidence.
Scope
Scope
Kyle introduces the section of the course on scope.
Compilation & Scope
Kyle walks through compilation of code using a silly exercise to illustrate a mental model for scope.
Executing Code
Kyle walks through execution of code using the exercise from the previous lesson.
Compilation and Scope Q&A
Kyle answers questions about the stages of compilation and execution.
Code Execution: Finishing Up
Kyle finishes walking through the execution of code, differentiating between two types of lookups.
Lexical Scope Review
The lexical scope stage of the two stage mental model is reviewed.
Compilation Review
The compilation stage of the two stage mental model is reviewed.
Dynamic Global Variables
Kyle demonstrates what dynamic global variables are and in what situations they are created.
Strict Mode
Kyle gives various arguments for the usage of strict mode.
Nested Scope
Kyle walks through an example of nested scope.
Undefined vs Undeclared
Kyle reviews the difference between a variable that is undefined versus one that is undeclared.
Lexical Scope Elevator
Kyle introduces a metaphor for lexical scope.
Scope & Function Expressions
Function Expressions
Kyle defines and analyzes function expressions in relation to scope.
Naming Function Expressions
Kyle gives three reasons why named function expressions are superior to anonymous function expressions.
Arrow Functions
Kyle breaks down the reasons why people use arrow functions and brings to light a few of their drawbacks.
Function Types Hierarchy
Kyle presents a hierarchy of function types and explains each level based on information from previous lessons.
Function Expression Exercise
Students are instructed to write a set of comparable functions and function expressions.
Function Expression Solution: Functions
Kyle live codes the first part of the solution using function declarations.
Function Expression Solution: Arrow Functions
Kyle live codes the second part of the solution using arrow functions.
Advanced Scope
Lexical & Dynamic Scope
Kyle contrasts the models of lexical scoping versus dynamic scoping and gives examples of each.
Lexical Scope
Kyle breaks down ways to thinking about lexical scope using the bucket model from previous lessons, a new technique, and a type highlighting tool.
Dynamic Scope
Kyle demonstrates how dynamic scope works using a theoretical code example.
Function Scoping
Kyle presents arguments in support of the core principle of strategically hiding information in levels of scope.
IIFE Pattern
Kyle introduces the benefits of using the IIFE pattern.
Block Scoping
Kyle differentiates between situations where it is and is not useful to create block scoping.
Choosing let or var
Kyle analyzes the choice of whether to choose let or var in the contexts of performance and code communication.
Explicit let Block
Kyle presents a use case for an explicit let block.
const
Kyle illustrates the potential semantic issues of using const.
const Q&A
Kyle identifies situations where const can be useful.
Hoisting
Kyle debunks myths surrounding the concept of hoisting and clarifies what is actually happening under the hood.
Hoisting Example
Kyle walks through code examples that utilize hoisting with functions and variables.
let Doesn't Hoist
Kyle uses a code example to disprove the common saying "let doesn't hoist".
Hoisting Exercise
Students are instructed to refactor existing code to take advantage of hoisting.
Hoisting Exercise Solution
Kyle live codes the solution to the exercise.
Closure
Origin of Closure
Kyle discusses the context of closure in JavaScript in relation to functional programming languages.
What is Closure?
Kyle defines what it means to close over variables and indicates where in a function it is occuring.
Closing Over Variables
Kyle distinguishes between what it means to close over a variable instead of a value through code examples.
Module Pattern
Kyle introduces the module pattern by explaining how data encapsulation involves closure.
ES6 Modules & Node.js
Kyle discusses incompatibility issues with the ES6 module system and Node.js.
ES6 Module Syntax
Kyle outlines the two styles of importing ES6 modules.
Module Exercise
Students are instructed to refactor existing code to use the module pattern.
Module Exercise Solution
Kyle live codes the solution to the exercise.
Objects
Objects Overview
Kyle introduces the section of the course on objects.
The this Keyword
Kyle explains through a code example how the this keyword allows for dynamic flexible reusability in JavaScript.
Implicit & Explicit Binding
Kyle differentiates implicit binding from explicit binding by giving several examples of each.
The new Keyword
Kyle highlights the four-part result of invoking a function with the new keyword.
Default Binding
Kyle explores the results of invoking a function with the default binding in non-strict mode and strict mode.
Binding Precedence
Kyle uses a code example to delve into the order of operations of which binding rule takes precedence.
Arrow Functions & Lexical this
Kyle analyzes how the this keyword behaves in arrow functions.
Resolving this in Arrow Functions
Kyle clarifies misconceptions about how the this keyword is resolved within arrow functions.
this Exercise
Students are instructed to refactor existing code to use the namespace pattern.
this Exercise Solution
Kyle live codes the solution to the exercise.
ES6 class Keyword
Kyle explains what a class is and outlines a few of its capabilities.
Fixing this in Classes
Kyle walks through a temporary fix method for this keyword behavior in the context of classes.
class Exercise
Students are instructed to refactor existing code to use the class pattern.
class Exercise Solution
Kyle live codes the solution to the exercise.
Prototypes
Prototypes
Kyle introduces the section of the course on prototypes by discussing mental models.
Prototypal Class
Kyle presents a code example of a class system written using prototype to highlight data relationships.
The Prototype Chain
Kyle constructs a diagram of the relationships within JavaScript's prototype system.
Dunder Prototypes
Kyle defines dunder prototypes and gives their use cases.
this & prototypes Q&A
Kyle discusses binding, arrow function scope, setting dunder proto, and super.
Shadowing Prototypes
Kyle walks through an example of shadowing within the prototypes system.
Prototypal Inheritance
Kyle explains how to link prototypes to each other to take advantage of inheritance.
Classical vs Prototypal Inheritance
Kyle clarifies the difference between classical and prototypal inheritance in terms of copying or linking relationships.
Inheritance is Delegation
Kyle comes to a conclusion about the design of JavaScript's inheritance system and elaborates on its strengths.
OLOO Pattern
Kyle demonstrates how to implement a new design pattern involving linked objects.
Delegation-Oriented Design
Kyle argues for code designed with linked objects in mind.
