How do I correctly clone a JavaScript object

Question

I have an object x  I d like to copy it as object y  such that changes to y do not modify x  I realized that copying objects derived from built-in JavaScript objects will result in extra  unwanted properties  This isn t a problem  since I m copying one of my own literal-constructed objects   How do I correctly clone a JavaScript object

User · Answer

If you re okay with a shallow copy  the underscore js library has a clone method   y     clone x     or you can extend it like  copiedObject     extend    originalObject

User · Answer

An elegant way to clone a Javascript object in one line of code An Object assign method is part of the ECMAScript 2015  ES6  standard and does exactly what you need  var clone   Object assign     obj     The Object assign   method is used to copy the values of all enumerable own properties from one or more source objects to a target object   Read more    The polyfill to support older browsers  if   Object assign      Object defineProperty Object   assign         enumerable  false      configurable  true      writable  true      value  function target           use strict         if  target     undefined    target     null            throw new TypeError  Cannot convert first argument to object                   var to   Object target         for  var i   1  i  lt  arguments length  i              var nextSource   arguments i           if  nextSource     undefined    nextSource     null              continue                    nextSource   Object nextSource            var keysArray   Object keys nextSource           for  var nextIndex   0  len   keysArray length  nextIndex  lt  len  nextIndex                var nextKey   keysArray nextIndex             var desc   Object getOwnPropertyDescriptor nextSource  nextKey             if  desc     undefined  amp  amp  desc enumerable                to nextKey    nextSource nextKey                                       return to

User · Answer

function clone src  deep         var toString   Object prototype toString      if  src  amp  amp  typeof src     object              any non-object   Boolean  String  Number    null  undefined  NaN         return src               Honor native custom clone methods     if src clone  amp  amp  toString call src clone       object Function             return src clone deep                DOM Elements     if src nodeType  amp  amp  toString call src cloneNode       object Function             return src cloneNode deep                Date     if toString call src       object Date             return new Date src getTime                  RegExp     if toString call src       object RegExp             return new RegExp src                Function     if toString call src       object Function               Wrap in another method to make sure    is not true            Note  Huge performance issue due to closures  comment this            return  function                src apply this  arguments                           var ret  index        Array     if toString call src       object Array                  slice 0  would soft clone         ret   src slice            if deep               index   ret length              while index--                   ret index    clone ret index   true                                       Object     else           ret   src constructor   new src constructor                 for  var prop in src                ret prop    deep                   clone src prop   true                    src prop                        return ret

User · Answer

My favorite  amp  elegant JS objects clone solution is  function CloneObject      function cloneObject o       CloneObject prototype   o     return new CloneObject        Use cloneObject object  to get a clone of JS object   Unlike many copy solutions this clone keeps prototype relationship in cloned object

User · Answer

Ok so this might be the very best option for shallow copying   If follows the many examples using assign  but it also keeps the inheritance and prototype  It s so simple too and works for most array-like and Objects except those with constructor requirements or read-only properties  But that means it fails miserably for TypedArrays  RegExp  Date  Maps  Sets and Object versions of primitives  Boolean  String  etc      function copy   a     return Object assign  new a constructor  a       Where a can be any Object or class constructed instance  but again not be reliable for thingies that use specialized getters and setters or have constructor requirements  but for more simple situations it rocks   It does work on arguments as well     You can also apply it to primitives to get strange results  but then     unless it just ends up being a useful hack  who cares   results from basic built-in Object and Array      gt  a     a   A   b   B   c   C   d   D      a   A   b   B   c   C   d   D     gt  b   copy  a     a   A   b   B   c   C   d   D     gt  a    1 2 3 4    1  2  3  4    gt  b   copy  a     1  2  3  4     And fails because of mean get setters  constructor required arguments or read-only properties  and sins against the father    gt  a     w  g   w  g  gt  b   copy  a       fails because source and flags are read-only         gt  a   new Date    1 1 2001    2000-12-31T16 00 00 000Z  gt  b   copy  a       fails because Date using methods to get and set things 2017-02-04T14 44 13 990Z  gt  a   new Boolean  true    Boolean  true   gt  b   copy  a       fails because of of sins against the father  Boolean  false   gt  a   new Number  37    Number  37   gt  b   copy  a       fails because of of sins against the father  Number  0   gt  a   new String   four score and seven years ago our four fathers     String   four score and seven years ago our four fathers    gt  b   copy  a       fails because of of sins against the father    String       0    f    1    o    2    u    3    r    4         5    s    6    c    7    o    8    r    9    e    10         11    a    12    n    13    d    14         15    s    16    e    17    v    18    e    19    n    20         21    y    22    e    23    a    24    r    25    s    26         27    a    28    g    29    o    30         31    o    32    u    33    r    34         35    f    36    o    37    u    38    r    39         40    f    41    a    42    t    43    h    44    e    45    r    46    s

User · Answer

One particularly inelegant solution is to use JSON encoding to make deep copies of objects that do not have member methods  The methodology is to JSON encode your target object  then by decoding it  you get the copy you are looking for   You can decode as many times as you want to make as many copies as you need   Of course  functions do not belong in JSON  so this only works for objects without member methods   This methodology was perfect for my use case  since I m storing JSON blobs in a key-value store  and when they are exposed as objects in a JavaScript API  each object actually contains a copy of the original state of the object so we can calculate the delta after the caller has mutated the exposed object   var object1    key  value    var object2   object1   object2   JSON stringify object1   object2   JSON parse object2    object2 key    a change   console log object1     returns value

User · Answer

For a deep copy and clone  JSON stringify then JSON parse the object   obj     a  0   b    c  0    let deepClone   JSON parse JSON stringify obj    obj a   5  obj b c   5  console log JSON stringify deepClone         a  0  b    c  0

User · Answer

The problem with copying an object that  eventually  may point at itself  can be solved with a simple check  Add this check  every time there is a copy action  It may be slow  but it should work   I use a toType   function to return the object type  explicitly  I also have my own copyObj   function  which is rather similar in logic  which answers all three Object    Array    and Date   cases   I run it in NodeJS   NOT TESTED  YET      Returns true  if one of the parent s children is the target     This is useful  for avoiding copyObj   through an infinite loop  function isChild target  parent      if  toType parent       object Object          for  var name in parent          var curProperty   parent name             Direct child        if  curProperty   target  return true            Check if target is a child of this property  and so on  recursively        if  toType curProperty       object Object      toType curProperty       object Array              if  isChild target  curProperty   return true                    else if  toType parent       object Array          for  var i 0  i  lt  parent length  i            var curItem   parent i             Direct child        if  curItem   target  return true            Check if target is a child of this property  and so on  recursively        if  toType curItem       object Object      toType curItem       object Array              if  isChild target  curItem   return true                       return false         Not the target

User · Answer

To support a better understanding of copying of objects  this illustrative jsbin may be of value  class base     get under   return true     class a extends base     const b       get b1   return true     b  true    console log  Object assign   let t1   Object create b  t1 x   true const c   Object assign t1  new a    console log c b1    prop value copied    prop value gone   console log c x    assigned value copied    assigned value gone   console log c under    inheritance ok    inheritance gone   console log c b1    get value unchanged     get value lost   c b1   false console log c b1   get unchanged     get lost   console log  -----------------------------------   console log  Object assign  - order swopped   t1   Object create b  t1 x   true const d   Object assign new a    t1  console log d b1    prop value copied    prop value gone   console log d x    assigned value copied    assigned value gone   console log d under    inheritance n a    inheritance gone   console log d b1    get value copied     get value lost   d b1   false console log d b1   get copied     get lost   console log  -----------------------------------   console log  Spread operator   t1   Object create b  t2   new a   t1 x   true const e        t1     t2   console log e b1    prop value copied    prop value gone   console log e x    assigned value copied    assigned value gone   console log e under    inheritance ok    inheritance gone   console log e b1    get value copied     get value lost   e b1   false console log e b1   get copied     get lost   console log  -----------------------------------   console log  Spread operator on getPrototypeOf   t1   Object create b  t2   new a   t1 x   true const e1        Object getPrototypeOf t1      Object getPrototypeOf t2    console log e1 b1    prop value copied    prop value gone   console log e1 x    assigned value copied    assigned value gone   console log e1 under    inheritance ok    inheritance gone   console log e1 b1    get value copied     get value lost   e1 b1   false console log e1 b1   get copied     get lost   console log  -----------------------------------   console log  keys  defineProperty  getOwnPropertyDescriptor   f   Object create b  t2   new a   f x    a  Object keys t2  forEach key  gt      Object defineProperty f key Object getOwnPropertyDescriptor t2  key      console log f b1    prop value copied    prop value gone   console log f x    assigned value copied    assigned value gone   console log f under    inheritance ok    inheritance gone   console log f b1    get value copied     get value lost   f b1   false console log f b1   get copied     get lost   console log  -----------------------------------   console log  defineProperties  getOwnPropertyDescriptors   let g   Object create b  t2   new a   g x    a  Object defineProperties g Object getOwnPropertyDescriptors t2   console log g b1    prop value copied    prop value gone   console log g x    assigned value copied    assigned value gone   console log g under    inheritance ok    inheritance gone   console log g b1    get value copied     get value lost   g b1   false console log g b1   get copied     get lost   console log  -----------------------------------

User · Answer

