TodayTools

JavaScript flashcards

The language of the web: values, async code, the event loop and the modern features that remove whole libraries.

Donate
Beginner friendly, starts from zero
Section
How to study
0
JavaScriptStart from zero · 1 of 12

What is JavaScript, in one plain sentence?

JavaScript is the programming language that makes web pages do things: react to clicks, check forms and change what you see without reloading.

HTML is the bones, CSS is the clothes, JavaScript is the muscles.
Show again
12 left
Got it

Tap to turn over. Swipe right if you know it, left to see it again.

All topics

What you will learn

  1. Start from zero

    • What JavaScript is and why it exists3 cards
    • Where code runs3 cards
    • Variables and values2 cards
    • Functions and events2 cards
    • Getting ready2 cards
  2. Core basics

    • How JavaScript runs on a page3 cards
    • Variables, types and equality5 cards
    • Strings, truthiness and conditions3 cards
    • Functions and objects3 cards
    • Arrays and loops3 cards
    • The DOM, forms and events3 cards
    • Errors and saving data2 cards
  3. Next steps

    • Array and object patterns5 cards
    • Promises, async and fetch5 cards
    • Modules and classes3 cards
    • Closures and this2 cards
    • Collections, dates and formatting4 cards
  4. Go deeper

    • Event loop, prototypes and scope4 cards
    • Iterators and generators2 cards
    • New in ES2024 to ES20264 cards
    • Async control and timing3 cards
    • Data correctness2 cards
    • Performance and memory4 cards

Final test and certificate

10 questions drawn fresh from the whole topic, about 15 minutes. Sign in, score 80% or more and get a free certificate with your name and a public check link anyone can open, such as an employer or a teacher. Not signed in? Try a practice test from the cards.

Take the final test

JavaScript at a glance

JavaScript is the programming language that makes web pages react to you.

If a web page is a body, HTML is the bones, CSS is the clothes and JavaScript is the muscles that make it move.

Words you will meet

Browser
The app you open websites in, which also runs JavaScript
Console
A panel in the browser where you type code and see messages
Variable
A named box that holds a value
String
A piece of text, written inside quotes
Array
A list of values in square brackets
Object
A group of labelled values in curly brackets
Function
A named set of steps you can run again and again
Event
Something that happens on the page, like a click or a key press

The steps

  1. 1. Start from zero (12 cards): What JavaScript is, where you meet it, your first line of code, and the plain words the core basics use.
  2. 2. Core basics (22 cards): Values, types, comparisons, functions, arrays, objects and your first event handler.
  3. 3. Next steps (19 cards): Array methods, destructuring, async and error handling, modules, closures, this and immutable updates.
  4. 4. Go deeper (19 cards): Event loop, prototypes, scope rules, iterators, ES2025 and ES2026 features, cancellation, memory and threads.
All 12 cards in Start from zero
What is JavaScript, in one plain sentence?
JavaScript is the programming language that makes web pages do things: react to clicks, check forms and change what you see without reloading.
What were web pages like before JavaScript?
Like printed posters. Every click loaded a whole new page, and a form only told you about a mistake after you sent it and waited.
Where do you meet JavaScript in daily life?
A like button that turns red at once, a form saying "password too short" as you type, a map you drag with your finger, a chat that shows new messages. All JavaScript.
What are the browser, the engine and the console?
The browser is the app you open websites in. Inside it, an engine runs JavaScript. The console is a panel in the browser's DevTools where you type code and see messages; press F12 to open it.
What does your first line of JavaScript do?
console.log prints a message in the console, and the text in quotes is the message. Text in quotes is called a string.
What is a variable?
A variable is a named box that holds a value. let makes a box you can refill later; const makes one you will not point at a new value.
What kinds of values does JavaScript have?
Strings (text in quotes), numbers, booleans (true or false), null and undefined (empty), arrays (a list in [ ]) and objects (labelled values in { }).
What is a function?
A function is a named set of steps you can run again and again. You pass it input inside brackets and it can return an answer. A callback is a function you hand over to be run later.
What is an event?
An event is something that happens on the page, like a click or a key press. An event listener is code that waits for that event and runs when it happens.
How does JavaScript get onto a page, and can it run anywhere else?
An HTML <script> tag loads it into the page. It also runs on servers (the computers that send pages and data to you) using Node.
What do you need before starting?
Just a browser and a text editor. Nothing to install: you can even start by typing into the browser console.
What will you be able to do after this topic?
Store and change data in variables, write functions, make decisions with if, loop over lists, react to clicks, and find bugs with the console.
JavaScript cheatsheet

Arrays

  • arr.filter(fn).map(fn) Keep, then reshape
  • arr.reduce((acc, x) => acc + x, 0) Fold to one value, always seed it
  • arr.toSorted((a, b) => a - b) Sorted copy, numbers
  • arr.with(i, value) Copy with one item replaced
  • arr.at(-1) Last item
  • arr.findLast(fn) Search from the end
  • Object.groupBy(arr, fn) Group into an object of arrays
  • [...new Set(arr)] Unique values

Objects and values

  • const { a, b: alias = 1, ...rest } = obj Destructure, rename, default, rest
  • { ...obj, key: value } Shallow copy with update
  • obj?.a?.b ?? fallback Safe read with default
  • Object.hasOwn(obj, key) Own property check
  • Object.entries(obj) Array of [key, value]
  • Object.fromEntries(map) Map or pairs back to object
  • structuredClone(value) Deep copy with Dates, Maps, cycles

Async

  • await Promise.all(list.map(fn)) Parallel, fail fast
  • Promise.allSettled(ps) Parallel, keep every result
  • Promise.any(ps) First success
  • Promise.withResolvers() Promise plus resolve and reject
  • AbortSignal.timeout(5000) Cancel after 5 s
  • AbortSignal.any([a, b]) Cancel on either signal
  • for await (const x of stream) Consume async iterables

DOM

  • el.addEventListener("click", fn, { signal }) Listener removable by abort
  • e.target.closest("[data-id]") Event delegation
  • el.dataset.orderId Read data-order-id
  • el.textContent = text Safe text insert
  • el.append(...nodes) Insert nodes or strings
  • new IntersectionObserver(cb) React to elements entering view
  • requestAnimationFrame(fn) Run before the next paint

Built-ins worth knowing

  • new Intl.NumberFormat(locale, { style: "currency", currency }) Money display
  • new Intl.RelativeTimeFormat("en").format(-3, "day") "3 days ago"
  • crypto.randomUUID() Random v4 id
  • new URL(path, base).searchParams Parse and build query strings
  • Math.sumPrecise(nums) Exact float sum (ES2026)
  • bytes.toBase64() / Uint8Array.fromBase64(s) Base64 without btoa (ES2026)
  • set.difference(other) Set maths (ES2025)
Donate