0Pricing
TypeScript Academy · Lesson

Derived State and Selectors with Types

Write typed selector functions for computed state.

What Is Derived State?

Derived state is state computed from other state — like filtering a list or summing values. Selectors encapsulate this computation and can be memoized for performance.

// Raw state
const users: User[] = [/* ... */];
// Derived state: active users only
const activeUsers = users.filter(u => u.isActive);

Typed Selector Functions

Write selector functions with explicit return types to document what they compute and prevent type drift.

import type { RootState } from "./store";

const selectActiveUsers = (state: RootState): User[] =>
  state.users.filter((u) => u.isActive);

const selectUserCount = (state: RootState): number =>
  state.users.length;

All lessons in this course

  1. Typing Redux Toolkit Slices and Thunks
  2. Zustand Store Typing Patterns
  3. XState: Typed State Machines
  4. Derived State and Selectors with Types
← Back to TypeScript Academy