Modern JavaScript Power-Ups

Small bits of syntax that make a big difference. Twelve short pages from Grade 13 of High School, about 14 minutes of reading in all.

Start reading Or practice it in the game

What you’ll learn

  • Spread ... in every flavor
  • Rest parameters and rest destructuring
  • Destructuring tricks (including swapping)
  • Optional chaining ?.
  • Nullish coalescing ?? vs `\
  • \
  • `
  • Short-circuit tricks and `\
  • \
  • =, &&=, ??=`
  • Set for unique values
  • Map for flexible key-value pairs
  • Working with dates

The pages

Twelve pages, about 14 minutes.

  1. Welcome to Grade 13 Yes, Grade 13 exists. We warned you about this at Orientation. This grade is a collection of power-ups: features that…
  2. Spread: Unpacking Everything You've met the spread syntax ... a couple of times already. Let's collect all its tricks in one place. Spread unpacks…
  3. Rest: Packing Things Up The same three dots can also do the opposite of spread: pack several things into an array. When ... appears in a…
  4. Destructuring Deluxe You learned the basics of destructuring in Grade 8. Here are some more tricks. Remember the juice-and-milk swap puzzle…
  5. Optional Chaining: ?. Remember this error from Grade 8? The most common error in JavaScript? user.address is undefined, and you can't read a…
  6. Nullish Coalescing: ?? Often you want to use a default value when something is missing. You've seen the || trick for this. || returns the…
  7. Short-Circuit Tricks In Grade 3, the Professor mentioned that && and || are "lazy": they stop as soon as they know the answer. This is…
  8. Sets: Collections of Unique Values A Set is a collection of values where every value is unique. No duplicates allowed. If you try to add something that's…
  9. Maps: Flexible Key-Value Pairs A Map is like an object (it stores key-value pairs), but with some upgrades. Keys can be any type: numbers, objects…
  10. Working With Dates JavaScript has a built-in Date object for working with dates and times. It's a bit quirky (it's one of the oldest…
  11. Mini Project: The Data Cleaner In the real world, data is messy. Some fields are missing, some are empty, some have duplicates. Let's use our…
  12. Recap The key ideas of Grade 13, Modern JavaScript, on one page. Spread ... unpacks arrays, strings and objects: copying…

Reading is step one

CurlyScript turns these notes into a game: short questions, an explanation after every answer, and a test at the end of each grade. Free, with nothing to sign up for.

Start learning