JavaScript Objects: Compare and Clone

This JavaScript article tutorial shows you a short overview about JavaScript objects in comparing and cloning. You'll know how to clone JavaScript objects, make JavaScript object copy. This is really a should-read JavaScript tutorial when you would like to learn more advance JavaScript skills.


Sampled by © JavaScriptBank.com

Here's a handy way to determine if two JavaScript objects are identical without using a framework like jQuery or MooTools:

var compare_objects = function (obj1, obj2){

 
    var parameter_name;
 
    var compare = function(objA, objB, param){

 
        var param_objA = objA[param],
            param_objB = (typeof objB[param] === "undefined") ? false : objB[param];

 
        switch(typeof objA[param]){
            case "object": return (compare_objects(param_objA, param_objB));

            case "function": return (param_objA.toString() === param_objB.toString());

            default: return (param_objA === param_objB);
        }

 
    };
 
    for(parameter_name in obj1){
        if(typeof obj2[parameter_name] === "undefined" || !compare(obj1, obj2, parameter_name)){

            return false;
        }
    }
 
    for(parameter_name in obj2){

        if(typeof obj1[parameter_name] === "undefined" || !compare(obj1, obj2, parameter_name)){

            return false;
        }        
    }
 
    return true;

 
};

Here's an easy way to clone a JavaScript object:

var clone_object = function (original_obj) {

    var new_obj = {};
    for(var param in original_obj) {

        if(original_obj.hasOwnProperty(param)){
            if(typeof(original_obj[param]) === "object"){

                new_obj[param] = clone_object(original_obj[param]);

            } else {
                new_obj[param] = original_obj[param];

            }
        }
    }
    return new_obj;
};

A real-world example of the two functions:

var object_1 = { fruit: "apple", tree: "dogwood", number: 3 };

var object_2 = { fruit: "apple", tree: "dogwood", number: 3, cartoons: { anime: "robotech", fantasy: "he-man" } };

var object_3 = clone_object(object_2);
 
console.log("objects 1 and 2 match? " +compare_objects(object_1, object_2));

//displays false;
 
console.log("objects 2 and 3 match? " +compare_objects(object_2, object_3));

//displays true

Bear in mind both of these functions are recursive, which means the larger the object, the slower the performance.

Language
Translate this page to English Translate this page to French Translate this page to Vietnamese

Recent articles
Migrate to Angular: why and how you should do it
The Possible Working Methods of Python Ideology
JavaScript Research Paper: 6 Writing Tips to Craft a Masterpiece
Learning How to Make Use of New Marketing Trends
5 Important Elements of an E-commerce Website
How To Create A Successful Prototype For Your PCB
WordPress Landing Page Conversion Essentials to Convert More
Lifeasapa and Neurosphere
4 Development Hacks To Make Your Website Launch A Success
Why Data Recovery Software and Services are Important


Top view articles
Top 10 Beautiful Christmas Countdown Timers
65 Free JavaScript Photo Gallery Solutions
Best Free Linux Web Programming Editors
Top 50 Most Addictive and Popular Facebook mini games
Top 10 Free Web Chat box Plug-ins and Add-ons
Top 10 Best JavaScript eBooks that Beginners should Learn
50+ Beautiful Resources of HTML Form using CSS and JavaScript
The Ultimate JavaScript Tutorial in Web Design
HTML5 Web Workers Multithreading in JavaScript
Learn more about JavaScript Inheritance with Tiny JavaScript Example Codes


Free JavaScript Tutorials & Articles
at www.JavaScriptBank.com