There are several issues with most solutions on the internet  So I decided to make a follow-up  which includes  why the accepted answer shouldn t be accepted   starting situation  I want to deep-copy a Javascript Object with all of its children and their children and so on  But since I m not kind of a normal developer  my Object has normal properties  circular structures and even nested objects   So let s create a circular structure and a nested object first   function Circ         this me   this     function Nested y        this y   y      Let s bring everything together in an Object named a   var a         x   a       circ  new Circ        nested  new Nested  a        Next  we want to copy a into a variable named b and mutate it   var b   a   b x    b   b nested y    b     You know what happened here because if not you wouldn t even land on this great question   console log a  b    a -- gt  Object       x   b       circ  Circ           me  Circ                    nested  Nested           y   b           b -- gt  Object       x   b       circ  Circ           me  Circ                    nested  Nested           y   b            Now let s find a solution   JSON  The first attempt I tried was using JSON   var b   JSON parse  JSON stringify  a       b x    b   b nested y    b     Don t waste too much time on it  you ll get TypeError  Converting circular structure to JSON   Recursive copy  the accepted  answer    Let s have a look at the accepted answer   function cloneSO obj           Handle the 3 simple types  and null or undefined     if  null    obj     object     typeof obj  return obj          Handle Date     if  obj instanceof Date            var copy   new Date            copy setTime obj getTime             return copy                Handle Array     if  obj instanceof Array            var copy               for  var i   0  len   obj length  i  lt  len  i                  copy i    cloneSO obj i                      return copy                Handle Object     if  obj instanceof Object            var copy               for  var attr in obj                if  obj hasOwnProperty attr   copy attr    cloneSO obj attr                      return copy             throw new Error  Unable to copy obj  Its type isn t supported         Looks good  heh  It s a recursive copy of the object and handles other types as well  like Date  but that wasn t a requirement   var b   cloneSO a    b x    b   b nested y    b     Recursion and circular structures doesn t work well together    RangeError  Maximum call stack size exceeded  native solution  After arguing with my co-worker  my boss asked us what happened  and he found a simple solution after some googling  It s called Object create   var b   Object create a    b x    b   b nested y    b     This solution was added to Javascript some time ago and even handles circular structure   console log a  b    a -- gt  Object       x   a       circ  Circ           me  Circ                    nested  Nested           y   b           b -- gt  Object       x   b       circ  Circ           me  Circ                    nested  Nested           y   b                and you see  it didn t work with the nested structure inside   polyfill for the native solution  There s a polyfill for Object create in the older browser just like the IE 8  It s something like recommended by Mozilla  and of course  it s not perfect and results in the same problem as the native solution   function F       function clonePF o        F prototype   o      return new F       var b   clonePF a    b x    b   b nested y    b     I ve put F outside the scope so we can have a look at what instanceof tells us   console log a  b    a -- gt  Object       x   a       circ  Circ           me  Circ                    nested  Nested           y   b           b -- gt  F       x   b       circ  Circ           me  Circ                    nested  Nested           y   b           console log typeof a  typeof b    a -- gt  object b -- gt  object  console log a instanceof Object  b instanceof Object    a -- gt  true b -- gt  true  console log a instanceof F  b instanceof F    a -- gt  false b -- gt  true   Same problem as the native solution  but a little bit worse output   the better  but not perfect  solution  When digging around  I found a similar question  In Javascript  when performing a deep copy  how do I avoid a cycle  due to a property being  quot this quot    to this one  but with a way better solution   function cloneDR o        const gdcc      getDeepCircularCopy         if  o     Object o             return o     primitive value            var set   gdcc in o          cache   o gdcc           result      if  set  amp  amp  typeof cache     function             return cache                 else     o gdcc    function     return result        overwrite     if  o instanceof Array            result               for  var i 0  i lt o length  i                  result i    cloneDR o i                    else           result               for  var prop in o              if  prop    gdcc                  result prop    cloneDR o prop                else if  set                  result prop    cloneDR cache             if  set            o gdcc    cache     reset       else           delete o gdcc      unset again           return result     var b   cloneDR a    b x    b   b nested y    b     And let s have a look at the output     console log a  b    a -- gt  Object       x   a       circ  Object           me  Object                    nested  Object           y   a           b -- gt  Object       x   b       circ  Object           me  Object                    nested  Object           y   b           console log typeof a  typeof b    a -- gt  object b -- gt  object  console log a instanceof Object  b instanceof Object    a -- gt  true b -- gt  true  console log a instanceof F  b instanceof F    a -- gt  false b -- gt  false   The requirements are matched  but there are still some smaller issues  including changing the instance of nested and circ to Object      The structure of trees that share a leaf won t be copied  they will become two independent leaves             Object                       Object                                                                                                                                                  Object      Object        gt    Object      Object                                                                                                                                                            Object                 Object      Object    conclusion  The last solution using recursion and a cache  may not be the best  but it s a real deep-copy of the object  It handles simple properties  circular structures and nested object  but it will mess up the instance of them while cloning   jsfiddle

User · Answer

I came to this page due to the same question but I m neither using JQuery and none of the clone-Methods worked for my own objects   I m aware my answer isn t related too strong to this question because it s a different approach  Instead of using clone-functions I use a create function  It worked for me for the following  unfortunately restricting  purposes    I use mostly JSP-generated Javascript I know in the beginning which Object must be generated  In my case it s Information from a Database which gets fetched once and needs to be deployed more often in the JS    First I defined my Objects like this   var obj  new Object    obj Type  Row   obj ID 1  obj Value  Blah blah     Now I moved everything like   function getObjSelektor id nummer selected   var obj   document createElement  select    obj setAttribute  id   Selektor   id nummer   obj setAttribute  name   Selektor    obj setAttribute  size   1     var obj opt 1   document createElement  option    obj opt 1 setAttribute  value   1    if 1  selected      posopval opt 1 setAttribute  selected   selected    obj opt 1 innerHTML  Blah blah   obj appendChild obj opt 1    var obj opt 2   document createElement  option    obj opt 2 setAttribute  value   2    if 2  selected      obj opt 2 setAttribute  selected   selected    obj opt 2 innerHTML  2nd Row   obj appendChild obj opt 2         return obj      And call the function in the regular code   myDiv getObjSelektor getObjSelektor anotherObject ID      As said this is a different approach which solved my issue for my purposes

User · Answer

If you got an Object with Functions you can do it with JSONfn  see http   www eslinstructor net jsonfn    var obj        name  Marvin       getName    function          return this name          var cobj   JSONfn parse JSONfn stringify obj

User · Answer

If your object is a class  e g  https   developer mozilla org en-US docs Web JavaScript Reference Classes    var copiedObject   jQuery extend true      originalObject   copiedObject   proto     originalObject   proto      Then in copiedObject you have a deep-copied instance of originalObject class with all its methods

User · Answer

From the Apple JavaScript Coding Guidelines      Create an inner object with a variable x whose default    value is 3  function innerObj             this x   3    innerObj prototype clone   function         var temp   new innerObj        for  myvar in this               this object does not contain any objects  so            use the lightweight copy code          temp myvar    this myvar             return temp        Create an outer object with a variable y whose default    value is 77  function outerObj                The outer object contains an inner object   Allocate it here          this inner   new innerObj            this y   77    outerObj prototype clone   function         var temp   new outerObj        for  myvar in this            if  this myvar  clone                   This variable contains an object with a                clone operator   Call it to create a copy              temp myvar    this myvar  clone              else                  This variable contains a scalar value                 a string value  or an object with no                clone function   Assign it directly              temp myvar    this myvar                       return temp        Allocate an outer object and assign non-default values to variables in    both the outer and inner objects  outer   new outerObj  outer inner x   4  outer y   16      Clone the outer object  which  in turn  clones the inner object   newouter   outer clone        Verify that both values were copied  alert  inner x is   newouter inner x      prints 4 alert  y is   newouter y      prints 16   Steve

User · Answer

I ve tried this in the case of a scalar object and it works for me   function binder i      return function          return i          a 1  b binder a        copy value of a into b  alert   a      2 alert b      still 1   Regards

User · Answer

Jan Turon s answer above is very close  and may be the best to use in a browser due to compatibility issues  but it will potentially cause some strange enumeration issues   For instance  executing   for   var i in someArray             Will assign the clone   method to i after iterating through the elements of the array   Here s an adaptation that avoids the enumeration and works with node js   Object defineProperty  Object prototype   clone         value  function             if   this cloneNode                         return this cloneNode  true                       var copy   this instanceof Array                    for  var attr in this                         if   typeof this  attr       function     this  attr      null     this  attr   clone                                 copy  attr     this  attr                              else if   this  attr      this                                 copy  attr     copy                            else                               copy  attr     this  attr   clone                                    return copy             Object defineProperty  Date prototype   clone         value  function             var copy   new Date            copy setTime  this getTime              return copy             Object defineProperty  Number prototype   clone     value  function     return this         Object defineProperty  Boolean prototype   clone     value  function     return this         Object defineProperty  String prototype   clone     value  function     return this           This avoids making the clone   method enumerable because defineProperty   defaults enumerable to false

User · Answer

Just as this link says use this code    let clone   Object create Object getPrototypeOf obj    Object getOwnPropertyDescriptors obj

User · Answer

Using Lodash    var y     clone x  true

User · Answer

var x     e   2   d   8   b   5    const y       for let key in x        y key    x key     console log y        gt  gt  gt   e  2  d  8  b  5   const z       Object keys x  forEach key   gt        z key    x key       console log z        gt  gt  gt   e  2  d  8  b  5   const w       for let i   0  i  lt  Object keys x  length  i          w Object keys x  i     x Object keys x  i      console log w        gt  gt  gt   e  2  d  8  b  5   const v       for let key of Object keys x         v key    x key     console log v        gt  gt  gt   e  2  d  8  b  5   x  q     100       Altering x will not affect the other objects  console log x        gt  gt  gt   e  2  d  8  b  5  q  100  console log y        gt  gt  gt   e  2  d  8  b  5  console log z        gt  gt  gt   e  2  d  8  b  5  console log w        gt  gt  gt   e  2  d  8  b  5  console log v        gt  gt  gt   e  2  d  8  b  5

User · Answer

From this article  How to copy arrays and objects in Javascript by Brian Huisman   Object prototype clone   function       var newObj    this instanceof Array               for  var i in this        if  i     clone   continue      if  this i   amp  amp  typeof this i      object           newObj i    this i  clone          else newObj i    this i      return newObj

User · Answer

Simple recursive method to clone an object  Also could use lodash clone    x000D   x000D  let clone    obj    gt    x000D   let obj2   Array isArray obj             x000D   for let k in obj    x000D            obj2 k     typeof obj k       object      clone obj k      obj k   x000D            x000D          return obj2  x000D        x000D   x000D  let w     name   Apple   types    Fuji    Gala     x000D  let x   clone w   x000D  w name    Orange   x000D  w types     Navel    x000D  console log x   x000D  console log w   x000D   x000D   x000D

User · Answer

Here is a function you can use    function clone obj        if obj    null    typeof obj      object           return obj          var temp   new obj constructor         for var key in obj          temp key    clone obj key            return temp

User · Answer

There are many answers  but none that mentions Object create from ECMAScript 5  which admittedly does not give you an exact copy  but sets the source as the prototype of the new object   Thus  this is not an exact answer to the question  but it is a one-line solution and thus elegant  And it works best for 2 cases    Where such inheritance is useful  duh   Where the source object won t be modified  thus making the relation between the 2 objects a non issue    Example   var foo     a   1    var bar   Object create foo   foo a     1 bar a     1 foo a   2  bar a     2 - prototype changed bar a   3  foo a     Still 2  since setting bar a makes it an  own  property   Why do I consider this solution to be superior  It s native  thus no looping  no recursion  However  older browsers will need a polyfill

