← Gallery

Reference vs Copy

by Anonymous

Try reference, shallow copy, and deep copy to see which changes ripple through to the other side and which stay separate.

Ready to remix β€” hit the 🍴 Remix button below. You'll sign up first, then this app is copied into your workspace.

πŸ”— Open in a new tab

About this app

Reference vs Copy is an interactive JavaScript learning app that demonstrates how primitive values, object references, shallow copies, and deep copies behave. Use guided buttons and visual box-and-label examples to change values or colors and see immediately whether the original and copy change together. Step-by-step goals and feedback reinforce why shared references behave differently from independent copies.

Use cases

  • Beginners learning JavaScript variables and objects
  • Students studying reference semantics and copying
  • Teachers demonstrating shallow versus deep copy
  • Learners practicing through interactive coding exercises

Features

  • Interactive examples for value copying with numbers and text
  • Reference exercises using two labels connected to one box
  • Shallow-copy demonstrations that share inner objects
  • Deep-copy demonstrations with independent outer and inner data
  • Guided goals, run, reset, and next-step controls
  • Visual color and pattern changes that reveal shared state