深拷贝和浅拷贝

在Vue官方文档看到了利用JSON.parse和JSON.stringify实现深拷贝，这里顺便说一下

所谓的深拷贝和浅拷贝的区别在于同样是复制某个对象和数组，但是浅拷贝只是将各个对象进行依次赋值，由于javascript存储对象都是对内存堆中地址的引用，所以浅拷贝最后实际上新的对象的变量的值还是引用了原来对象的值的地址，所以如果我们改变原来对象属性的值，那么新对象的值也会被改变，下面是一个浅拷贝的栗子

var obj={a:1,arr:[2,3]};
    var newObj=shallowCopy(obj);

    function shallowCopy(src) {
        var obj={};
        for(var key in src){
            if(src.hasOwnProperty(key)){
                obj[key]=src[key]
            }
        }
        return obj;
    }

    obj.arr[1]=4;
    console.log(newObj.arr[1]) //4  所以很明显newObj还是和obj指向同一个地址

深拷贝则不同，深拷贝会递归复制原对象的每一个值，然后独立组成一个新的对象，同时也会在内存中开辟一块新的空间，但是需要注意的是由于深拷贝是递归复制，所以可能会影响性能，而且一般不会使用深拷贝，下面举几个实现深拷贝的栗子

<script>
    //jq方法$.extend(),第一个参数可选，如果为true，那么表示深拷贝，如果不传值表示浅拷贝
    var obj={a:1,arr:[2,3]};
    $.extend(true, obj)
    //js clone方法
    var clone=function (obj) {
        var key,newObj=Object.prototype.toString.call(obj)=="[object Object]"?[]:{};
        if(Object.prototype.toString.call(obj) !="[object Object]"){
            return;
        }else if(window.JSON){
            newObj=JSON.parse(JSON.stringify(obj))
        }else{
            for( key in obj){
                newObj[key]=typeof obj[key] =='object'?clone(obj[key]):obj[key]
            }
        }
        return newObj;
    }
</script>