Remove element from javascript Object

Question

I need to keep the overall layout of an object. I pass it into a method and:

I need to delete things from the object, then do something,
once I get back to the main function I was in
I need the object to be UNTOUCHED.

The way it is setup now it deletes it from the main object as well as the one in the bottom method. SEE JSFiddle for code http://jsfiddle.net/rwux4rta/ To get the results from the run, see console

Please HELP!

$( document ).ready(function() {
    var pList = new Object();
    pList["test"] = "test"; //this is being deleted from BOTH instances of the Obj
    pList["test1"] = "test1";
    pList["test2"] = "test2";
    pList["test3"] = "test3";
    pList["test4"] = "test4";

    displayData(pList);

    console.log(pList);
});

function displayData(badData){
    badData.test.removeData();

    console.log(badData);
}

What is the actual problem you need to solve? What you are asking for seems to be an attempt at a solution to an untold problem. — Pete, Sep 23 '14 at 23:53
I need the pList.test not to be deleted from the top, and only deleted from badData. Doing this it is actually being deleted from both... @Pete — Joe Packer, Sep 23 '14 at 23:54

score 1 · Answer 1 · edited May 23 '17 at 12:06

1

In other words, your question is asking how to pass JavaScript objects by value, not by reference. By default, JavaScript passes all objects by reference, so as you've noticed, any modification to that object in a function will impact the original object as well.

Check out this thread to see how you can accomplish a pass by value:

JavaScript: How to pass object by value?

edited May 23 '17 at 12:06

Community

1
1

answered Sep 24 '14 at 00:32

Ryan

415
2
7

score 1 · Answer 2 · edited May 23 '17 at 11:43

You can clone the object before you delete the "bad" data. I used the following function to clone an object based on advice found here https://stackoverflow.com/a/728694/1143670.

function clone(obj) {
    if (null == obj || "object" != typeof obj) return obj;
    var copy = obj.constructor();
    for (var attr in obj) {
        if (obj.hasOwnProperty(attr)) copy[attr] = obj[attr];
    }
    return copy;
}

You will want to update your displayData function so that it clones the data coming in the "badData" parameter.

function displayData(badData){
   var newBadData = clone(badData);

   delete newBadData.test;

   console.log(newBadData);
}

The rest should remain the same and this was only tested in chrome. See this fiddle for a working example.

score 1 · Accepted Answer · answered Sep 24 '14 at 00:45

Try

 $(document).ready(function() {
    var pList = new Object();
    pList["test"] = "test"; //this is being deleted from BOTH instances of the Obj
    pList["test1"] = "test1";
    pList["test2"] = "test2";
    pList["test3"] = "test3";
    pList["test4"] = "test4";
    // extend `pList` to `_pList` object
    var _pList = $.extend({}, pList);
    displayData(_pList);

    console.log(pList, "original");
});

function displayData(badData){
    delete badData.test;

    console.log(badData, "extended");
}

jsfiddle http://jsfiddle.net/guest271314/rwux4rta/6/

I was actually just 2 seconds away from posting this my self. Thank you so much for your help, this seems to be clean and does the trick! — Joe Packer, Sep 24 '14 at 00:54

Remove element from javascript Object

3 Answers3