js实现复制对象、扩展对象 方法

jquery里有extend方法来扩展对象,但如果我们只用js,怎么来实现扩展对象呢?


1、ES6提供了Object.assign() ,用于合并/复制对象的属性。

Object.assign(target, source_1, ..., source_n)

它会依次把 source_1, …, source_n 等对象的属性 复制 到 target对象中,最后返回target对象。当遇到同名属性时,后添加的对象属性会覆盖先添加的对象属性。

var o = {
    'a':1,
    'b':2
};
var a = {
    'b':3,
    'c':5
};
console.log(Object.assign({}, o, a));//{a: 1, b: 3, c: 5}

2、对于ES5,可以自己写一个extend方法
源代码:

//******** 深复制对象 ********
function cloneObj(obj) {
    var newObj = obj.constructor === Array ? []:{};
    newObj.constructor = obj.constructor;
    if(typeof obj !== "object"){ 
        return ;
    } else if(window.JSON){
        newObj = JSON.parse(JSON.stringify(obj));//若需要考虑特殊的数据类型,如正则,函数等,需把这个else if去掉即可
    } else {
        for(var prop in obj){
            if(obj[prop].constructor === RegExp ||obj[prop].constructor === Date){
                newObj[prop] = obj[prop];
            } else if(typeof obj[prop] === 'object'){
                newObj[prop] = deepCopy(obj[prop]);//递归
            } else {
                newObj[prop] = obj[prop];
            }
        }
    } 
    return newObj;
};

//******** 扩展对象 ********
function extendObj() {
    if(arguments.length < 1){return 0;}
    var tempobj = cloneObj(arguments[0]); //调用复制对象cloneObj方法
    for(var n = 1;n < arguments.length;n++){
        for(var key in arguments[n]){
            tempobj[key] = arguments[n][key];
        }
    }
    return tempobj;
};

//******** 测试 扩展对象 ********
//让obj3继承obj1和obj2
var obj1 = {name:"bty",age:12};
var obj2 = {sex:"boy"};
var obj3 = extendObj(obj1,obj2); 
console.log(obj3.age); //12

//******** 测试 复制对象 ********
var obj2 = cloneObj(obj1);//深复制对象
obj1.name = "ssh";//修改obj1.name值,但下面obj2.name值不变
console.log(obj2.name);   //bty

注:这里我们写方法的时候,不要用Array.prototype.name 的形式,因为上面cloneObj方法中我们涉及到了for-in遍历,如果用了改写原型的方式写方法,遍历时会把原型的方法也遍历进去,这不是为我们想要的结果。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值