Command Palette

Search for a command to run...

Hectal
Back to the lesson: Topic 15.1 — Functional Patterns
JavaScript · Example 3 of 3

Updating nested state without mutation

Unchanged parts (todos, the first todo) are shared between old and new state. That sharing is what makes immutable updates cheap.

Functional patterns build programs from small functions that don't change shared data: immutability keeps values safe, composition chains functions into pipelines, and currying and partial application make specialised functions from general ones.

Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.

Ready for more? This phase has 6 hands-on exercises with automatic checks.

Practice questions

Write the code in the editor, run it, then open the model answer to compare.

01

Write updateTodo(todos, id, changes) that returns a new array where the todo with that id is merged with changes, without changing the original. Test it.

02

Write a curried filterBy(key)(value)(list) and use it to get the books by "Ruskin" from a list.

03

Use pipe to build total that takes a cart array of { price, qty }, multiplies each line, adds them up, and adds 18% tax rounded to 2 decimals.

Explain it without notes

01

What is a pure function, and why does it matter?

02

How do you update a nested property immutably, and why is spread called shallow?

03

What is the difference between currying and partial application?

04

Implement pipe and explain how it differs from compose.

Updating nested state without mutation

Preview

Press Run to see the page.

Console

Nothing logged yet.

Expected console output

Delhi Pune
true
true false true
[ 1, 20, 3 ]
Delhi Goa