关于js 浅拷贝深拷贝以及赋值操作。

最近同事又碰到关于深浅拷贝以及赋值的问题，今天我也研究一下记录一下，加深一下记忆。

　　举一个简单的例子：

　　var people = {
　　　　age:10,
　　　　name:"小华",

　　　　arr:[1,2,3]

　　};
　　做一个赋值操作:

　　var people2 = people;
　　然后做一个浅拷贝操作:
　　var people3 = {};
　　for (var i in people){
　　　　people3[i] = people[i]
　　};
　　然后最后再做一个深拷贝操作:

//     function deepClone (obj) {
//
//     if (Object.prototype.toString.call(obj).slice(8,-1) != 'Object' && Object.prototype.toString.call(obj).slice(8,-1) != 'Array') {
//         return obj;
//     }
//
//     var newObj = obj.constructor === Array ? [] : {}; //开辟一块新的内存空间
//
//     for (var i in obj) {
//         newObj [i] = deepClone(obj [i]); //通过递归实现深层的复制
//     }
//
//     return newObj;
// }

　　function deepClone (obj) {

　　　if (Object.prototype.toString.call(obj).slice(8,-1) != 'object' && Object.prototype.toString.call(obj).slice(8,-1) != 'Array') {
　　　　　return obj;
　　　}　　

　　　var newObj = obj.constructor === Array ? [] : {}; //开辟一块新的内存空间

　　　for (var i in obj) {
　　　　　newObj [i] = deepClone(obj [i]); //通过递归实现深层的复制
　　　}

　　　return newObj;
　　}

deepClone :function(obj){
    var str, newobj = obj.constructor === Array ? [] : {};
    if(typeof obj !== 'object'){
        return;
    } else if(window.JSON){
        str = JSON.stringify(obj); //系列化对象
        newobj = JSON.parse(str); //还原
    } else {
        for(var i in obj){
            newobj[i] = typeof obj[i] === 'object' ?
                deepClone(obj[i]) : obj[i];
        }
    }
    return newobj;
}

　　var people4 = deepClone(people);

　　------------------------------------------------------重点分割线---------------------------------------------

　　下面开始进行对原数据进行操作。(people2,3,4的值请自行console ^_^)

　　people.age = 1;

　　发现就只有people1的age发生改变，其他的都是10。改变 people 同时也会改赋值对象 people2，而改变浅拷贝得到的 people3 和深拷贝people4都没有改变。这就可以说明赋值得到的对象 people2 只是将指针改变，其引用的仍然是同一个对象，而浅拷贝得到的的 people3 和深拷贝的people4则是重新创建了新对象。

下面开始第二波操作:　(people2,3,4的值请自行console ^_^)

　　people.arr[0] = 5　

　　接下来来看一下改变引用类型会是什么情况呢，我又改变了原始对象people的arr里面的数据，（arr是一个数组，也就是引用类型）。结果看输出可以看出来无论是赋值操作出来的people2还是浅拷贝的people3都会也都会改变。只有通过的深拷贝得到的people4没有改变。这是因为浅拷贝他只是复制一层对象的属性，并不包括对象里面的为引用类型的数据。所以就会出现people改变引用类型时，会使people3改变。

所以我们可以得出结论：

--- | 和原数据是否指向同一对象 | 第一层数据为基本数据类型 |原数据中包含子对象

赋值 | 是　　　　　　　　　　　 | 改变会使原数据一同改变 | 改变会使原数据一同改变

浅拷贝 | 否 | 改变不会使原数据一同改变 | 改变会使原数据一同改变

深拷贝 | 否 | 改变不会使原数据一同改变 | 改变不会使原数据一同改变

秒客网

关于js 浅拷贝深拷贝以及赋值操作。

相关文章

关于js 浅拷贝 深拷贝 以及赋值操作。

相关文章

关于js 浅拷贝深拷贝以及赋值操作。