User · Answer

You can simply use a spread property to copy an object without references  But be careful  see comments   the  copy  is just on the lowest object array level  Nested properties are still references     Complete clone   let x    a   value1   let x2       x        gt  mutate without references   x2 a    value2  console log x a          gt   value1    Clone with references on second level   const y    a   b   value3    const y2       y        gt  nested object is still a references   y2 a b    value4  console log y a b          gt   value4      JavaScript actually does not support deep clones natively  Use an utility function  For example Ramda      http   ramdajs com docs  clone

User · Answer

You may clone your Object without modification parent Object -            Object Extend          typeof Object extend      function    undefined     Object extend   function   destination  source             for   var property in source               destination property    source property           return destination                       Object Extend             Object clone          typeof Object clone      function    undefined     Object clone   function   object             return this extend      object                         Object clone         let myObj             a 1  b 2  c 3  d               a 1  b 2  c 3                       let clone   Object clone  myObj         clone a   10       console log  clone a   gt    clone a        gt  10      console log  myObj a   gt    myObj a        gt  1    object not modified here      let clone2   Object clone  clone         clone2 a   20       console log  clone2 a   gt    clone2 a        gt  20      console log  clone a   gt    clone a        gt  10    object not modified here

User · Answer

I think there is a simple and working answer  In deep copying there are two concerns    Keep properties independent to each other  And keep the methods alive on cloned object    So I think one simple solution will be to first serialize and deserialize and then do an assign on it to copy functions too   let deepCloned   JSON parse JSON stringify source    let merged   Object assign     source   Object assign merged  deepCloned     Although this question has many answers  I hope this one helps too

User · Answer

Using defaults  historically specific to nodejs but now usable from the browser thanks to modern JS    import defaults from  object defaults    const myCopy   defaults     myObject

User · Answer

Here s a modern solution that doesn t have the pitfalls of Object assign    does not copy by reference    const cloneObj    obj    gt        return Object keys obj  reduce  dolly  key    gt            dolly key     obj key  constructor     Object                cloneObj obj key                 obj key           return dolly

User · Answer

The most correct to copy object is use Object create  Object create Object getPrototypeOf obj   Object getOwnPropertyDescriptors obj     Such a notation will make identically the same object with right prototype and hidden properties

User · Answer

Use lodash   cloneDeep      Shallow Copy  lodash   clone    A shallow copy can be made by simply copying the reference   let obj1         a  0      b            c  0          e                f  0                    let obj3     clone obj1   obj1 a   4  obj1 b c   4  obj1 b e f   100   console log JSON stringify obj1        a  4  b    c  4  e    f  100     console log JSON stringify obj3        a  0  b    c  4  e    f  100        Deep Copy  lodash   cloneDeep    fields are dereferenced  rather than references to objects being copied  let obj1         a  0      b            c  0          e                f  0                    let obj3     cloneDeep obj1   obj1 a   100  obj1 b c   100  obj1 b e f   100   console log JSON stringify obj1      a  100  b    c  100  e    f  100     console log JSON stringify obj3      a  0  b    c  0  e    f  0

User · Answer

If you do not use Dates  functions  undefined  regExp or Infinity within your object  a very simple one liner is JSON parse JSON stringify object      x000D   x000D  const a     x000D    string   string   x000D    number  123  x000D    bool  false  x000D    nul  null  x000D    date  new Date        stringified x000D    undef  undefined      lost x000D    inf  Infinity      forced to  null  x000D    x000D  console log a   x000D  console log typeof a date       Date object x000D  const clone   JSON parse JSON stringify a    x000D  console log clone   x000D  console log typeof clone date       result of  toISOString   x000D   x000D   x000D    This works for all kind of objects containing objects  arrays  strings  booleans and numbers   See also this article about the structured clone algorithm of browsers which is used when posting messages to and from a worker  It also contains a function for deep cloning

User · Answer

OK  imagine you have this object below and you want to clone it   let obj    a 1  b 2  c 3     ES6   or  var obj    a 1  b 2  c 3     ES5   the answer is mainly depeneds on which ECMAscript you using  in ES6   you can simply use Object assign to do the clone   let cloned   Object assign     obj     new  a 1  b 2  c 3     or using spread operator like this   let cloned       obj     new  a 1  b 2  c 3     But if you using ES5  you can use few methods  but the JSON stringify  just make sure you not using for a big chunk of data to copy  but it could be one line handy way in many cases  something like this   let cloned   JSON parse JSON stringify obj       new  a 1  b 2  c 3    can be handy  but avoid using on big chunk of data over and over

User · Answer

In my code I frequently define a function     to handle copies so that I can pass by value to functions  This code creates a deep copy but maintains inheritance  It also keeps track of sub-copies so that self-referential objects can be copied without an infinite loop  Feel free to use it   It might not be the most elegant  but it hasn t failed me yet       function oReferance      var aReferances   new Array      var getPrototypeOf   function oObject        if typeof Object getPrototypeOf     undefined   return Object getPrototypeOf oObject       var oTest   new Object        if typeof oObject   proto       undefined  amp  amp typeof oTest   proto       undefined  amp  amp oTest   proto     Object prototype  return oObject   proto        if typeof oObject constructor     undefined  amp  amp typeof oTest constructor     undefined  amp  amp oTest constructor   Object amp  amp typeof oObject constructor prototype     undefined   return oObject constructor prototype      return Object prototype         var recursiveCopy   function oSource        if typeof oSource     object   return oSource      if oSource   null  return null      for var i 0 i lt aReferances length i    if aReferances i  0    oSource  return aReferances i  1       var Copy   new Function        Copy prototype   getPrototypeOf oSource       var oCopy   new Copy        aReferances push  oSource oCopy        for sPropertyName in oSource  if oSource hasOwnProperty sPropertyName   oCopy sPropertyName    recursiveCopy oSource sPropertyName        return oCopy         return recursiveCopy oReferance          Examples  Wigit   function      Wigit prototype bInThePrototype   true  A   new Wigit    A nCoolNumber   7  B     A   B nCoolNumber   8     A nCoolNumber is still 7 B bInThePrototype    true B instanceof Wigit    true

User · Answer

Structured Cloning  The HTML standard includes an internal structured cloning serialization algorithm that can create deep clones of objects  It is still limited to certain built-in types  but in addition to the few types supported by JSON it also supports Dates  RegExps  Maps  Sets  Blobs  FileLists  ImageDatas  sparse Arrays  Typed Arrays  and probably more in the future  It also preserves references within the cloned data  allowing it to support cyclical and recursive structures that would cause errors for JSON   Support in Node js  Experimental   The v8 module in Node js currently  as of Node 11  exposes the structured serialization API directly  but this functionality is still marked as  experimental   and subject to change or removal in future versions  If you re using a compatible version  cloning an object is as simple as   const v8   require  v8     const structuredClone   obj   gt      return v8 deserialize v8 serialize obj         Direct Support in Browsers  Maybe Eventually    Browsers do not currently provide a direct interface for the structured cloning algorithm  but a global structuredClone   function has been discussed in whatwg html 793 on GitHub  As currently proposed  using it for most purposes would be as simple as   const clone   structuredClone original     Unless this is shipped  browsers  structured clone implementations are only exposed indirectly   Asynchronous Workaround  Usable    The lower-overhead way to create a structured clone with existing APIs is to post the data through one port of a MessageChannels  The other port will emit a message event with a structured clone of the attached  data  Unfortunately  listening for these events is necessarily asynchronous  and the synchronous alternatives are less practical   class StructuredCloner     constructor         this pendingClones    new Map        this nextKey    0       const channel   new MessageChannel        this inPort    channel port1      this outPort    channel port2       this outPort  onmessage     data   key  value      gt          const resolve   this pendingClones  get key         resolve value         this pendingClones  delete key              this outPort  start           cloneAsync value        return new Promise resolve   gt          const key   this nextKey           this pendingClones  set key  resolve         this inPort  postMessage  key  value                   const structuredCloneAsync   window structuredCloneAsync       StructuredCloner prototype cloneAsync bind new StructuredCloner     Example Use   const main   async      gt      const original     date  new Date    number  Math random        original self   original     const clone   await structuredCloneAsync original         They re different objects    console assert original     clone     console assert original date     clone date         They re cyclical    console assert original self     original     console assert clone self     clone         They contain equivalent values    console assert original number     clone number     console assert Number original date      Number clone date       console log  Assertions complete         main      Synchronous Workarounds  Awful    There are no good options for creating structured clones synchronously  Here are a couple of impractical hacks instead   history pushState   and history replaceState   both create a structured clone of their first argument  and assign that value to history state  You can use this to create a structured clone of any object like this   const structuredClone   obj   gt      const oldState   history state    history replaceState obj  null     const clonedObj   history state    history replaceState oldState  null     return clonedObj       Example Use    x000D   x000D   use strict   x000D   x000D  const main        gt    x000D    const original     date  new Date    number  Math random      x000D    original self   original  x000D   x000D    const clone   structuredClone original   x000D     x000D       They re different objects  x000D    console assert original     clone   x000D    console assert original date     clone date   x000D   x000D       They re cyclical  x000D    console assert original self     original   x000D    console assert clone self     clone   x000D   x000D       They contain equivalent values  x000D    console assert original number     clone number   x000D    console assert Number original date      Number clone date    x000D     x000D    console log  Assertions complete     x000D     x000D   x000D  const structuredClone   obj   gt    x000D    const oldState   history state  x000D    history replaceState obj  null   x000D    const clonedObj   history state  x000D    history replaceState oldState  null   x000D    return clonedObj  x000D     x000D   x000D  main    x000D   x000D   x000D    Though synchronous  this can be extremely slow  It incurs all of the overhead associated with manipulating the browser history  Calling this method repeatedly can cause Chrome to become temporarily unresponsive   The Notification constructor creates a structured clone of its associated data  It also attempts to display a browser notification to the user  but this will silently fail unless you have requested notification permission  In case you have the permission for other purposes  we ll immediately close the notification we ve created   const structuredClone   obj   gt      const n   new Notification      data  obj  silent  true      n onshow   n close bind n     return n data       Example Use    x000D   x000D   use strict   x000D   x000D  const main        gt    x000D    const original     date  new Date    number  Math random      x000D    original self   original  x000D   x000D    const clone   structuredClone original   x000D     x000D       They re different objects  x000D    console assert original     clone   x000D    console assert original date     clone date   x000D   x000D       They re cyclical  x000D    console assert original self     original   x000D    console assert clone self     clone   x000D   x000D       They contain equivalent values  x000D    console assert original number     clone number   x000D    console assert Number original date      Number clone date    x000D     x000D    console log  Assertions complete     x000D     x000D   x000D  const structuredClone   obj   gt    x000D    const n   new Notification      data  obj  silent  true    x000D    n close    x000D    return n data  x000D     x000D   x000D  main    x000D   x000D   x000D

