2019-01-23 JS 浅复制和深复制

由于js中对象的赋值是引用类型， 当更改一个对象的值是， 另外一个对象的值也会相应的改变， 所以会存在浅拷贝和深拷贝
我也是阅读掘金的一篇文章， 借此复习一下

本文所有代码都是 typescript 实现, 借此复习typescript用法

• 简书在书写typescript代码的时候加上typescript会有高亮
  1.浅拷贝

// 继承Object 对象， 实现Object原型上的方法
interface DefineObj extends Object { 
    [key: string] : any
}
var clone = (obj: DefineObj) => {
    let c: DefineObj = {} // 定义一个新对象
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            c[key] = obj[key]
        }
    }
    return c
}

let aa = {
    x : 1,
    y : 'string',
    z : null,
    b : undefined,
    q: {x: 1}
}

let b = clone(aa)
console.log(b, aa==b) 
aa.q.z = 10
console.log(b.q.z) // 10
/**
Object {x: 1, y: "string", z: null, b: undefined}
deepClone.js:18
false
*/

问题 当改变对象中的对象时, 引用对象也会因此改变
解决方法： 当函数值为对象的时候，进行循环引用

// 是否是对象
function isObject(obj: DefineObj) {
    return Object.prototype.toString.call(obj) === '[object Object]'
}

函数完善

var clone = (obj: DefineObj) => {
    let c: DefineObj = {} // 定义一个新对象
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            if (isObject()) {
                c[key] = clone(obj[key])  // 函数循环引用
            } else {
                c[key] = obj[key]
            }
        }
    }
    return c
}

完善数组对象

判断是否是数组
function isArray(obj: DefineObj) {
    return Object.prototype.toString.call(obj) === '[object Array]'
}

var clone = (obj: DefineObj) => {
    let c: DefineObj = isArray(obj) ? [] : {} // 判断是否为数组
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            if (isObject()) {
                c[key] = clone(obj[key])  // 函数循环引用
            } else {
                c[key] = obj[key]
            }
        }
    }
    return c
}