Object Destructuring with Aliasing and Defaults
Destructuring allows extracting object properties into variables with custom names (aliasing) and default values if the property is missing.
Open snippet →Read these Intermediate JavaScript snippets line by line — each one comes with a written breakdown of what the code does and why.
Destructuring allows extracting object properties into variables with custom names (aliasing) and default values if the property is missing.
Open snippet →A closure is created when an inner function references variables from its outer scope, allowing for private data encapsulation.
Open snippet →Unlike Promise.all, Promise.allSettled waits for all promises to finish regardless of whether they fulfilled or rejected.
Open snippet →Optional chaining (?.) stops evaluation if the reference is nullish, while nullish coalescing (??) provides a default value only for null or undefined.
Chaining higher-order functions like filter and map allows for processing collections in a clean, readable, and declarative way.
Open snippet →The AbortController interface allows you to abort one or more Web requests as and when desired. This is essential for intermediate developers to handle component unmounting in frameworks or to prev…
Open snippet →Generators are functions that can be exited and later re-entered. Their context (variable bindings) will be saved across re-entrances. Using the '*' syntax and the 'yield' keyword, you can produce…
Open snippet →The Proxy object allows you to create a wrapper for another object, which can intercept and redefine fundamental operations for that object, such as property lookup, assignment, and enumeration. In…
Open snippet →WeakMap is a collection of key/value pairs in which the keys are objects and are weakly referenced. This is an intermediate pattern for creating truly private state in JavaScript classes before the…
Open snippet →Tagged templates allow you to parse template literals with a function. The first argument contains an array of string literals, and the subsequent arguments are the values of the substituted expres…
Open snippet →The Proxy object allows you to create a wrapper for another object, which can intercept and redefine fundamental operations for that object, such as property lookup, assignment, and enumeration.
Open snippet →By implementing the Symbol.iterator method, an object becomes 'iterable', allowing it to be used in for...of loops and with the spread operator. The method must return an object with a next() funct…
Open snippet →Currying is a pattern where a function with multiple arguments is transformed into a sequence of nesting functions, each taking a single argument. It is useful for partial application and creating…
Open snippet →The finally block always executes regardless of whether an error was thrown or a return statement was encountered in try/catch. Importantly, a return in finally will override any previous return va…
Open snippet →Tagged templates allow you to parse template literals with a function. The first argument is an array of string literals, and the remaining arguments are the evaluated expressions.
Open snippet →Private class fields (using the # prefix) ensure that internal data cannot be accessed or modified from outside the class instance, providing true encapsulation in JavaScript.
Open snippet →Memoization is an optimization technique where you store the results of expensive function calls and return the cached result when the same inputs occur again.
Open snippet →WeakMap allows you to associate data with an object without preventing that object from being garbage collected, making it ideal for managing private state or metadata.
Open snippet →Unlike Promise.all, Promise.allSettled waits for all promises to finish (either fulfilled or rejected), allowing you to handle partial successes in a batch of operations.
Open snippet →The nullish coalescing assignment operator (??=) only assigns a value if the variable is null or undefined, which is safer than using || for falsy values like 0 or empty strings.
Open snippet →Extending the built-in Error class allows you to create specialized error types for your application. This makes error handling more granular by allowing you to catch specific error types and attac…
Open snippet →Pipe composition is a functional pattern where the output of one function becomes the input of the next. It allows you to build complex logic by combining simple, reusable functions in a readable t…
Open snippet →Destructuring can extract nested properties and assign them to new variable names (aliasing) in a single step. You can also provide default values that are used if a property is missing or undefined.
Open snippet →The Set object is a collection of unique values. Using a Set for lookups is significantly faster than using an array (O(1) vs O(n) complexity) and it provides an elegant way to remove duplicates fr…
Open snippet →Maintaining immutability is crucial for predictable state management. Combining rest syntax to exclude properties and spread syntax to merge new ones allows you to derive new state without modifyin…
Open snippet →Object.seal() prevents new properties from being added and existing properties from being removed, but allows modification of existing property values. This is ideal for fixed configuration objects…
Open snippet →The reduce method is a versatile tool for transforming an array into a single object. By initializing with an empty object, we can iterate through the list and dynamically build a categorized map o…
Open snippet →Closures allow a function to 'remember' the environment in which it was created. Here, the variable 'count' is inaccessible from the outside world, providing a pattern for private state without cla…
Open snippet →Promise.race() returns a promise that settles as soon as any of the input promises settles (either resolves or rejects). This is commonly used to implement timeouts for network requests or long-run…
Open snippet →The 'cause' property in the Error constructor allows you to wrap an original error inside a new one. This preserves the stack trace and context of the root cause while allowing for higher-level err…
Open snippet →