js深度复制一个对象使用JSON.stringify是最好的办法吗

转载自   js深度复制一个对象使用JSON.stringify是最好的办法吗

深度复制一个对象,看到很多种方法,最简单的是:

var newObject = JSON.parse(JSON.stringify(oldObject));

这样写有什么弊端吗?

http://stackoverflow.com/questions/20662319/javascript-deep-copy-using-json 看这,两个弊端了。

 

7个回答

1、oldObject = {a: 1, b: function() {}}

他的意思是这样的对象用此方法复制不了。

 

2、更新:
JSON接口在于:无法处理function,无法处理Reg,无法处理循环引用对象,完美的实现深度copy是非常非常麻烦的,生产上建议使用lodash,https://www.npmjs.com/package...
如果你的应用场景处理的就是服务器返回json数据,或者即将以json传递给服务器的,用JSON是最方便的,没必要引入这么复杂的clone库。

原答案:
使用JSON接口有弊端,使用Object.create不会复制对象本身, 而是用对象的constructor重新构造一个对象。
所以可以考虑使用Object.assign

let old_obj = [{a:1},{b:2}];
let new_obj = old_obj.map((ele)=>{
    return Object.assign({},ele);
});
old_obj[0].a=99;
console.log(new_obj); // "[{a:1},{b:2}]" 

3、一般情况下通过 JSON 来复制挺好的,代码写起来也方便——不过并不是所有环境都实现了 JSON,这个需要考虑下。

通过 deep clone 一般都是有限定复制层次的,一般情况下不会无限层的复制下去。如果使用 JSON 方式来复制,通常不能控制层次。

 

4、深拷贝不就好了么。

https://github.com/XadillaX/nbut-online-judge-v2/blob/master/util/functions.js#L7-L28

/**
 * Deepin clone an object
 * @param obj
 * @returns {*}
 */
exports.cloneObject = function(obj) {
    if(typeof obj === "object") {
        if(util.isArray(obj)) {
            var newArr = [];
            for(var i = 0; i < obj.length; i++) newArr.push(obj[i]);
            return newArr;
        } else {
            var newObj = {};
            for(var key in obj) {
                newObj[key] = this.cloneObject(obj[key]);
            }
            return newObj;
        }
    } else {
        return obj;
    }
};

5、

var newObject = Object.create(oldObject);

6、可以参考一下stackoverflow上关于克隆一个对象的有效方法

7、这个看需求,我是搜索进来的,之前使用封装出来的深拷贝方法,结果不能满足我的需求,

建议如果数据格式大而且多样的话,最好是用楼主说的方法; 如果deepcopy的层级小的话,可以看下面的代码:

var hasOwn = Object.prototype.hasOwnProperty;
function deepCopy(receiver, obj){
    var args = [].slice.call(arguments), key, i = 1, deep, ride, value, valueType;

    if( typeof args[args.length-2] === "boolean" ){
        deep = args.pop();
        ride = args.pop();
    }else{
        ride = (typeof args[args.length-1] === "boolean")?args.pop():true;
        deep = false;
        if(args.length < 2){
            receiver = ( this !== global ) ? this : {};
            if( args.length === 0 ){
                return receiver;
            }
        }
    }

    while( obj = args[ i++ ] ){
        for( key in obj ){
            if( hasOwn.call(obj, key) ){
                if( ride || !(key in receiver) ){
                    value = obj[key];
                    valueType = type(value);
                    if( deep && ( valueType==="object")){
                        receiver[key]={};
                        deepCopy(receiver[key], value, ride, deep);
                    }else if( deep && ( valueType==="array" )){
                        receiver[key]=[];
                        deepCopy(receiver[key], value, ride, deep);
                    }else{
                        receiver[key] = obj[key];
                    }
                }
            }
        }
    }
    return receiver;
}

// 类型判定对象
var class2type = {
    "[objectHTMLDocument]" : "document",
    "[objectHTMLCollection]" : "nodeList",
    "[objectStaticNodeList]" : "nodeList",
    "[objectIXMLDOMNodeList]" : "nodeList",
    "null" : "null",
    "NaN" : "NaN",
    "undefined" : "undefined"
};

"Boolean, Number, String, Function, Array, Date, RegExp, Document, Arguments, NodeList"
    .replace( /[^, ]+/g, function( type ){
        class2type["[object " + type + "]"] = type.toLowerCase();
    } );

// 类型判定
function type( obj, isType ){
    var key = ((obj == null || obj !== obj ) ? obj + "" : Object.prototype.toString.call( obj )),
        result;

    if( typeof(result = class2type[ key ]) !== "string" ){
        if( obj.nodeType === 9 ){
            result = class2type["Document"];
        }else if( obj.item && typeof obj.length === "number" ){
            result = class2type["NodeList"];
        }else{
            result = key.slice(8, -1);
        }
    }


    if( isType ){
        return result === isType.toLowerCase;
    }


    return result;
}

export { deepCopy };   //根据开发模式选择使用或不使用,可取消

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值