在javascript中深层复制嵌套对象的数组

Question

我试图在javascript中深层复制嵌套对象的数组.我的阵列看起来像这样

var arr = [{name:"adam",age:"21"},
    {name:"freddie",age:"35",children:[{name:"mercury",age:"25"}]},
    {name:"jim",age:"35",children:[{name:"morrison",age:"25",children:[{name:"some", age:"40"}]}]}
    ];

我想对数组中的每个对象进行深层复制,我希望将arr的精确副本创建为不应该有对象引用的新数组.数组的深度也是未知的,即子数组可以达到任何级别.我已经通过这个链接 将一个对象数组复制到另一个数组而没有javascript中的对象引用(深层复制),但这对我没有帮助.我用google搜索并在jQuery中找到了一些解决方案,但这对我没有帮助,因为我对jQuery没有任何了解.

我也尝试用递归实现它,但这也不起作用 http://ideone.com/kJi5X3

我想在不使用jQuery或任何东西的情况下在javascript中完成它.我是JavaScript的新手,所以如果有任何库或简单的方法,我可能会错过.请帮我解决这个问题.提前致谢.

Answer 1

您有两个主要选择:

1. 使用JSON.stringify和JSON.parse:

   var copy = JSON.parse(JSON.stringify(original));
   

   但我从来都不喜欢这样.通过文字,往返是低效的,充其量,它不会处理Date,RegExp,undefined除非你写一个替代品和齐磊正确,值等.

2. 使用递归函数,如下所示:

var toString = Object.prototype.toString;
function deepCopy(obj) {
    var rv;

    switch (typeof obj) {
        case "object":
            if (obj === null) {
                // null => null
                rv = null;
            } else {
                switch (toString.call(obj)) {
                    case "[object Array]":
                        // It's an array, create a new array with
                        // deep copies of the entries
                        rv = obj.map(deepCopy);
                        break;
                    case "[object Date]":
                        // Clone the date
                        rv = new Date(obj);
                        break;
                    case "[object RegExp]":
                        // Clone the RegExp
                        rv = new RegExp(obj);
                        break;
                    // ...probably a few others
                    default:
                        // Some other kind of object, deep-copy its
                        // properties into a new object
                        rv = Object.keys(obj).reduce(function(prev, key) {
                            prev[key] = deepCopy(obj[key]);
                            return prev;
                        }, {});
                        break;
                }
            }
            break;
        default:
            // It's a primitive, copy via assignment
            rv = obj;
            break;
    }
    return rv;
}
var a = [1, {foo: "bar"}, ['a', 'b'], new Date()];
snippet.log(JSON.stringify(a));
var b = deepCopy(a);
snippet.log(JSON.stringify(b));

<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

请注意,上面使用的是所有现代浏览器中都存在的ES5功能,但不包括某些较旧的浏览器,如IE8.但是,对于旧版浏览器,上面使用的所有功能都可以填充.

这并不试图处理自定义构造函数或保留数组中对象的原型; 如果没有关于如何为复制操作调用这些构造函数的约定,那么这样做会使事情变得非常复杂并且不可能完美.您可以通过分配相同的原型来接近,但这不会考虑构造函数中的逻辑,特别是对于在其中设置为闭包的函数.