User · Answer

In ES-6 you can simply use Object assign       Ex   let obj    person   Thor Odinson    let clone   Object assign     obj     A good reference is here  https   googlechrome github io samples object-assign-es6

User · Answer

I just wanted to add to all the Object create solutions in this post  that this does not work in the desired way with nodejs    In Firefox the result of  var a     test   test    var b   Object create a   console log b       is    test  test     In nodejs it is

User · Answer

For those using AngularJS  there is also direct method for cloning or extending of the objects in this library   var destination   angular copy source     or  angular copy source  destination     More in angular copy documentation

User · Answer

The following was mainly an integration of  Maciej Bukowski   A  Levy   Jan Turon   Redu s answers  and  LeviRoberts   RobG s comments  many thanks to them      Deep copy      YES   mostly   Shallow copy      NO   except Proxy    I sincerely welcome everyone to test clone    In addition  defineProp   is designed to easily and quickly  re define or copy any type of descriptor   Function   use strict  function clone object             Deep copy objects by value rather than by reference      exception   Proxy          const seen   new WeakMap      return clone object      function clone object        if  object     Object object   return object               Check if the object belongs to a primitive data type         if  object instanceof Node  return object cloneNode true                Clone DOM trees         let  object    The clone of object      switch  object constructor          case Array        case Object           object   cloneObject object          break        case Date           object   new Date  object          break        case Function          const fnStr   String object            object   new Function  return                     function          gt            test fnStr                 function                      fnStr                      copyPropDescs  object  object          break        case RegExp           object   new RegExp object          break        default          switch  Object prototype toString call object constructor                                                  Stem from            case   object Function              class            case   object Undefined             Object create null                object   cloneObject object              break            default                             Proxy               object   object                      return  object         function cloneObject object        if  seen has object   return seen get object                Handle recursive references  circular structures          const  object   Array isArray object                     Object create Object getPrototypeOf object                     Assign   Prototype   for inheritance         seen set object   object                Make   object  the associative mirror of  object          Reflect ownKeys object  forEach key   gt        defineProp  object  key    value  clone object key      object             return  object         function copyPropDescs target  source        Object defineProperties target        Object getOwnPropertyDescriptors source                function defineProp object  key  descriptor       copyFrom           const   configurable   configurable  writable   writable         Object getOwnPropertyDescriptor object  key           configurable  true  writable  true      const test    configurable    Can redefine property      amp  amp    writable     undefined     writable     Can assign to property    if   test    arguments length  lt   2  return test    const basisDesc   Object getOwnPropertyDescriptor copyFrom  key           configurable  true  writable  true      Custom                     or left to native default settings      get    set    value    writable    enumerable    configurable        forEach attr   gt        descriptor attr      undefined  amp  amp         descriptor attr    basisDesc attr            const   get  set  value  writable  enumerable  configurable         descriptor    return Object defineProperty object  key        enumerable  configurable     get    set           get  set      Accessor descriptor           value  writable      Data descriptor             Tests   use strict  const obj0       u  undefined    nul  null    t  true    num  9    str        sym  Symbol  symbol       Symbol  e     Math E    arr    0    1  2      d  new Date      re   f g    get g     return 0      o        n  0      o    f  function     args               f        getAccessorStr object          return             concat               Object values Object getOwnPropertyDescriptors object                filter desc   gt  desc writable     undefined               map desc   gt  Object values desc                      filter prop   gt  typeof prop      function            map String             f0  function f0            f1  function             f2  a   gt  a    a   1       f3       gt  0      f4 params    return param   gt  param   params        f5   a  b    gt     c   0           gt  a   b   c        defineProp obj0   s     set v    this  s   v      defineProp obj0 arr   tint     value    is   non-enumerable       obj0 arr 0  name    nested array    let obj1   clone obj0  obj1 o n   1 obj1 o o g   function g a   0  b   0    return a   b   obj1 arr 1  1    3 obj1 d setTime  obj0 d   60   1000  obj1 arr tint is    enumerable  no  obj1 arr 0  name    a nested arr  defineProp obj1   s     set v    this  s   v   1      defineProp obj1 re   multiline     value  true     console log   n n     -  repeat 2    6       console log   gt   gt   Test - Routinely    console log  obj0  n    JSON stringify obj0   console log  obj1  n    JSON stringify obj1   console log    console log  obj0  n    obj0  console log  obj1  n    obj1  console log    console log  obj0 n        arr tint    obj0 arr tint    n        arr 0  name    obj0 arr 0  name   console log  obj1 n        arr tint    obj1 arr tint    n        arr 0  name    obj1 arr 0  name   console log    console log  Accessor-type descriptor n       of obj0    obj0 f getAccessorStr obj0     n       of obj1    obj1 f getAccessorStr obj1     n       set  obj0  amp  obj1   s     obj0 s   obj1 s   0    n            obj0   obj1    s    obj0  s       obj1  s    console log         obj0 has not been interfered     console log   n n     -  repeat 2    6       console log   gt   gt   Test - Circular structures    obj0 o r      obj0 o r recursion   obj0 o obj0 arr 1    obj0 arr  obj1   clone obj0  console log  obj0  n    obj0  console log  obj1  n    obj1   console log  Clear obj0 s recursion      obj0 o r recursion   null  obj0 arr 1    1   console log     obj0 n        o r    obj0 o r    n        arr    obj0 arr   console log     obj1 n        o r    obj1 o r    n        arr    obj1 arr   console log         obj1 has not been interfered      console log   n n     -  repeat 2    6       console log   gt   gt   Test - Classes    class Person     constructor name        this name   name        class Boy extends Person     Boy prototype sex    M   const boy0   new Boy boy0 hobby     sport   spaceflight     const boy1   clone boy0  boy1 hobby sport    superluminal flight   boy0 name    one  boy1 name    neo   console log  boy0  n    boy0  console log  boy1  n    boy1  console log  boy1 s prototype     boy0 s      Object getPrototypeOf boy1      Object getPrototypeOf boy0      References   Object create     MDN Object defineProperties     MDN Enumerability and ownership of properties   MDN TypeError  cyclic object value   MDN   Language tricks used   Conditionally add prop to object

User · Answer

If you are using TypeScript  need to support older web browsers  and so can t use  Object assign   and aren t using a library with a clone method build in  you can make yourself a combine helper in a few lines of code  It combines objects  and if you have only one  just clones it       Creates a new object that combines the properties of the specified objects     function combine    objs              const combined           objs forEach o   gt  Object keys o  forEach p   gt  combined p    o p         return combined

User · Answer

To handle circular objects that that JSON stringify can t handle  you can bring in a library called JSOG  that serializes and deserializes arbitrary graphs into JSON format    var clone   JSOG parse JSOG stringify original      It might also be interesting to try patching JSOG for cloning with this trick  don t have time at the moment  but if someone wants to give it a shot       Serialize a simple function     foo f   function a    return a   var stringForm   foo f toString       function  a    return a      Deserialize a function    eval  foo f       stringForm    Some conventions  probably in the name of the property  to identify functions vs regular strings would be needed   func f perhaps     Of course if the function calls a second function the second function will need to exist just as it would for the original   The above however is quite dangerous if you are to accept the serialized form from an untrusted source  but then accepting any function in any form from an untrusted source would be dangerous  so if you re interested in cloning functions trust must have already been established  or you re already intent on writing a security flaw     Disclaimer  I have not tested the speed of JSOG stringify parse vs JSON stringify parse  but It does work on the simple  circular  objects I tested it with

User · Answer

You can use functional closure to gain all the benefits of a deep copy  without a deep copy  It s a very different paradigm  but works well  Instead of trying to copy an existing object  just use a function to instantiate a new object when you need one   First  create an function that returns an object  function template       return       values   1  2  3       nest   x   a   a   b   b    y  100           Then create a simple shallow copy function  function copy a  b      Object keys b  forEach function key        a key    b key             Create a new object  and copy the template s properties onto it  var newObject        copy newObject  template       But the above copy step is not necessary  All you need to do is this   var newObject   template      Now that you have a new object  test to see what its properties are   console log Object keys newObject      This displays     values    nest     Yes  those are the newObject s own properties  not references to properties on another object  Let s just check   console log newObject nest x b     This displays    b    The newObject has acquired all of the template object s properties  but is free of any dependency chain   http   jsbin com ISUTIpoC 1 edit js console  I added this example to encourage some debate  so please add some comments

User · Answer

Use deepcopy from npm   Works in both the browser and in node as an npm module     https   www npmjs com package deepcopy  let a   deepcopy b

User · Answer

