Coding Practice: JSON & Object Transformations

TL;DR

• Senior frontend work is full of object transformations: API shaping, config merging, redaction, normalization, and deep reads.
• These problems matter because real apps pass complex nested payloads more often than they pass binary trees.
• I treat object questions as production-relevant algorithm practice.

Context

If I am building dashboards, CMS flows, experimentation UIs, or profile editors, I am constantly flattening, grouping, diffing, merging, and validating JSON-shaped data.

The Approach

Practice these 10 medium-level questions:

1. Flatten Nested Object Paths — convert nested JSON into dot-path keys.
2. Unflatten Object Paths — rebuild nested shape from flattened keys.
3. Deep Merge With Array Strategy — merge config trees with explicit array rules.
4. Diff Two JSON Payloads — return changed paths and values.
5. Redact Sensitive Keys — recursively hide tokens, emails, or secrets.
6. Normalize API Records by ID — convert nested arrays to lookup maps.
7. Group Objects by Nested Path — e.g. team.region or user.role.
8. Build Tree From Flat Nodes — parent/child reconstruction from records.
9. Deep Equality Ignoring Key Order — compare nested objects predictably.
10. Apply Patch Operations — update deep paths without mutating source state.

Try it in the browser

Trade-offs

• Object transformations are readable when I keep path semantics explicit; they become brittle when I mix traversal and business rules.
• Immutable updates are safer for UI state, but deep copies can get expensive if I do them carelessly on hot paths.

References

• Related: Coding Practice: Collections
• Related: React State Management