Edit in JSFiddle

/*
now hosted at 
https://gist.githubusercontent.com/JDMcKinstry/83fbe7cccfa90a2e8bbaa3b23b676838/raw/3fdd409bd4ea81d8dbc826bfc8e978b05dd788c0/object.join.js
*/
        //    TODO write in option to join only properties of specified key(s)
$(function() {
    var test1 = {
        key1: "val1",
        key2: false,
        key3: "val3"
    },
    test2 = {
        key1: "val21",
        key2: "val22",
        key3: {
            subKey1: "subVal21",
            subKey2: "subVal22",
            subKey3: "subVal23"
        }
    },
    test3 = {
        key1: "val31",
        key2: "val32",
        key3: {
            subKey1: "subVal31",
            subKey2: "subVal32",
            subKey3: {
                micro1: "mini31",
                micro2: "mini32",
                micro3: "mini33"
            }
        }
    },
    test4 = [{
        key1: "val41",
        key2: "val42",
        key3: {
            subKey1: "subVal41",
            subKey2: "subVal42",
            subKey3: {
                micro1: "mini41",
                micro2: "mini42",
                micro3: "mini43"
            }
        }
    }];
    
    console.log($("ul").append($("<li />").text( '$.joinObj(test1, ":"); // ' + $.joinObj(test1, ":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$(test1).joinObj(":"); // ' + $(test1).joinObj(":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$.joinObj(test2, ":"); // ' + $.joinObj(test2, ":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$(test2).joinObj(":"); // ' + $(test2).joinObj(":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$(test3).joinObj(":"); // ' + $(test3).joinObj(":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$.joinObj([test1, test2], ":"); // ' + $.joinObj([test1, test2], ":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$([test1, test2]).joinObj(":"); // ' + $([test1, test2]).joinObj(":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$.joinObj([test1, test2, test3], ":"); // ' + $.joinObj([test1, test2, test3], ":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$([test1, test2, test3]).joinObj(":"); // ' + $([test1, test2, test3]).joinObj(":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$(test4).joinObj(":"); // ' + $(test4).joinObj(":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$.joinObj(test4, ":"); // ' + $.joinObj(test4, ":") )).children("li").last().text());
    console.log(new Array(30).join(" -"));
    console.log($("ul").append($("<li />").text( '$([test1, test2, test3, test4]).joinObj(":"); // ' + $([test1, test2, test3, test4]).joinObj(":") )).children("li").last().text());
     console.log($([test1, test2, test3, test4]).joinObj(", "));
    setInterval(function() {
        $("ul").css("bottom", $("iframe").outerHeight());
    }, 250);
    
});

<h2>
Now found at <a href="https://gist.githubusercontent.com/JDMcKinstry/83fbe7cccfa90a2e8bbaa3b23b676838/raw/3fdd409bd4ea81d8dbc826bfc8e978b05dd788c0/object.join.js">gist.github.com</a>
</h2>
<div>
    <h3>
        Don't forget to check your browsers console for further examples of information as passed around by the JavaScript
    </h3>
    <ul></ul>
</div>

h2 {
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
}
div {
    height: 100%;
    width: 100%;
}
h3 {
    margin: 2px 4px;
    padding: 1px 2px;
    text-align: center;
}
ul {
    height:90%;
    width: 100%;
}
li {
    padding: .25em;
}
li:nth-child(even) {
    background-color: #CCFFFF;
}
h3 {
    background-color: yellow;
    color: red;
}
}