butterfly/kb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
0bf0caf861
kb/data/developer.mozilla.org/en-US/docs/Glossary/Shallow_copy-0.md

12 KiB
Raw Blame History

title chunk source category tags date_saved instance
Shallow copy - Glossary | MDN 1/3 https://developer.mozilla.org/en-US/docs/Glossary/Shallow_copy reference web, html, css, javascript, documentation 2026-05-05T05:45:11.367730+00:00 kb-cron

MDN HTML HTML: Markup language

HTML reference

HTML guides

Markup languages

CSS CSS: Styling language

CSS reference

CSS guides

Layout cookbook

JavaScriptJS JavaScript: Scripting language

JS reference

JS guides

Web APIs Web APIs: Programming interfaces

Web API reference

Web API guides

All All web technology

Technologies

Topics

Learn Learn web development

Frontend developer course

Learn HTML

Learn CSS

Learn JavaScript

Tools Discover our tools

About Get to know MDN better

Blog

  1. Glossary
  2. Shallow copy

Shallow copy

A shallow copy of an object is a copy whose properties share the same references (point to the same underlying values) as those of the source object from which the copy was made. As a result, when you change either the source or the copy, you may also cause the other object to change too. That behavior contrasts with the behavior of a deep copy, in which the source and copy are completely independent. More formally, two objects o1 and o2 are shallow copies if:

  1. They are not the same object (o1 !== o2).
  2. The properties of o1 and o2 have the same names in the same order.
  3. The values of their properties are equal.
  4. Their prototype chains are equal.

See also the definition of structural equivalence. The copy of an object whose properties all have primitive values fits the definition of both a deep copy and a shallow copy. It is somewhat useless to talk about the depth of such a copy, though, because it has no nested properties and we usually talk about deep copying in the context of mutating nested properties. For shallow copies, only the top-level properties are copied, not the values of nested objects. Therefore:

  • Re-assigning top-level properties of the copy does not affect the source object.
  • Re-assigning nested object properties of the copy does affect the source object.

In JavaScript, all standard built-in object-copy operations (spread syntax, Array.prototype.concat(), Array.prototype.slice(), Array.from(), and Object.assign()) create shallow copies rather than deep copies. Consider the following example, in which an ingredientsList array object is created, and then an ingredientsListCopy object is created by copying that ingredientsList object. Re-assigning the value of a nested property will be visible in both objects. Re-assigning the value of a top-level property (the 0 index in this case) will only be visible in the changed object.

In this article

See also