To do this for any object in JavaScript will not be simple or straightforward  You will run into the problem of erroneously picking up attributes from the object s prototype that should be left in the prototype and not copied to the new instance  If  for instance  you are adding a clone method to Object prototype  as some answers depict  you will need to explicitly skip that attribute  But what if there are other additional methods added to Object prototype  or other intermediate prototypes  that you don t know about  In that case  you will copy attributes you shouldn t  so you need to detect unforeseen  non-local attributes with the hasOwnProperty method   In addition to non-enumerable attributes  you ll encounter a tougher problem when you try to copy objects that have hidden properties  For example  prototype is a hidden property of a function  Also  an object s prototype is referenced with the attribute   proto    which is also hidden  and will not be copied by a for in loop iterating over the source object s attributes  I think   proto   might be specific to Firefox s JavaScript interpreter and it may be something different in other browsers  but you get the picture  Not everything is enumerable  You can copy a hidden attribute if you know its name  but I don t know of any way to discover it automatically   Yet another snag in the quest for an elegant solution is the problem of setting up the prototype inheritance correctly  If your source object s prototype is Object  then simply creating a new general object with    will work  but if the source s prototype is some descendant of Object  then you are going to be missing the additional members from that prototype which you skipped using the hasOwnProperty filter  or which were in the prototype  but weren t enumerable in the first place  One solution might be to call the source object s constructor property to get the initial copy object and then copy over the attributes  but then you still will not get non-enumerable attributes  For example  a Date object stores its data as a hidden member   function clone obj        if  null    obj     object     typeof obj  return obj      var copy   obj constructor        for  var attr in obj            if  obj hasOwnProperty attr   copy attr    obj attr             return copy     var d1   new Date        Executes function after 5 seconds     setTimeout function        var d2   clone d1       alert  d1       d1 toString       nd2       d2 toString        5000     The date string for d1 will be 5 seconds behind that of d2  A way to make one Date the same as another is by calling the setTime method  but that is specific to the Date class  I don t think there is a bullet-proof general solution to this problem  though I would be happy to be wrong   When I had to implement general deep copying I ended up compromising by assuming that I would only need to copy a plain Object  Array  Date  String  Number  or Boolean  The last 3 types are immutable  so I could perform a shallow copy and not worry about it changing  I further assumed that any elements contained in Object or Array would also be one of the 6 simple types in that list  This can be accomplished with code like the following   function clone obj        var copy          Handle the 3 simple types  and null or undefined     if  null    obj     object     typeof obj  return obj          Handle Date     if  obj instanceof Date            copy   new Date            copy setTime obj getTime             return copy                Handle Array     if  obj instanceof Array            copy               for  var i   0  len   obj length  i  lt  len  i                  copy i    clone obj i                      return copy                Handle Object     if  obj instanceof Object            copy               for  var attr in obj                if  obj hasOwnProperty attr   copy attr    clone obj attr                      return copy             throw new Error  Unable to copy obj  Its type isn t supported         The above function will work adequately for the 6 simple types I mentioned  as long as the data in the objects and arrays form a tree structure  That is  there isn t more than one reference to the same data in the object  For example      This would be cloneable  var tree          left        left    null   right    null   data    3         right    null       data     8        This would kind-of work  but you would get 2 copies of the     inner node instead of 2 references to the same copy var directedAcylicGraph          left        left    null   right    null   data    3         data     8    directedAcyclicGraph  right     directedAcyclicGraph  left        Cloning this would cause a stack overflow due to infinite recursion  var cyclicGraph          left        left    null   right    null   data    3         data     8    cyclicGraph  right     cyclicGraph    It will not be able to handle any JavaScript object  but it may be sufficient for many purposes as long as you don t assume that it will just work for anything you throw at it

User · Answer

The solution JSON parse JSON stringify orig obj  as stated by many peers here for deep cloning has several issues which I found  and they are listed below    It discards the entries while copying whose values are undefined in the original object  If there are some values like Infinity  NaN etc  they will be converted into null while copying  If there is a Date type in the original object  it will be stringified in the cloned object  typeof date entry -- gt  string       Found an effective way for cloning an object  and it worked well for me in all sort of scenarios  Please have a look at below code  as it has resolved all above mentioned pitfalls of JSON parse       yet resulting in proper deep-cloning   var orig obj       string   my str     number  123    bool  false    nul  null    nested         value   true        nan   NaN    date  new Date       undef  undefined    inf  Infinity    console log  original obj before modification     orig obj    n    console log typeof orig obj date    n     var clone obj   Object assign     orig obj      this below loop will help in deep cloning and solving above issues for let prop in orig obj        if typeof orig obj prop       object             if orig obj prop  instanceof Date              clone obj prop    orig obj prop           else               clone obj prop    JSON parse JSON stringify orig obj prop                        console log  cloned obj before modification     orig obj    n     clone obj bool   true  clone obj nested value    false    console log  original obj post modification     orig obj    n    console log  cloned obj post modification     clone obj    n    console log typeof clone obj date

User · Answer

let clone   Object assign  Object create  Object getPrototypeOf obj    obj    ES6 solution if you want to  shallow  clone a class instance and not just a property object

User · Answer

New answer to an old question   If you have the pleasure of having using ECMAScript 2016  ES6  with Spread Syntax  it s easy   keepMeTheSame    first   Me    second   You     cloned       keepMeTheSame    This provides a clean method for a shallow copy of an object   Making a deep copy  meaning makign a new copy of every value in every recursively nested object  requires on of the heavier solutions above   JavaScript keeps evolving

User · Answer

Ok  I know it has many answers  but no one pointed out  EcmaScript5 has assign method  work on FF and Chrome  it copies enumerable and own properties and  Symbols   Object Assign

User · Answer

Update 06 July 2020 There are three  3  ways to clone objects in JavaScript  As objects in JavaScript are reference values  you can t simply just copy using the    The ways are  const food     food   apple   drink   milk         1  Using the  quot Spread quot     ------------------       food        2  Using  quot Object assign quot     ------------------  Object assign     food       3   quot JSON quot     ------------------  JSON parse JSON stringify food       RESULT       food   apple   drink   milk      Hope that this can be used as a reference summary

User · Answer

Simple  var restore     name  charlesi   age 9  var prev data    name   charles  age   10    var temp   JSON stringify prev data  restore   JSON parse temp   restore     name  charlie   age   12    output prev data     name   charles  age   10

User · Answer

With jQuery  you can shallow copy with extend   var copiedObject   jQuery extend     originalObject    subsequent changes to the copiedObject will not affect the originalObject  and vice versa   Or to make a deep copy   var copiedObject   jQuery extend true      originalObject

User · Answer

Object copy using            bad const original     a  1  b  2    const copy   Object assign     original    c  3        copy   gt    a  1  b  2 c  3      good const originalObj     id  5  name   San Francisco    const copyObject       originalObj  pincode  4444   console log copyObject       id  5  name   San Francisco   pincode  4444     Same can be use for copying array from one to other   const itemsCopy       items

User · Answer

In ECMAScript 6 there is Object assign method  which copies values of all enumerable own properties from one object to another  For example   var x    myProp   value    var y   Object assign     x      But be aware that nested objects are still copied as reference

User · Answer

Per MDN    If you want shallow copy  use Object assign     a  For  deep  copy  use JSON parse JSON stringify a     There is no need for external libraries but you need to check browser compatibility first

User · Answer

I m providing an answer to this question  because I do not see any native  recursive implementations here that resolve the problem of DOM elements   The problem there is that  lt element gt  has parent and child attributes  that link to other elements with parent and child values  which point back to the original  lt element gt   causing either an infinite recursive or cyclic redundancy   If your object is something safe and simple like         123  456        then any other answer here will probably work   But if you have            123   lt reactJSComponent gt        456  document createElement  div           then you need something like this          cloneVariable     Clone variable  return null for elements or components  var cloneVariable   function  args        const variable   args variable       if variable     null                return null             if typeof variable       object                 if variable instanceof HTMLElement    variable nodeType  gt  0                        return null                             if Array isArray variable                         var arrayclone                            variable forEach  element    gt                                arrayclone push cloneVariable   variable  element                                                  return arrayclone                             var objectclone                    Object keys variable  forEach  field    gt                        objectclone field    cloneVariable   variable  variable field                                  return objectclone             return variable

User · Answer

If there are no circular dependencies in your object  I suggest using one of the other answers or jQuery s copy methods  as they all seem quite effective   If there are circular dependencies  i e   two sub-objects link to each other   you are kind of screwed as there is  from a theoretical perspective  no way to solve this issue elegantly

User · Answer

I ve written my own implementation  Not sure if it counts as a better solution          a function for deep cloning objects that contains other nested objects and circular structures      objects are stored in a 3D array  according to their length  number of properties  and their depth in the original object                                      index  z                                                                                                                                                                                                                                                                                         depth  x                                                                                                                                                                                                                                                                                                                                                                                                                                                                ------------------             object length  y            Following is the implementation   function deepClone obj        var depth   -1      var arr           return clone obj  arr  depth                 param obj source object     param arr 3D array to store the references to objects     param depth depth of the current object relative to the passed  obj      returns         function clone obj  arr  depth       if  typeof obj      object             return obj             var length   Object keys obj  length     native method to get the number of properties in  obj       var result   Object create Object getPrototypeOf obj       inherit the prototype of the original object     if result instanceof Array           result length   length             depth       depth is increased because we entered an object here      arr depth           this is the x-axis  each index here is the depth     arr depth  length           this is the y-axis  each index is the length of the object  aka number of props         start the depth at current and go down  cyclic structures won t form on depths more than the current one     for var x   depth  x  gt   0  x--              loop only if the array at this depth and length already have elements         if arr x  length                for var index   0  index  lt  arr x  length  length  index                     if obj     arr x  length  index                        return obj                                                       arr depth  length  push obj      store the object in the array at the current depth and length     for  var prop in obj            if  obj hasOwnProperty prop   result prop    clone obj prop   arr  depth              return result

User · Answer

creates  clone  method on context object        var         clon   Object clone  anyValue          function  propertyName  definition        this propertyName    definition       call      Object       clone       function              function isfn fn                return typeof fn      function                      function isobj o                return o     Object o                      function isarray o                return Object prototype toString call o        object Array                       function fnclon fn                return function                      fn apply this  arguments                                     function owns obj  p                return obj hasOwnProperty p                      function isemptyobj obj                for  var p in obj                    return false                            return true                     function isObject o                return Object prototype toString call o        object Object                      return function  input                if  isfn input                     return fnclon input                 else if  isobj input                     var cloned                       for  var p in input                        owns Object prototype  p                                                   isfn input p                            amp  amp    cloned p    function      return input p  apply input  arguments                                    cloned p    input p                                                             if  isarray input                         cloned length   input length                       concat every filter forEach indexOf join lastIndexOf map pop push reduce reduceRight reverse shift slice some sort splice toLocaleString toString unshift                       split                           forEach                        function  methodName                            isfn  Array prototype methodName                             amp  amp                                cloned methodName                                function                                      return Array prototype methodName  apply cloned  arguments                                                                                                                                             return isemptyobj cloned                                                       isObject input                              cloned                             input                                                    cloned                else                   return input

User · Answer

