422,946 Members | 1,099 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 422,946 IT Pros & Developers. It's quick & easy.

Deep Cloning an Object

P: 17
How does one perform a deep clone (by value, not by reference) to an object in JavaScript?
Sep 28 '07 #1
Share this Question
Share on Google+
8 Replies


gits
Expert Mod 5K+
P: 5,167
hi ...

you may use something like the following:

Expand|Select|Wrap|Line Numbers
  1. var a = {
  2.    foo   : { test: 1, test1: 2 },
  3.    bar   : function(a) { alert(a) },
  4.    foobar: 'foobar1'
  5. };
  6.  
  7. function clone_obj(obj) {
  8.     var c = {};
  9.  
  10.     for (var i in obj) {
  11.         var prop = obj[i];
  12.  
  13.         if (typeof prop == 'object') {
  14.            c[i] = clone_obj(prop);
  15.         } else {
  16.            c[i] = prop;
  17.         }
  18.     }
  19.  
  20.     return c;
  21. }
  22.  
  23. var b = clone_obj(a);
  24.  
kind regards

ps: if you encounter problems with that let me know :)
Sep 29 '07 #2

gits
Expert Mod 5K+
P: 5,167
hmm ... we have to improve it for properties that are arrays ... :)
Sep 29 '07 #3

gits
Expert Mod 5K+
P: 5,167
improved version:

Expand|Select|Wrap|Line Numbers
  1. var a = {
  2.    foo   : { test: 1, test1: 2 },
  3.    bar   : function(a) { alert(a) },
  4.    foobar: 'foobar1',
  5.    arr   : [1, 2, 3, 4]
  6. };
  7.  
  8. function clone_obj(obj) {
  9.     var c = {};
  10.  
  11.     for (var i in obj) {
  12.         var prop = obj[i];
  13.  
  14.         if (typeof prop == 'object') {
  15.            if (prop instanceof Array) {
  16.                c[i] = [];
  17.  
  18.                for (var j = 0; j < prop.length; j++) {
  19.                    c[i].push(prop[j]);
  20.                }
  21.            } else {
  22.                c[i] = clone_obj(prop);
  23.            }
  24.         } else {
  25.            c[i] = prop;
  26.         }
  27.     }
  28.  
  29.     return c;
  30. }
  31.  
  32. var b = clone_obj(a);
  33.  
kind regards
Sep 29 '07 #4

gits
Expert Mod 5K+
P: 5,167
arrrgh ... next testcase to check for :)

now the function is to be improved for the case that objects are contained i an array:

Expand|Select|Wrap|Line Numbers
  1. var a = {
  2.    foo   : { test: 1, test1: 2 },
  3.    bar   : function(a) { alert(a) },
  4.    foobar: 'foobar1',
  5.    arr   : [1, [8, 9], {1: 1, 2: 2}, 4]
  6. };
  7.  
  8. function clone_obj(obj) {
  9.     var c = obj instanceof Array ? [] : {};
  10.  
  11.     for (var i in obj) {
  12.         var prop = obj[i];
  13.  
  14.         if (typeof prop == 'object') {
  15.            if (prop instanceof Array) {
  16.                c[i] = [];
  17.  
  18.                for (var j = 0; j < prop.length; j++) {
  19.                    if (typeof prop[j] != 'object') {
  20.                        c[i].push(prop[j]);
  21.                    } else {
  22.                        c[i].push(clone_obj(prop[j]));
  23.                    }
  24.                }
  25.            } else {
  26.                c[i] = clone_obj(prop);
  27.            }
  28.         } else {
  29.            c[i] = prop;
  30.         }
  31.     }
  32.  
  33.     return c;
  34. }
  35.  
  36. var b = clone_obj(a);
  37.  
kind regards
Sep 29 '07 #5

P: 17
arrrgh ... next testcase to check for :)

now the function is to be improved for the case that objects are contained i an array:

Expand|Select|Wrap|Line Numbers
  1. var a = {
  2.    foo   : { test: 1, test1: 2 },
  3.    bar   : function(a) { alert(a) },
  4.    foobar: 'foobar1',
  5.    arr   : [1, [8, 9], {1: 1, 2: 2}, 4]
  6. };
  7.  
  8. function clone_obj(obj) {
  9.     var c = obj instanceof Array ? [] : {};
  10.  
  11.     for (var i in obj) {
  12.         var prop = obj[i];
  13.  
  14.         if (typeof prop == 'object') {
  15.            if (prop instanceof Array) {
  16.                c[i] = [];
  17.  
  18.                for (var j = 0; j < prop.length; j++) {
  19.                    if (typeof prop[j] != 'object') {
  20.                        c[i].push(prop[j]);
  21.                    } else {
  22.                        c[i].push(clone_obj(prop[j]));
  23.                    }
  24.                }
  25.            } else {
  26.                c[i] = clone_obj(prop);
  27.            }
  28.         } else {
  29.            c[i] = prop;
  30.         }
  31.     }
  32.  
  33.     return c;
  34. }
  35.  
  36. var b = clone_obj(a);
  37.  
kind regards

Thanks, but this code gives me an error:
Error: too much recursion

When I try to clone a <td> object...
Sep 29 '07 #6

gits
Expert Mod 5K+
P: 5,167
you cannot clone dom-objects with that ... for that you can use regular dom methods ... cloneNode();

kind regards
Sep 29 '07 #7

P: 17
you cannot clone dom-objects with that ... for that you can use regular dom methods ... cloneNode();

kind regards
This one works.
Thanks :)
Sep 29 '07 #8

gits
Expert Mod 5K+
P: 5,167
hi ...

glad you got it working ... post back to the forum anytime you have more questions ...

kind regards
Sep 29 '07 #9

Post your reply

Sign in to post your reply or Sign up for a free account.