Strip methods off javascript object

Question

In one repo I saw a line.

var foo = JSON.parse(JSON.stringify(foo));

I think this is trying to strip any methods off the object. I can't really see it doing anything else. Is there a more efficient way to attempt this? Does node optimize this?

Answer 1

In the code context you have now disclosed, this technique is being used to make a copy of an object passed to a function so that modifications to that object will not modify the original. Here's the context from your link:

// route reply/error
this.connection.on('message', function(msg) {
   var msg = JSON.parse(JSON.stringify(msg));
   var handler;
   if (msg.type == constants.messageType.methodReturn || msg.type == constants.messageType.error) {
       handler = self.cookies[msg.replySerial];
       if (msg.type == constants.messageType.methodReturn && msg.body)
          msg.body.unshift(null); // first argument - no errors, null
       if (handler) {
          delete self.cookies[msg.replySerial];
          var props = {
             connection: self.connection,
             bus: self,
             message: msg,
             signature: msg.signature
          };
          if (msg.type == constants.messageType.methodReturn)
             handler.apply(props, msg.body); // body as array of arguments
          else
             handler.call(props, msg.body);  // body as first argument
       }

Note: the line in this clip that contains msg.body.unshift(null). That would be modifying the original object if this copy was not made.

Also, note that redeclaring var msg is not actually defining a new variable. Since msg is already defined in this scope as the function argument, it is not redeclared by the var msg (this is technically a mistake in the code to use the var).

---

The usual reason for using this type of code is to clone an object (make a deep copy of the object where all properties including embedded objects and arrays are copied).

var obj = {
   list: [1,2,3],
   items: [{language: "English", greeting: "hello"}, 
           {language: "Spanish", greeting: "hola"}, 
           {language: "French", greeting: "bonjour"}]
}

// make a completely independent copy of obj
var copy = JSON.parse(JSON.stringify(obj));

copy.items[0].greeting = "Yo";

console.log(obj.items[0].greeting);    // "hello"
console.log(copy.items[0].greeting);   // "Yo"

Note: this only works as a full copy with objects that are a plain Object type and do not have custom properties that are functions. And, because JSON.stringify() does not support circular references or self references, you can't have any of those. And, if you have multiple references to the same object, each reference will be copied to a new separate object. And, the combination of JSON.stringify() and JSON.parse() don't support objects other than a plain Object such as RegExp, Date or any of your own custom objects (they turn them into plain Objects). So, there are some limitations of this procedure, but it works quite simply for the majority of cases.

---

Per Matt (in comments), a custom function to create a clone of an object that does support circular references and does support some types of custom objects can be seen here.

---

In case anyone reading this doesn't realize, assigning an object to another variable does not make a copy in Javascript. The assignment in Javascript is like setting a pointer reference to the same object. Each variable then points to the same underlying object so modifying the object through either variable ends up modifying the same object in both cases like this:

var obj = {
   list: [1,2,3],
   items: [{language: "English", greeting: "hello"}, 
           {language: "Spanish", greeting: "hola"}, 
           {language: "French", greeting: "bonjour"}]
}

var copy = obj;

// modify copy 
copy.items[0].greeting = "Yo";

// both obj and copy refer to the exact same object
console.log(obj.items[0].greeting);    // "Yo"
console.log(copy.items[0].greeting);   // "Yo"

Thus, the occasional need to make an actual deep copy of an object.