JSFiddle - React, Tailwind, and code Playground

by Khalil Zhang

JavaScript

function extend(parent, child) {
    var child = child || {};
    for (var i in parent) {
        if (parent.hasOwnProperty(i)) {
            child[i] = parent[i];
        }
    }
    return child;
}


var dad = {
    counts: [1, 2, 3],
    reads: {
        paper: true
    }
};
var kid = extend(dad);
kid.counts.push(4);
dad.counts.toString(); // "1,2,3,4" 
dad.reads === kid.reads; // true

function extendDeep(parent, child) {
    var toStr = Object.prototype.toString;
    var astr = "[object Array]";
    var child = child || {};
    
    for (var 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);
kid.counts.toString(); // "1,2,3,4" dad.counts.toString(); // "1,2,3"
dad.reads === kid.reads; // false kid.reads.paper = false;
134 | Chapter 6: Code Reuse Patterns
kid.reads.web = true;
dad.reads.paper; // true