克隆
浅层克隆
把obj的属性都克隆到obj1身上了,但是浅层克隆是指obj的属性值发生变化之后obj1的属性值不改变,原始值只是复制了一份。但是引用值会发生改变,会互相影响,因为引用的是地址,指向同一个值。
var obj = {
name : 'abc' ,age : 123,
sex : 'female' ,
card : [ 'visa ' , ' unionpay']
}
var obj1 = {}
function clone(origin, target) {
// 防止用户不传target
var target = target || {};
for(var prop in origin) {
target [prop] = origin [prop];
}
return target;
}
clone(obj, obj1);
// 往obj1中添加属性值 会发现obj中也会增加
obj1.card.push('master');
深层克隆
属性一模一样,但是就不是同一个,也就是各自更改互不干预。
// 思路
// 遍历对象 for(var prop in obj)
// for in 除了遍历对象之外也能遍历数组
// 1. 依次判断属性值是原始值还是引用值 原始值直接写 typeof() obj是引用值 其他类型都是原始值
// 2. 引用值要判断是数组还是对象 instanceof toString constructor
// 3. 建立相应的数组或对象
// 4. 递归
var obj ={
name : "abc" ,
age : 123,
card : ['visa','master'],
wife : {
name : "bcd" ,
son :{
name : "aaa"
}
}
}
// 思路理解
var obj1 = {
// 原始值之间的拷贝是占内存的拷贝 直接赋值
name : "abc",
age : 123,
// 引用值也是直接赋值 但是赋的是地址 建立新数组 判断被拷贝数组中是原始值还是引用值 原始值直接拿过来
card : ['visa','master'],
// 对象和数组类似
wife : {
ame : "bcd",
// son不是原始值 就需要建立新的对象 然后继续判断son中是否原始值
son : {
name : "aaa"
}
}
}
// 思路
// 遍历对象 for(var prop in obj)
// for in 除了遍历对象之外也能遍历数组
// 1. 依次判断属性值是原始值还是引用值 原始值直接写 typeof() obj是引用值 其他类型都是原始值
// 2. 引用值要判断是数组还是对象 instanceof toString constructor
// 3. 建立相应的数组或对象
// 4. 递归
var obj ={
name : "abc" ,
age : 123,
card : ['visa','master'],
wife : {
name : "bcd" ,
son :{
name : "aaa"
}
}
}
var obj1 = {
}
// 写法
function deepClone(origin, target) {
var target = target || {},
tostr = 0bject.prototype.toString,
arrStr = "[object Array]"; // 用于后面判断
for(var prop in origin) { // 第一步 遍历对象
if(origin.hasOwnProperty(prop)) { // 先判断是不是自己的属性 过滤掉原型上的属性 原型上的属性不拷贝
if(typeof(origin[prop]) == 'object' && origin[prop]) !== "null") { // 判断是不是引用值
/* if(toStr.call(origin[prop] == arrStr) { 判断
target[prop] = [];引用值是数组就建立新数组
}else {
target[prop] = {};
} */
target[prop] = (toStr.call(origin[prop] == arrStr ? [] : {})
// 让他俩递归 继续循环执行函数 直到找到全部原始值后退出循环
deepClone(origin[prop],target[prop]);
}else {
target[prop] = origin[prop]; // 原始值直接赋值
}
}
return target; // 如果没传target 需要把target return出去
}
给obj.card增加一个属性进去,访问obj1.card会发现没有这个属性,也就说明了两者互不影响