According to the Airbnb JavaScript Style Guide with 404 contributors      Prefer the object spread operator over Object assign to shallow-copy   objects  Use the object rest operator to get a new object with certain   properties omitted       very bad const original     a  1  b  2    const copy   Object assign original    c  3        this mutates  original      delete copy a     so does this     bad const original     a  1  b  2    const copy   Object assign     original    c  3        copy   gt    a  1  b  2  c  3       good const original     a  1  b  2    const copy        original  c  3       copy   gt    a  1  b  2  c  3    const   a     noA     copy     noA   gt    b  2  c  3     Also I d like to warn you that even though Airbnb hardly recommends the object spread operator approach  Keep in mind that Microsoft Edge still does not support this 2018 feature yet   ES2016  Compat table

User · Answer

I don t know which cases this doesn t work for  but it got me a copy of an array  I think its cute    Hope it helps  copiedArr   origArr filter function x  return true

User · Answer

Since mindeavor stated that the object to be cloned is a  literal-constructed  object  a solution might be to simply generate the object multiple times rather than cloning an instance of the object   function createMyObject         var myObject                                return myObject     var myObjectInstance1   createMyObject    var myObjectInstance2   createMyObject

User · Answer

Interested in cloning simple objects   JSON parse JSON stringify json original     Source   How to copy JavaScript object to new variable NOT by reference

User · Answer

You can clone an object and remove any reference from the previous one using a single line of code  Simply do   var obj1     text   moo1     var obj2   Object create obj1      Creates a new clone without references  obj2 text    moo2      Only updates obj2 s text property  console log obj1  obj2      Outputs  obj1   text  moo1    obj2   text  moo2     For browsers   engines that do not currently support Object create you can use this polyfill      Polyfill Object create if it does not exist if   Object create        Object create   function  o            var F   function                F prototype   o          return new F

User · Answer

Consult http   www w3 org html wg drafts html master infrastructure html safe-passing-of-structured-data for the W3C s  Safe passing of structured data  algorithm  intended to be implemented by browsers for passing data to eg web workers  However  it has some limitations  in that it does not handle functions  See https   developer mozilla org en-US docs DOM The structured clone algorithm for more information  including an alternative algorithm in JS which gets you part of the way there

User · Answer

