浅层克隆
让对象obj1克隆对象obj
var obj = { name : '莫小白', age : '16', son : '莫言秋雨' } var obj1 = {}; function clone(origin,target) { for (var prop in origin) { target[prop] = origin[prop]; } } clone(obj, obj1);
使用for..in把obj对象的每一个属性值提取出来并赋值给对象obj1,这就完成了克隆。
关于以上那个克隆,为了防止用户不传target的形参或者是实参,而是想把克隆后的结果保存成一个对象。
话不多说看代码:
var obj = { name : '莫小白', age : '16', son : '莫言秋雨' } var obj1 = {}; function clone(origin,target) { var target = target || {}; for (var prop in origin) { target[prop] = origin[prop]; } return target; //一定要在for..in循环的外围return } var demo = clone(obj) clone(obj,obj1);
如果用户正常传参想把obj1克隆成obj的话,
var target = target || {};
和return target;
这两句代码是没多大作用的,防止出错。
但是用户想把克隆好的对象拿出去的时候,就用到了这两串代码,最后把对象返回给力demo
。实际上这两串代码就是备用的。
深层克隆
这个才是这节课的重点
在克隆对象的时候,如果把引用值克隆过去的话,
目标对象或原始对象修改这个引用值的话,目标对象或原始对象里面的引用值也会被修改
要做到克隆后无论修改什么都不会互相影响。
操作思路:
1. 判断是不是原始值
1.1 要使用到的方法:typeof。
1.2 如果返回值为 object 则为引用值。
1.3 再判断引用值是对象还是数组,三种方法 。建议使用toSring。
1.4 如果为对象则添加一个对象,为数组则添加一个数组。
如果 typeof 返回的不是 object ,则直接进行浅层克隆即可。
2. 使用递归循环。
3. 完善。
// 深层克隆一个对象,deepClon(原始对象,目标对象),也可以拿变量来接收一个对象,origin为必须对象 function deepClone(origin,target){ var target = target || {}; for (var prop in origin) { if(typeof origin[prop] == "object") { if(Object.prototype.toString.call(origin[prop]) == "[object Array]"){ target[prop] = []; }else{ target[prop] = {}; } deepClone(origin[prop],target[prop]); }else{ target[prop] = origin[prop]; } } return target; }