title: How to traverse JS object and all arrays and objects inside to compare it with its copy?
body: <p>I have a <code>selectedItem</code> object in Angular, it contains other objects and arrays. I create a deep copy using a JSON trick:</p>
  
  <pre><code>$scope.editableItem = JSON.parse(JSON.stringify($scope.selectedItem))
  </code></pre>
  
  <p>Then I use <code>editableItem</code> model in inputs, change some values inside. <code>selectedItem</code> doesn't change. Then I want to send via <code>PATCH</code> all the changes made, but not the fields which were not changed. So I need to strip the <code>editableItem</code> from all fields that are the same in unchanged <code>selectedItem</code>.</p>
  
  <p>How to do this efficiently? I was thinking about traversing object recursively using Underscore, but I'd really like to know if it's a good way of thinking before I tackle it.</p>
  
  <p>Alternatively I could probably create third object which would only contain touched fields from the second one, added dynamically, but I'm not sure how to approach this.</p>
  
  <p>EDITED:
  To be clear, I expect the answer to be generic and assume the most complicated object structure possible. For example no answers from <a href="https://stackoverflow.com/questions/18641618/how-can-i-denote-which-input-fields-have-changed-in-angularjs/18642622#18642622">this question</a> are applicable here as they either assume the object has only simple fields or they need to have Angular watcher explicitly set for every field separately.</p>