Performance  Today 2020 04 30 I perform tests of chosen solutions on Chrome v81 0  Safari v13 1 and Firefox v75 0 on MacOs High Sierra v10 13 6    I focus on speed of copy DATA  object with simple type fields  not methods etc    The solutions A-I can make only shallow copy  solutions J-U can make deep copy   Results for shallow copy   solution     obj   A  is fastest on chrome and firefox and medium fast on safari solution based on Object assign  B  is fast on all browsers jQuery  E  and lodash  F G H  solutions are medium quite fast solution JSON parse stringify  K  is quite slow solutions D and U are slow on all browsers     Results for deep copy   solution Q is fastest on all browsers jQuery  L  and lodash  J  are medium fast solution JSON parse stringify  K  is quite slow solution U is slowest on all browsers lodash  J  and solution U crash on Chrome for 1000 level deep object     Details  For choosen solutions   A  B C my  D E F G H I J K L M N O P Q R S T U   I perform 4 tests   shallow-small  object with 10 non-nested fields - you can run it HERE shallow-big  object with 1000 non-nested fields - you can run it HERE deep-small  object with 10 levels-nested fields - you can run it HERE deep-big  object with 1000 levels-nested fields - you can run it HERE   Objects used in tests are show in below snippet   x000D   x000D  let obj ShallowSmall     x000D    field0  false  x000D    field1  true  x000D    field2  1  x000D    field3  0  x000D    field4  null  x000D    field5      x000D    field6      x000D    field7   text7   x000D    field8   text8   x000D    x000D   x000D  let obj DeepSmall     x000D    level0    x000D     level1    x000D      level2    x000D       level3    x000D        level4    x000D         level5    x000D          level6    x000D           level7    x000D            level8    x000D             level9             abc             x000D               x000D     x000D   x000D  let obj ShallowBig   Array 1000  fill 0  reduce  a c i    gt   a  field  i  getField i  a        x000D   x000D   x000D  let obj DeepBig   genDeepObject 1000   x000D   x000D   x000D   x000D     ------------------ x000D     Show objects x000D     ------------------ x000D   x000D  console log  obj ShallowSmall   JSON stringify obj ShallowSmall    x000D  console log  obj DeepSmall   JSON stringify obj DeepSmall    x000D  console log  obj ShallowBig   JSON stringify obj ShallowBig    x000D  console log  obj DeepBig   JSON stringify obj DeepBig    x000D   x000D   x000D   x000D   x000D     ------------------ x000D     HELPERS x000D     ------------------ x000D   x000D  function getField k    x000D    let i k 10  x000D    if i  0  return false  x000D    if i  1  return true  x000D    if i  2  return k  x000D    if i  3  return 0  x000D    if i  4  return null  x000D    if i  5  return     x000D    if i  6  return       x000D    if i gt  7  return  text  k  x000D    x000D   x000D  function genDeepObject N    x000D       generate   level0  level1     levelN   end       N-times     abc                   x000D    let obj     x000D    let o obj  x000D    let arr       x000D    let a arr  x000D   x000D    for let i 0  i lt N  i      x000D      o  level  i      x000D      o o  level  i   x000D      let aa     x000D      a push aa   x000D      a aa  x000D      x000D   x000D    a 0   abc   x000D    o  end   arr  x000D    return obj  x000D    x000D   x000D   x000D    Below snippet presents tested solutions and shows differences between them   x000D   x000D  function A obj    x000D    return     obj  x000D    x000D   x000D  function B obj    x000D    return Object assign     obj    x000D    x000D   x000D  function C obj    x000D    return Object keys obj  reduce   a c    gt   a c  obj c   a       x000D    x000D   x000D  function D obj    x000D    let copyOfObject       x000D    Object defineProperties copyOfObject  Object getOwnPropertyDescriptors obj    x000D    return copyOfObject  x000D    x000D   x000D  function E obj    x000D    return jQuery extend     obj     shallow x000D    x000D   x000D  function F obj    x000D    return   clone obj   x000D    x000D   x000D  function G obj    x000D    return   clone obj true   x000D    x000D   x000D  function H obj    x000D    return   extend    obj   x000D    x000D   x000D  function I obj    x000D      if  null    obj     object     typeof obj  return obj  x000D      var copy   obj constructor    x000D      for  var attr in obj    x000D          if  obj hasOwnProperty attr   copy attr    obj attr   x000D        x000D      return copy  x000D    x000D   x000D  function J obj    x000D    return   cloneDeep obj true   x000D    x000D   x000D  function K obj    x000D   return JSON parse JSON stringify obj    x000D    x000D   x000D  function L obj    x000D    return jQuery extend true      obj     deep x000D    x000D   x000D  function M obj    x000D    if obj    null    typeof obj      object   x000D      return obj      x000D    var temp   new obj constructor     x000D    for var key in obj  x000D      temp key    M obj key        x000D    return temp  x000D    x000D   x000D  function N obj    x000D    let EClone   function obj    x000D      var newObj    obj instanceof Array             x000D      for  var i in obj    x000D        if  i     EClone   continue  x000D        if  obj i   amp  amp  typeof obj i      object     x000D          newObj i    EClone obj i    x000D          else newObj i    obj i  x000D        return newObj  x000D       x000D   x000D   return EClone obj   x000D     x000D   x000D  function O obj    x000D      if  obj    null    typeof obj     object   return obj  x000D      if  obj constructor    Object  amp  amp  obj constructor    Array  return obj  x000D      if  obj constructor    Date    obj constructor    RegExp    obj constructor    Function    x000D          obj constructor    String    obj constructor    Number    obj constructor    Boolean  x000D          return new obj constructor obj   x000D   x000D      let to   new obj constructor    x000D   x000D      for  var name in obj  x000D        x000D          to name    typeof to name      undefined    O obj name   null    to name   x000D        x000D   x000D      return to  x000D    x000D   x000D  function P obj    x000D    function clone target  source   x000D   x000D        for let key in source   x000D   x000D               Use getOwnPropertyDescriptor instead of source key  to prevent from trigering setter getter  x000D            let descriptor   Object getOwnPropertyDescriptor source  key   x000D            if descriptor value instanceof String   x000D                target key    new String descriptor value   x000D              x000D            else if descriptor value instanceof Array   x000D                target key    clone     descriptor value   x000D              x000D            else if descriptor value instanceof Object   x000D                let prototype   Reflect getPrototypeOf descriptor value   x000D                let cloneObject   clone     descriptor value   x000D                Reflect setPrototypeOf cloneObject  prototype   x000D                target key    cloneObject  x000D              x000D            else   x000D                Object defineProperty target  key  descriptor   x000D              x000D          x000D        let prototype   Reflect getPrototypeOf source   x000D        Reflect setPrototypeOf target  prototype   x000D        return target  x000D      x000D    return clone    obj   x000D    x000D   x000D  function Q obj    x000D      var copy  x000D   x000D         Handle the 3 simple types  and null or undefined x000D      if  null    obj     object     typeof obj  return obj  x000D   x000D         Handle Date x000D      if  obj instanceof Date    x000D          copy   new Date    x000D          copy setTime obj getTime     x000D          return copy  x000D        x000D   x000D         Handle Array x000D      if  obj instanceof Array    x000D          copy       x000D          for  var i   0  len   obj length  i  lt  len  i      x000D              copy i    Q obj i    x000D            x000D          return copy  x000D        x000D   x000D         Handle Object x000D      if  obj instanceof Object    x000D          copy       x000D          for  var attr in obj    x000D              if  obj hasOwnProperty attr   copy attr    Q obj attr    x000D            x000D          return copy  x000D        x000D   x000D      throw new Error  Unable to copy obj  Its type isn t supported     x000D    x000D   x000D  function R obj    x000D      const gdcc      getDeepCircularCopy     x000D      if  obj     Object obj     x000D          return obj     primitive value x000D        x000D   x000D      var set   gdcc in obj  x000D          cache   obj gdcc   x000D          result  x000D      if  set  amp  amp  typeof cache     function     x000D          return cache    x000D        x000D         else x000D      obj gdcc    function     return result        overwrite x000D      if  obj instanceof Array    x000D          result       x000D          for  var i 0  i lt obj length  i      x000D              result i    R obj i    x000D            x000D        else   x000D          result       x000D          for  var prop in obj  x000D              if  prop    gdcc  x000D                  result prop    R obj prop    x000D              else if  set  x000D                  result prop    R cache   x000D        x000D      if  set    x000D          obj gdcc    cache     reset x000D        else   x000D          delete obj gdcc      unset again x000D        x000D      return result  x000D    x000D   x000D  function S obj    x000D      const cache   new WeakMap       Map of old - new references x000D   x000D      function copy object    x000D          if  typeof object      object     x000D              object     null    x000D              object instanceof HTMLElement x000D            x000D              return object     primitive value or HTMLElement x000D   x000D          if  object instanceof Date   x000D              return new Date   setTime object getTime     x000D   x000D          if  object instanceof RegExp   x000D              return new RegExp object source  object flags   x000D   x000D          if  cache has object    x000D              return cache get object   x000D   x000D          const result   object instanceof Array            x000D   x000D          cache set object  result      store reference to object before the recursive starts x000D   x000D          if  object instanceof Array    x000D              for const o of object    x000D                   result push copy o    x000D                x000D              return result  x000D            x000D   x000D          const keys   Object keys object    x000D   x000D          for  const key of keys  x000D              result key    copy object key    x000D   x000D          return result  x000D        x000D   x000D      return copy obj   x000D    x000D   x000D  function T obj   x000D      var clonedObjectsArray       x000D      var originalObjectsArray         used to remove the unique ids when finished x000D      var next objid   0  x000D   x000D      function objectId obj    x000D          if  obj    null  return null  x000D          if  obj   obj id    undefined   x000D              obj   obj id   next objid    x000D              originalObjectsArray obj   obj id    obj  x000D            x000D          return obj   obj id  x000D        x000D   x000D      function cloneRecursive obj    x000D          if  null    obj    typeof obj     string     typeof obj     number     typeof obj     boolean   return obj  x000D   x000D             Handle Date x000D          if  obj instanceof Date    x000D              var copy   new Date    x000D              copy setTime obj getTime     x000D              return copy  x000D            x000D   x000D             Handle Array x000D          if  obj instanceof Array    x000D              var copy       x000D              for  var i   0  i  lt  obj length    i    x000D                  copy i    cloneRecursive obj i    x000D                x000D              return copy  x000D            x000D   x000D             Handle Object x000D          if  obj instanceof Object    x000D              if  clonedObjectsArray objectId obj      undefined  x000D                  return clonedObjectsArray objectId obj    x000D   x000D              var copy  x000D              if  obj instanceof Function   Handle Function x000D                  copy   function   return obj apply this  arguments     x000D              else x000D                  copy       x000D   x000D              clonedObjectsArray objectId obj     copy  x000D   x000D              for  var attr in obj  x000D                  if  attr       obj id   amp  amp  obj hasOwnProperty attr   x000D                      copy attr    cloneRecursive obj attr                     x000D   x000D              return copy  x000D                   x000D   x000D   x000D          throw new Error  Unable to copy obj  Its type isn t supported     x000D        x000D      var cloneObj   cloneRecursive obj   x000D   x000D   x000D   x000D        remove the unique ids x000D      for  var i   0  i  lt  originalObjectsArray length  i    x000D        x000D          delete originalObjectsArray i    obj id  x000D         x000D   x000D      return cloneObj  x000D    x000D   x000D  function U obj    x000D       x000D      Deep copy objects by value rather than by reference  x000D      exception   Proxy  x000D       x000D   x000D    const seen   new WeakMap   x000D   x000D    return clone obj  x000D   x000D    function defineProp object  key  descriptor       copyFrom         x000D      const   configurable   configurable  writable   writable   x000D          Object getOwnPropertyDescriptor object  key  x000D             configurable  true  writable  true   x000D   x000D      const test    configurable    Can redefine property x000D         amp  amp    writable     undefined     writable     Can assign to property x000D   x000D      if   test    arguments length  lt   2  return test x000D   x000D      const basisDesc   Object getOwnPropertyDescriptor copyFrom  key  x000D             configurable  true  writable  true      Custom    x000D                     or left to native default settings x000D   x000D        get    set    value    writable    enumerable    configurable   x000D         forEach attr   gt  x000D          descriptor attr      undefined  amp  amp  x000D           descriptor attr    basisDesc attr   x000D          x000D   x000D      const   get  set  value  writable  enumerable  configurable   x000D          descriptor x000D   x000D      return Object defineProperty object  key    x000D        enumerable  configurable     get    set x000D              get  set      Accessor descriptor x000D              value  writable      Data descriptor x000D         x000D      x000D   x000D    function clone object    x000D      if  object     Object object   return object    x000D             Check if the object belongs to a primitive data type    x000D   x000D      if  object instanceof Node  return object cloneNode true     x000D             Clone DOM trees    x000D   x000D      let  object    The clone of object x000D   x000D      switch  object constructor    x000D        case Array  x000D        case Object  x000D           object   cloneObject object  x000D          break x000D   x000D        case Date  x000D           object   new Date  object  x000D          break x000D   x000D        case Function  x000D          const fnStr   String object  x000D   x000D           object   new Function  return     x000D                  function          gt            test fnStr  x000D                 function        x000D                fnStr x000D              x000D   x000D          copyPropDescs  object  object  x000D          break x000D   x000D        case RegExp  x000D           object   new RegExp object  x000D          break x000D   x000D        default  x000D          switch  Object prototype toString call object constructor     x000D                                               Stem from  x000D            case   object Function              class  x000D            case   object Undefined             Object create null   x000D               object   cloneObject object  x000D              break x000D   x000D            default                             Proxy  x000D               object   object x000D            x000D        x000D   x000D      return  object x000D      x000D   x000D   x000D    function cloneObject object    x000D      if  seen has object   return seen get object     x000D             Handle recursive references  circular structures     x000D   x000D      const  object   Array isArray object  x000D             x000D          Object create Object getPrototypeOf object      x000D                 Assign   Prototype   for inheritance    x000D   x000D      seen set object   object     x000D             Make   object  the associative mirror of  object     x000D   x000D      Reflect ownKeys object  forEach key   gt  x000D        defineProp  object  key    value  clone object key      object  x000D        x000D   x000D      return  object x000D      x000D   x000D   x000D    function copyPropDescs target  source    x000D      Object defineProperties target  x000D        Object getOwnPropertyDescriptors source  x000D        x000D      x000D    x000D    x000D     ------------------------ x000D     Test properties x000D     ------------------------ x000D   x000D   x000D  console log    shallow deep  func  circ  undefined date  RegExp bigInt   x000D   x000D  log A   x000D  log B   x000D  log C   x000D  log D   x000D  log E   x000D  log F   x000D  log G   x000D  log H   x000D  log I   x000D  log J   x000D  log K   x000D  log L   x000D  log M   x000D  log N   x000D  log O   x000D  log P   x000D  log Q   x000D  log R   x000D  log S   x000D  log T   x000D  log U   x000D   x000D  console log    shallow deep  func  circ  undefined date  RegExp bigInt x000D  ---- x000D  LEGEND  x000D  shallow - solution create shallow copy x000D  deep - solution create deep copy x000D  func - solution copy functions x000D  circ - solution can copy object with circular references x000D  undefined - solution copy fields with undefined value x000D  date - solution can copy date x000D  RegExp - solution can copy fields with regular expressions x000D  bigInt - solution can copy BigInt x000D     x000D   x000D   x000D     ------------------------ x000D     Helper functions x000D     ------------------------ x000D   x000D   x000D  function deepCompare obj1 obj2    x000D    return JSON stringify obj1    JSON stringify obj2   x000D    x000D   x000D  function getCase        pure data case x000D    return    x000D      undef  undefined  x000D      bool  true  num  1  str   txt1       x000D      e1  null  e2      e3      e4  0  e5  false  x000D      arr    false  2   txt3   null          x000D          true 4  txt5  null            true 6  txt7  null           x000D           bool  true num  8  str   txt9   e1 null  e2     e3     e4  0  e5  false  x000D           x000D           bool  true num  10  str   txt11   e1 null  e2     e3     e4  0  e5  false  x000D          x000D      obj     x000D          bool  true  num  12  str   txt13   x000D          e1  null  e2      e3      e4  0  e5  false  x000D          arr   true 14  txt15  null          x000D          obj     x000D            bool  true  num  16  str   txt17   x000D            e1  null  e2      e3      e4  0  e5  false  x000D            arr   true 18  txt19  null          x000D            obj   bool  true num  20  str   txt21   e1 null  e2     e3     e4  0  e5  false  x000D           x000D         x000D       x000D    x000D   x000D  function check org  copy  field  newValue    x000D    copy field    newValue  x000D    return deepCompare org copy    x000D    x000D   x000D  function testFunc f    x000D   let o     a 1  fun   i j   gt  i j    x000D    let c   f o   x000D     x000D    let val   false x000D    try  x000D      val   c fun 3 4   7  x000D      catch e      x000D    return val  x000D     x000D   x000D  function testCirc f    x000D   function Circ     x000D      this me   this  x000D      x000D   x000D    var o     x000D        x   a   x000D        circ  new Circ    x000D        obj circ  null  x000D       x000D     x000D    o obj circ   o  x000D   x000D    let val   false  x000D   x000D    try  x000D      let c   f o     x000D      val    o obj circ    o   amp  amp   o circ    o circ me   x000D      catch e      x000D    return val  x000D     x000D   x000D  function testRegExp f    x000D    let o     x000D      re   a 0-9     x000D       x000D     x000D    let val   false  x000D   x000D    try  x000D      let c   f o     x000D      val    String c re     String  a 0-9       x000D      catch e      x000D    return val  x000D    x000D   x000D  function testDate f    x000D    let o     x000D      date  new Date    x000D       x000D     x000D    let val   false  x000D   x000D    try  x000D      let c   f o     x000D      val     new Date c date      new Date o date    x000D      catch e      x000D    return val  x000D    x000D   x000D  function testBigInt f    x000D    let val   false  x000D     x000D    try  x000D      let o     x000D        big  123n  x000D         x000D     x000D      let c   f o     x000D     x000D      val   o big    c big  x000D      catch e      x000D     x000D    return val  x000D    x000D   x000D  function log f    x000D    let o   getCase        orginal object x000D    let oB   getCase        backup  used for shallow valid test x000D     x000D    let c1   f o      copy 1 for reference x000D    let c2   f o      copy 2 for test shallow values x000D    let c3   f o      copy 3 for test deep values x000D   x000D    let is proper copy   deepCompare c1 o       shoud be true x000D     x000D       shallow changes x000D    let testShallow    x000D          bool  false    num  666    str   xyz     arr        obj        x000D       reduce  acc curr   gt  acc  amp  amp  check c1 c2 curr 0   curr 1    true    x000D     x000D       should be true  original object shoud not have changed shallow fields  x000D    let is valid   deepCompare o oB    x000D   x000D       deep test  intruduce some change  x000D    if  c3 arr 6   c3 arr 6  7  num   777  x000D     x000D    let diff shallow    testShallow     shoud be true  shallow field was copied  x000D    let diff deep    deepCompare c1 c3         shoud be true  deep field was copied  x000D    let can copy functions   testFunc f   x000D    let can copy circular   testCirc f   x000D    let can copy regexp   testRegExp f   x000D    let can copy date   testDate f   x000D    let can copy bigInt   testBigInt f   x000D     x000D    let has undefined    undef  in c1     field with undefined value is copied    x000D    let is ok   is valid  amp  amp  is proper copy  x000D    let b  bool    gt   bool     padEnd 5          bool value to formated string x000D     x000D    testFunc f   x000D     x000D    if is ok    x000D      console log    f name    b diff shallow       b diff deep     b can copy functions     b can copy circular     b has undefined         b can copy date     b can copy regexp      b can copy bigInt     x000D      else   x000D      console log    f name   INVALID   is valid    is proper copy    c1   x000D      x000D     x000D    x000D   lt script src  https   code jquery com jquery-3 5 0 min js  integrity  sha256-xNzN2a4ltkB44Mc Jz3pT4iU1cmeR0FkXs4pru JxaQ   crossorigin  anonymous  gt  lt  script gt  x000D   lt script src  https   cdn jsdelivr net npm lodash 4 17 15 lodash min js  gt  lt  script gt  x000D   x000D  This snippet only presents tested solutions and show differences between them  but it no make performence tests  x000D   x000D   x000D    Below there are example results for Chrome for shallow-big object

