zoukankan      html  css  js  c++  java
  • javascript浅拷贝和深拷贝

    
    
    /* 浅拷贝 */
    function extend(parent, child) {
        var i;
        child = child || {};
        for (i in parent) {
            if (parent.hasOwnProperty(i)) {
                child[i] = parent[i];
            }
        }
        return child;
    }
    
    var dad = { name: "Adam" };
    var kid = extend(dad);
    console.log(kid.name); // "Adam"
    
    var dad = {
        counts: [1, 2, 3],
        reads: { paper: true }
    };
    var kid = extend(dad);
    kid.counts.push(4);
    console.log(dad.counts.toString()); // "1,2,3,4"
    console.log(dad.reads === kid.reads); // true

    存在问题:你可以发现dad和kid的reads是一样的,也就是他们使用的是同一个引用,这也就是浅拷贝带来的问题。

    /* 深拷贝 */
    function extendDeep(parent, child) {
        var i,
            toStr = Object.prototype.toString,
            astr = "[object Array]";
    
        child = child || {};
    
        for (i in parent) {
            if (parent.hasOwnProperty(i)) {
                if (typeof parent[i] === 'object') {
                    child[i] = (toStr.call(parent[i]) === astr) ? [] : {};
                    extendDeep(parent[i], child[i]);
                } else {
                    child[i] = parent[i];
                }
            }
        }
        return child;
    }
    
    var dad = {
        counts: [1, 2, 3],
        reads: { paper: true }
    };
    var kid = extendDeep(dad);
    
    kid.counts.push(4);
    console.log(kid.counts.toString()); // "1,2,3,4"
    console.log(dad.counts.toString()); // "1,2,3"
    
    console.log(dad.reads === kid.reads); // false
    kid.reads.paper = false;

    深拷贝以后,两个值就不相等了,bingo!

  • 相关阅读:
    原型设计
    简单APP——ToDoList的二次开发(日期规范化+构建搜索栏)
    Java基本语言篇
    C++中各种常用转换汇总学习
    语言篇swift
    洛谷P2384 最短路,积化加
    洛谷P4568 分层图最短路
    【洛谷P1962】矩阵快速幂求Fibonacii数列
    vue-cli教程
    单页应用原理
  • 原文地址:https://www.cnblogs.com/wbxjiayou/p/6434439.html
Copyright © 2011-2022 走看看