Advanced JavaScript Topics

Research JavaScript libraries and frameworks to speed project work while maintaining mastery of pure JavaScript. Use javascripting.com and GitHub to evaluate options and learn how React and others fit in.

Explore how functions are objects by comparing declarations, expressions, and constructors, showing hoisting differences, properties, new keyword usage, and reference behavior with this keyword and added methods.

Discover how JavaScript treats first class functions as values, enabling assignment to variables and passing by reference. See a run function executing sum and an anonymous function that multiplies them.

Learn four ways to invoke JavaScript functions—as a function, as a method, as a constructor with new, or with call and apply—and how this and arguments affect context.

Create JavaScript objects using the object literal or the constructor with new, define properties and methods, access them with the dot operator, and manage properties with delete, in, and hasOwnProperty.

Examine how normal function invocation binds this to the global object, with this.name showing the global variable, and demonstrate this behavior using first-class functions, return values, and function passing.

In normal function invocation under strict mode, this binds to undefined rather than the global object, causing errors like cannot read property name of undefined.

Examine how this binds at runtime based on how a function is invoked, not where it is defined, using object literals and dot notation.

Explore how function prototypes define shared properties, how the prototype links to a function, and how apply, bind, and call explicitly bind this during execution.

Learn how call and apply bind this to different objects to invoke functions as if they were methods, and compare passing arguments directly versus as an array.

Explore how the new keyword turns a function into a constructor, creating new objects with shared prototypes and explaining this binding and instance relationships.

Explore how arrow functions offer minimal syntax and lexical this to solve this-binding issues in callbacks, with practical examples of syntax, parameters, and implicit returns.

Review how invoking functions in JavaScript determines this: regular calls, methods, constructors, and indirect binding with call, apply, bind, arrow functions, including global object, undefined, and strict mode.

Apply dry coding and abstraction to avoid repetition and refactor for clarity. Create single-purpose functions like sum and find multiple to improve reuse and flexibility.

Explore abstraction and dry coding by building a reusable execute wait function that throttles mousemove events with higher-order functions, a debounce function, apply, and set timeout.

This lesson demonstrates event bubbling by attaching a double-click listener to a ul to manage its li children, filtering text nodes and coloring elements green with a while loop.

Detect properties on an object using in to check prototype chain and hasOwnProperty for own properties. Iterate with for-in and access values via bracket notation; use Object.keys to list names.

Learn how to control object properties in JavaScript by using defineProperty to set enumerable and configurable attributes, hide properties from loops, and manage deletion.

Explore how to enforce immutability in JavaScript by using the writable attribute for properties, sealing objects to prevent adding or deleting properties, and freezing to lock all changes.

Explore ES6 object features, including concise properties and methods, and static helpers like Object.setPrototypeOf and Object.assign, with practical examples of prototypes and object composition.

Explore method chaining in JavaScript, returning this to chain string and array methods (replace, toUpperCase, trim, concat, sort, join) and object methods (add score, do total, do average).

Explore the power of functions by introducing immediately invoked function expressions and closures, two key concepts used by advanced JavaScript programmers.

Explore immediately invoked function expressions (IIFEs), compare function declarations and expressions, learn how parentheses invoke them, and see why frameworks rely on IIFEs for encapsulation.

Avoid global variables by using closure and immediately invoked function expressions to manage scope and prevent collisions and namespace pollution.

Explore the namespace pattern to reduce global variables and avoid collisions by using a single global object (my app) with an iffy and closure, exposing greeting and add user.

Explore the module pattern as a way to organize JavaScript into discrete modules, using closures and immediately invoked function expressions, linking to the namespace pattern and Node.js module usage.

Explore implementing a modular fill-in question quiz in JavaScript, using the module pattern, DOM utilities, data attributes, and feedback logic to validate primitive data types.

Explore structuring a JavaScript module pattern across multiple files, creating main app and util on the global namespace, and wiring four files for cohesive, modular functionality.

assemble the module pattern from multiple files, create submodules for dom utilities and string utilities under util, and use dependencies and import globals to connect code across main.js.

Create a JSON file to store quiz data separately, enabling translation and easier data management, and learn how to structure JSON with quotes, fields, and an array of questions.

Learn to load a local json file via the xml http request object, creating the xhr, opening with get, handling ready state, and parsing response text as json.