User · Answer

I think  that recurrence with caching is the best what we can do it here without libraries   And underestimated WeakMap comes to the problem of cycles  wherein storing  pairs of references to old and new object can help us to recreate pretty easily whole tree   I prevented deep cloning of the DOM elements  probably you don t want to clone entire page     function deepCopy object        const cache   new WeakMap       Map of old - new references      function copy obj            if  typeof obj      object                 obj     null                obj instanceof HTMLElement                       return obj     primitive value or HTMLElement          if  obj instanceof Date               return new Date   setTime obj getTime              if  obj instanceof RegExp               return new RegExp obj source  obj flags            if  cache has obj                return cache get obj            const result   obj instanceof Array                     cache set obj  result      store reference to object before the recursive starts          if  obj instanceof Array                for const o of obj                     result push copy o                              return result                     const keys   Object keys obj             for  const key of keys              result key    copy obj key             return result             return copy object       Some tests       1 const obj1        const obj2        obj1 obj2   obj2  obj2 obj1   obj1     Trivial circular reference  var copy   deepCopy obj1   copy    obj1    false copy obj2     obj1 obj2    false copy obj2 obj1 obj2    and so on - no error  correctly cloned        2 const obj     x  0   const clone   deepCopy   a  obj  b  obj     clone a    clone b    true      3 const arr       arr 0    arr     A little bit weird but who cares clone   deepCopy arr  clone    arr    false  clone 0  0  0  0     clone    true    NOTE  I m using constants  for of loop     operator and WeakMaps to create more essential code  This syntax  ES6  is supported by today s browsers

User · Answer

This is an adaptation of A  Levy s code to also handle the cloning of functions and multiple cyclic references - what this means is that if two properties in the tree which is cloned are references of the same object  the cloned object tree will have these properties point to one and the same clone of the referenced object  This also solves the case of cyclic dependencies which  if left unhandled  leads to an infinite loop  The complexity of the algorithm is O n   function clone obj       var clonedObjectsArray           var originalObjectsArray         used to remove the unique ids when finished     var next objid   0       function objectId obj            if  obj    null  return null          if  obj   obj id    undefined               obj   obj id   next objid                originalObjectsArray obj   obj id    obj                    return obj   obj id             function cloneRecursive obj            if  null    obj    typeof obj     string     typeof obj     number     typeof obj     boolean   return obj              Handle Date         if  obj instanceof Date                var copy   new Date                copy setTime obj getTime                 return copy                        Handle Array         if  obj instanceof Array                var copy                   for  var i   0  i  lt  obj length    i                    copy i    cloneRecursive obj i                              return copy                        Handle Object         if  obj instanceof Object                if  clonedObjectsArray objectId obj      undefined                  return clonedObjectsArray objectId obj                 var copy              if  obj instanceof Function   Handle Function                 copy   function   return obj apply this  arguments                 else                 copy                    clonedObjectsArray objectId obj     copy               for  var attr in obj                  if  attr       obj id   amp  amp  obj hasOwnProperty attr                       copy attr    cloneRecursive obj attr                                  return copy                             throw new Error  Unable to copy obj  Its type isn t supported               var cloneObj   cloneRecursive obj            remove the unique ids     for  var i   0  i  lt  originalObjectsArray length  i                  delete originalObjectsArray i    obj id              return cloneObj      Some quick tests  var auxobj         prop1    prop1 aux val        prop2     prop2 item1    prop2 item2           var obj   new Object    obj prop1    prop1 value   obj prop2    auxobj  auxobj   some extra val   undefined   obj nr   3465  obj bool   true   obj f1   function         this prop1    prop1 val changed by f1       objclone   clone obj      some tests i ve made console log  test number  boolean and string cloning       objclone prop1    obj prop1  amp  amp  objclone nr    obj nr  amp  amp  objclone bool    obj bool     objclone f1    console log  test function cloning 1       objclone prop1     prop1 val changed by f1     objclone f1 prop    some prop   console log  test function cloning 2       obj f1 prop    undefined     objclone prop2 0  prop1    prop1 aux val NEW   console log  test multiple references cloning 1       objclone prop2 1  prop1    objclone prop2 0  prop1    console log  test multiple references cloning 2       objclone prop2 1  prop1    obj prop2 0  prop1

User · Answer

Clone an object based on a template  What do you do if you don t want an exact copy  but you do want the robustness of some kind of reliable clone operation but you only want bits cloned or you want to make sure you can control the existence or format of each attribute value cloned   I am contributing this because it s useful for us and we created it because we could not find something similar  You can use it to clone an object based on a template object which specifies what attributes of the object I want to clone  and the template allows for functions to transform those attributes into something different if they don t exist on the source object or however you want to handle the clone  If it s not useful I am sure someone can delete this answer      function isFunction functionToCheck           var getType              return functionToCheck  amp  amp  getType toString call functionToCheck        object Function             function cloneObjectByTemplate obj  tpl  cloneConstructor           if  typeof cloneConstructor      undefined                cloneConstructor   false                  if  obj    null    typeof  obj      object   return obj            if we have an array  work through it s contents and apply the template to each item           if  Array isArray obj                var ret                  for  var i   0  i  lt  obj length  i                     ret push cloneObjectByTemplate obj i   tpl  cloneConstructor                            return ret                     otherwise we have an object             var temp any          obj constructor       we can t call obj constructor because typescript defines this  so if we are dealing with a typescript object it might reset values         var temp   cloneConstructor   new obj constructor                 for  var key in tpl                 if we are provided with a function to determine the value of this property  call it               if  isFunction tpl key                     temp key    tpl key  obj     assign the result of the function call  passing in the value              else                    if our object has this property                   if  obj key     undefined                       if  Array isArray obj key                             temp key                               for  var i   0  i  lt  obj key  length  i                                 temp key  push cloneObjectByTemplate obj key  i   tpl key   cloneConstructor                                                  else                          temp key    cloneObjectByTemplate obj key   tpl key   cloneConstructor                                                                       return temp         A simple way to call it would be like this   var source            a   whatever          b               x   yeah              y   haha                    var template            a  true    we want to clone  a         b               x  true   we want to clone  b x  too                    var destination   cloneObjectByTemplate source  template     If you wanted to use a function to make sure an attribute is returned or to make sure it s a particular type  use a template like this  Instead of using   ID  true   we are providing a function which still just copies the ID attribute of the source object but it makes sure that it s a number even if it does not exist on the source object    var template         ID  function  srcObj            if srcObj ID    undefined   return -1            return parseInt srcObj ID toString               Arrays will clone fine but if you want to you can have your own function handle those individual attributes too  and do something special like this    var template         tags  function  srcObj            var tags               if  process tags    undefined                for  var i   0  i  lt  process tags length  i                       tags push cloneObjectByTemplate                    srcObj tags i                       a   true  b   true     another template for each item in the array                                                    return tags             So in the above  our template just copies the tags attribute of the source object if it exists   it s assumed to be an array   and for each element in that array the clone function is called to individually clone it based on a second template which just copies the a and b attributes of each of those tag elements    If you are taking objects in and out of node and you want to control which attributes of those objects are cloned then this is a great way of controlling that in node js and the code works in the browser too   Here is an example of it s use  http   jsfiddle net hjchyLt1

User · Answer

function clone obj        var cloneObj   Object create obj        return cloneObj      In Javascript objects individually inherit another object  Prototypal inheritance   Object create obj  returns an object that is a sub-object or child object of obj  In the above function it will effectively return a copy of the object   However  This is a very odd way to clone because I am not using inheritance for its real purpose

User · Answer

A Levy s answer is almost complete  here is my little contribution  there is a way how to handle recursive references  see this line  if this attr   this  copy attr    copy   If the object is XML DOM element  we must use cloneNode instead  if this cloneNode  return this cloneNode true    Inspired by A Levy s exhaustive study and Calvin s prototyping approach  I offer this solution   Object prototype clone   function       if this cloneNode  return this cloneNode true     var copy   this instanceof Array              for var attr in this        if typeof this attr      function     this attr   null     this attr  clone        copy attr    this attr       else if this attr   this  copy attr    copy      else copy attr    this attr  clone          return copy     Date prototype clone   function       var copy   new Date      copy setTime this getTime       return copy     Number prototype clone    Boolean prototype clone   String prototype clone   function       return this      See also Andy Burke s note in the answers

User · Answer

In ECMAScript 2018  let objClone        obj      Be aware that nested objects are still copied as a reference

[javascript] How do I correctly clone a JavaScript object?

Examples related to javascript

Examples related to clone

Examples related to javascript-objects