What is the hashKey added to my JSON stringify result

Question

I have tried looking on the Mozilla JSON stringify page of their docs as well as here on SO and Google but found no explanation  I have used JSON stringify many time but never come across this result  I have an array of JSON objects                   quot param 2 quot    quot Description 1 quot            quot param 0 quot    quot Name 1 quot            quot param 1 quot    quot VERSION 1 quot                        quot param 2 quot    quot Description 2 quot            quot param 0 quot    quot Name 2 quot            quot param 1 quot    quot VERSION 2 quot                        quot param 2 quot    quot Description 3 quot            quot param 0 quot    quot Name 3 quot            quot param 1 quot    quot VERSION 3 quot           It is attached to my  scope  In order to POST them as one parameter  I used the JSON stringify   method and receive the following                              quot param 2 quot    quot Description 1 quot                quot param 0 quot    quot Name 1 quot                quot param 1 quot    quot VERSION 1 quot                quot   hashKey quot    quot 005 quot                                    quot param 2 quot    quot Description 2 quot                quot param 0 quot    quot Name 2 quot                quot param 1 quot    quot VERSION 2 quot                quot   hashKey quot    quot 006 quot                                    quot param 2 quot    quot Description 3 quot                quot param 0 quot    quot Name 3 quot                quot param 1 quot    quot VERSION 3 quot                quot   hashKey quot    quot 007 quot                   I am just curious about what the   hashkey property is exactly  as I expected something more similar to the following from the stringify method  that is  without the   hashkey                    quot 1 quot                 quot param 2 quot    quot Description 1 quot                quot param 0 quot    quot Name 1 quot                quot param 1 quot    quot VERSION 1 quot                       quot 2 quot                 quot param 2 quot    quot Description 2 quot                quot param 0 quot    quot Name 2 quot                quot param 1 quot    quot VERSION 2 quot                       quot 3 quot                 quot param 2 quot    quot Description 3 quot                quot param 0 quot    quot Name 3 quot                quot param 1 quot    quot VERSION 3 quot                     I am not sure if it is a factor  but I am using the following   Angularjs 1 1 5  JQuery 1 8 2 Spring 3 0 4  I m also using Spring security 3 0 7 on the Server side  It is not causing me any issues  but I would like to know the cause and reason for the   hashkey

User · Accepted Answer

Angular adds this to keep track of your changes, so it knows when it needs to update the DOM.

If you use angular.toJson(obj) instead of JSON.stringify(obj) then Angular will strip out these internal-use values for you.

Also, if you change your repeat expression to use the track by {uniqueProperty} suffix, Angular won't have to add $$hashKey at all. For example

<ul>
    <li ng-repeat="link in navLinks track by link.href">
        <a ng-href="link.href">{{link.title}}</a>
    </li>
</ul>

Just always remember you need the "link." part of the expression - I always tend to forget that. Just track by href will surely not work.

User · Answer

Update   From Angular v1 5  track by  index is now the standard syntax instead of using link as it gave me a ng-repeat dupes error    I ran into this for a nested ng-repeat and the below worked    lt tbody gt       lt tr ng-repeat  row in data track by  index  gt       lt td ng-repeat  field in headers track by  index  gt   row field caption     lt  td gt   lt  tr gt

User · Answer

https   www timcosta io angular-js-object-comparisons   Angular is pretty magical the first time people see it  Automatic DOM updates when you update a variable in your JS  and the same variable will update in your JS file when someone updates its value in the DOM  This same functionality works across page elements  and across controllers   The key to all of this is the   hashKey Angular attaches to objects and arrays used in ng-repeats   This   hashKey causes a lot of confusion for people who are sending full objects to an API that doesn t strip extra data  The API will return a 400 for all of your requests  but that   hashKey just wont go away from your objects   Angular uses the   hashKey to keep track of which elements in the DOM belong to which item in an array that is being looped through in an ng-repeat  Without the   hashKey Angular would have no way to apply changes the occur in the JavaScript or DOM to their counterpart  which is one of the main uses for Angular   Consider this array   users                      first name   Tim           last name   Costa           email   tjsail33 gmail com            If we rendered that into a list using ng-repeat  user in users   each object in it would receive a   hashKey for tracking purposes from Angular  Here are two ways to avoid this   hashKey

User · Answer

If you don t want to add id s to your data  you could track by the index in the array  which will cause the items to be keyed by their position in the array instead of their value   Like this   var myArray    1 1 1 1 1     lt li ng-repeat  item in myArray track by  index  gt

User · Answer

In my use case  feeding the resulting object to X2JS  the recommended approach  data   angular toJson source     help to remove the   hashKey properties  but the result could then no longer be processed by X2JS   data   angular copy source     removed the   hashKey properties as well  but the result remained usable as a parameter for X2JS

User · Answer

It comes with the ng-repeat directive usually  To do dom manipulation AngularJS flags objects with special id   This is common with Angular  For example if u get object with ngResource your object will embed all the resource API and you ll see methods like  save  etc  With cookies too AngularJS will add a property   ngDebug

User · Answer

Here is how you can easily remove the   hashKey from the object    scope myNewObject   JSON parse angular toJson  scope myObject      scope myObject - Refers to the Object that you want to perform the operation upon i e  remove the   hashKey from   scope myNewObject - Assign the modified original object to the new object so it can be used as necessary

User · Answer

If you are using Angular 1 3 or above  I recommend that you use  track by  in your ng-repeat  Angular doesn t add a    hashKey  property to the objects in your array if you use  track by   You also get performance benefits  if something in your array changes  angular doesn t recreate the entire DOM structure for your ng-repeat  it instead recreates the part of the DOM for the values in your array that have changed

[javascript] What is the $$hashKey added to my JSON.stringify result

Examples related to javascript

Examples related to jquery

Examples related to json

Examples related to angularjs