Top 18 New Things in JS - Part 2

Episode Summary

Executive Summary: Syntax’s second half of its JS “new things” roundup covers ES6+ features that changed everyday JavaScript: spread/rest, arrow functions, default args, named params, modules, dynamic imports, classes, async patterns, generators, for-of, maps/sets, and practical ecosystem updates like React and Create React App 2. The hosts emphasize readability, immutability, code splitting, and how these features improve large-scale app development, especially in React and modern build tools.

Main Topics: Spread and rest syntax: Explains how spread expands iterables/objects into function calls or new arrays/objects, while rest collects remaining values in functions and destructuring. Strong emphasis on immutability and object/array copying. Arrow functions and default arguments: Covers arrow function syntax, implicit returns, lexical this, and readability tradeoffs; also explains default parameters and the important distinction between undefined and other falsy values. Named parameters, modules, and exports: Discusses passing a single object to functions for clearer, less brittle APIs, plus ES6 modules, default vs named exports, re-export patterns, and the benefits of explicit dependencies. Dynamic imports and code splitting: Highlights importing code on demand for performance, bundler support, and how this reduces initial payloads in large apps and e-commerce flows. Classes and class properties: Reviews ES6 classes as a cleaner way to organize behavior/state, inheritance, and React-friendly class properties to avoid manual binding in constructors. Async patterns, generators, for-of, maps and sets: Touches on lesser-used but useful language features: async/await vs then/catch, generator use cases, for-of iteration, and using maps/sets for different data shapes and deduping. Tooling and ecosystem updates: Includes sponsor mentions plus practical updates like Create React App 2 features, GraphCMS, FreshBooks, and React-related changes such as suspense/lazy loading and code splitting support.

Key Arguments: Spread/rest syntax is essential for immutability and cleaner data handling because it enables shallow copying and flexible argument collection without mutation. Arrow functions are valuable primarily because they change `this` behavior, not just because they are shorter syntax. Default parameters only fall back on `undefined`, so developers must not assume all falsy values trigger defaults. Named parameter style APIs are more readable and less brittle because argument order no longer matters. ES6 modules improve dependency clarity, enable tree-shaking/code splitting, and reduce the chaos of script order management from older JS patterns. Dynamic imports let apps defer loading features until needed, cutting initial bundle size and improving perceived performance. Classes simplify organizing state and behavior in modern JS frameworks, especially React, and class properties reduce boilerplate binding. Maps and sets solve different problems than objects/arrays, with sets especially useful for deduplication. Some ES6 features are most useful when a concrete use case appears, while others (like map/filter/reduce or async/await) become everyday tools depending on the developer's workflow.

Data Points: Episode format: Second half of the hosts’ “top 18 new things in JS” roundup - Opening of the episode; continuation from part one Workshop timing: Sunday workshop - West describes delivering a new intermediate React workshop at Web Unleashed Conference: Web Unleashed / FITC Toronto - West mentions attending and speaking at the conference React cache rename timing: 20 minutes - West says the React team renamed Simple Cache to React Cache 20 minutes after his talk Course level: Level 1 Apollo course - GraphCMS is used in the course as a quick backend for Apollo client practice Course length: 10 years - West says he has used FreshBooks for about 10 years FreshBooks trial: 30-day unrestricted free trial - Sponsor offer mentioned during the FreshBooks segment Create React App version: 2 - Discussion of Create React App 2 features like Sass, CSS modules, Babel 7, and Webpack 4 Subscription discount: 25% - West advertises a yearly subscription discount for Better JavaScript

Pivotal Quotes: "The idea with a spread is that you can spread into a function..." — Scott Tolinsky: Explaining the core use case for spread syntax with function arguments and arrays "I use them everywhere, but I totally understand why some people don't like them." — Scott Tolinsky: On arrow functions and the tradeoff between convenience and readability "Named parameters are like easily one of my most used things in modern JS." — Scott Tolinsky: Describing why object-based function arguments are highly readable and less brittle

Implications: Listeners are encouraged to adopt ES6+ features thoughtfully: use syntax that improves clarity, immutability, and performance, but balance it against readability and team familiarity. These patterns underpin modern React and large JS apps.