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遍历,如果用了改写原型的方式写方法,遍历时会把原型的方法也遍历进去,这不是为我们想要的结果。