Iterate through object properties

Question

x000D   x000D  var obj     x000D      name   Simon   x000D      age   20   x000D      clothing    x000D          style   simple   x000D          hipster  false x000D        x000D    x000D   x000D  for var propt in obj   x000D      console log propt          obj propt    x000D    x000D   x000D   x000D    How does the variable propt represent the properties of the object  It s not a built-in method or property  Why does it come up with every property in the object

User · Answer

As of JavaScript 1 8 5 you can use Object keys obj  to get an Array of properties defined on the object itself  the ones that return true for obj hasOwnProperty key     Object keys obj  forEach function key index           key  the name of the object key        index  the ordinal position of the key within the object        This is better  and more readable  than using a for-in loop   Its supported on these browsers     Firefox  Gecko   4  2 0  Chrome  5 Internet Explorer  9   See the Mozilla Developer Network Object keys   s reference for futher information

User · Answer

Girls and guys we are in 2019 and we do not have that much time for typing    So lets do this cool new fancy ECMAScript 2016   Object keys obj  forEach e   gt  console log  key   e   value   obj e

User · Answer

jquery allows you to do this now     each  obj  function  key  value       alert  key          value

User · Answer

Object keys obj  forEach key   gt    console log  key   key  value   obj key

User · Answer

To further refine the accepted answer it s worth noting that if you instantiate the object with a var object   Object create null  then object hasOwnProperty property  will trigger a TypeError  So to be on the safe side  you d need to call it from the prototype like this   for  var property in object        if  Object prototype hasOwnProperty call object  property                do stuff

User · Answer

The for   in loop represents each property in an object because it is just like a for loop  You defined propt in the for   in loop by doing       for var propt in obj   alert propt          obj propt        A for   in loop iterates through the enumerable properties of an object  Whichever variable you define  or put in the for   in loop  changes each time it goes to the next property it iterates  The variable in the for   in loop iterates through the keys  but the value of it is the key s value  For example       for var propt in obj          console log propt    logs name       console log obj propt     logs  Simon          You can see how the variable differs from the variable s value  In contrast  a for   of loop does the opposite   I hope this helps

User · Answer

Check this link it will help https   www w3schools com jsref tryit asp filename tryjsref state forin  var person    fname  John   lname  Doe   age 25       var text         var x    for  x in person        text    person x            where x will be fname lname age      Console log text

User · Answer

I want to add to the answers above  because you might have different intentions from Javascript   A JSON object and a Javascript object are different things  and you might want to iterate through the properties of a JSON object using the solutions proposed above  and then be surprised    Suppose that you have a JSON object like   var example          prop1    value1        prop2      value2 0   value2 1         prop3               prop3 1    value3 1            The wrong way to iterate through its  properties    function recursivelyIterateProperties jsonObject        for  var prop in Object keys example             console log prop           recursivelyIterateProperties jsonObject prop              You might be surprised of seeing the console logging 0  1  etc  when iterating through the properties of prop1 and prop2 and of prop3 1  Those objects are sequences  and the indexes of a sequence are properties of that object in Javascript   A better way to recursively iterate through a JSON object properties would be to first check if that object is a sequence or not   function recursivelyIterateProperties jsonObject        for  var prop in Object keys example             console log prop           if    typeof jsonObject prop        string                amp  amp    jsonObject prop  instanceof Array                     recursivelyIterateProperties jsonObject prop

User · Answer

If running Node I d recommend   Object keys obj  forEach  key  index    gt        console log key

User · Answer

Nowadays you can convert a standard JS object into an iterable object just by adding a Symbol iterator method  Then you can use a for of loop and acceess its values directly or even can use a spread operator on the object too  Cool  Let s see how we can make it    x000D   x000D  var o    a 1 b 2 c 3   x000D      a       x000D  o Symbol iterator    function     x000D                         var ok   Object keys this   x000D                              i   0  x000D                         while  i  lt  ok length  yield this ok i      x000D                          x000D  for  var value of o  console log value   x000D     or you can even do like x000D  a       o   x000D  console log a   x000D   x000D   x000D

User · Answer

It s the for   in statement  MDN  ECMAScript spec    You can read it as  FOR every property IN the obj object  assign each property to the PROPT variable in turn

User · Answer

The above answers are a bit annoying because they don t explain what you do inside the for loop after you ensure it s an object  YOU DON T ACCESS IT DIRECTLY  You are actually only delivered the KEY that you need to apply to the OBJ   var obj       a   foo     b   bar     c   foobar         We need to iterate the string keys  not the objects  for var someKey in obj         We check if this key exists in the obj   if  obj hasOwnProperty someKey              someKey is only the KEY  string   Use it to get the obj      var myActualPropFromObj   obj someKey      Since dynamic  use    since the key isn t literally named  someKey          NOW you can treat it like an obj     var shouldBeBar   myActualPropFromObj b          This is all ECMA5 safe  Even works in the lame JS versions like Rhino

User · Answer

While the top-rated answer is correct  here is an alternate use case i e if you are iterating over an object and want to create an array in the end  Use  map instead of forEach   const newObj   Object keys obj  map el   gt          ell will hold keys        Getting the value of the keys should be as simple as obj el

User · Answer

You can use Lodash  The documentation   var obj    a  1  b  2  c  3     keys obj  forEach function  key

User · Answer

Here I am iterating each node and creating meaningful node names  If you notice  instanceOf Array and instanceOf Object pretty much does the same thing  in my application  i am giving different logic though   function iterate obj parent node        parent node   parent node            for  var property in obj            if  obj hasOwnProperty property                 var node   parent node         property              if obj property  instanceof Array                      console log  array      node         obj property                    iterate obj property  node                else if obj property  instanceof Object                     console log  Object      node         obj property                    iterate obj property  node                            else                   console log node         obj property                                      note - I am inspired by Ondrej Svejdar s answer  But this solution has better performance and less ambiguous

User · Answer

Dominik s answer is perfect  I just prefer to do it that way  as it s cleaner to read  for  var property in obj        if   obj hasOwnProperty property   continue          Do stuff

User · Answer

To add ES2015 s usage of Reflect ownKeys obj  and also iterating over the properties via an iterator   For example   let obj     a   Carrot   b   Potato   Car    doors  4        can be iterated over by     logs each key Reflect ownKeys obj  forEach key   gt  console log key      If you would like to iterate directly over the values of the keys of an object  you can define an iterator  just like JavaScipts s default iterators for strings  arrays  typed arrays  Map and Set   JS will attempt to iterate via the default iterator property  which must be defined as Symbol iterator   If you want to be able to iterate over all objects you can add it as a prototype of Object   Object prototype Symbol iterator    function           for p of Reflect ownKeys this    yield this p         This would enable you to iterate over the values of an object with a for   of loop  for example   for val of obj    console log  Value is     val       Caution  As of writing this answer  June 2018  all other browsers  but IE  support generators and for   of iteration via Symbol iterator

User · Answer

let obj     a   3   b   2   6    a    Object keys obj  map  item    gt   console log  item   obj item         a    3    2

User · Answer

Check type You can check how propt represent object propertis by typeof propt  to discover that it s just a string  name of property   It come up with every property in the object due the way of how for-in js  quot build-in quot  loop works   x000D   x000D  var obj         name   Simon       age   20       clothing            style   simple           hipster  false          for var propt in obj       console log typeof propt   propt          obj propt      x000D   x000D   x000D

User · Answer

In up-to-date implementations of ES  you can use Object entries   for  const  key  value  of Object entries obj         or  Object entries obj  forEach   key  value     gt         If you just want to iterate over the values  then use Object values   for  const value of Object values obj         or  Object values obj  forEach value   gt

User · Answer

Objects in JavaScript are collections of properties and can therefore be looped in a for each statement    You should think of obj as an key value collection

User · Answer

Iterating over properties requires this additional hasOwnProperty check    for  var prop in obj        if  Object prototype hasOwnProperty call obj  prop                do stuff           It s necessary because an object s prototype contains additional properties for the object which are technically part of the object  These additional properties are inherited from the base object class  but are still properties of obj   hasOwnProperty simply checks to see if this is a property specific to this class  and not one inherited from the base class     It s also possible to call hasOwnProperty through the object itself   if  obj hasOwnProperty prop            do stuff     But this will fail if the object has an unrelated field with the same name   var obj     foo  42  hasOwnProperty   lol     obj hasOwnProperty  foo        TypeError  hasOwnProperty is not a function   That s why it s safer to call it through Object prototype instead   var obj     foo  42  hasOwnProperty   lol     Object prototype hasOwnProperty call obj   foo        true

User · Answer

if Object keys obj  length        Object keys obj  forEach key   gt            console log  quot  n quot    key    quot    quot    obj key                      Explanation line by line         Explaining the bellow line    It checks if obj has at least one property  Here is how     Object keys obj  will return an array with all keys in obj     Keys are just the regular incremental numbers starting from 0     If there is no keys in obj  it will return empty array         Then it will get its length  At this point  it checks      If it has at least one element  it means it s bigger than 0     which evaluates to true and the bellow code will be executed     Else means it s length   0 which evaluates to false    NOTE  you can use Object hasOwnProperty   instead of Object keys obj  length if Object keys obj  length            Explaining the bellow line        Just like in the previous line  this returns an array with        all keys in obj  because if code execution got here  it means         obj has keys           Then just invoke built-in javascript forEach   to loop        over each key in returned array and calls a call back function         on each array element  key   using ES6 arrow function    gt          Or you can just use a normal function   key    blah blah         Object keys obj  forEach key   gt                The bellow line prints out all keys with their             respective value in obj             key comes from the returned array in Object keys obj             obj key  returns the value of key in obj         console log  quot  n quot    key    quot    quot    obj key

User · Answer

You can access the nested properties of object using for   in and forEach loop  for   in  for  const key in info        consoled log info key       forEach  Object keys info  forEach function prop        console log info prop           cities  Array 3   continent   quot North America quot   images  Array 3   name   quot Canada quot          quot prop quot  is the property name         quot data prop  quot  is the property value

User · Answer

Also adding the recursive way   function iterate obj           watch for objects we ve already iterated so we won t end in endless cycle        for cases like var foo       foo bar   foo  iterate foo       var walked           var stack     obj  obj  stack            while stack length  gt  0                var item   stack pop            var obj   item obj          for  var property in obj                if  obj hasOwnProperty property                     if  typeof obj property      object                          check if we haven t iterated through the reference yet                   var alreadyFound   false                    for var i   0  i  lt  walked length  i                                            if  walked i      obj property                                               alreadyFound   true                        break                                                                 new object reference                   if   alreadyFound                                          walked push obj property                        stack push  obj  obj property   stack  item stack         property                                                          else                                       console log item stack         property         obj property                                                        Usage   iterate   foo   foo   bar    foo   foo

User · Answer

Your for loop is iterating over all of the properties of the object obj  propt is defined in the first line of your for loop  It is a string that is a name of a property of the obj object  In the first iteration of the loop  propt would be  name

User · Answer

If your environment supports ES2017 then I would recommend Object entries   Object entries obj  forEach   key  value     gt      console log    key    value           As shown in Mozillas Object entries   documentation      The Object entries   method returns an array of a given object s own   enumerable property  key  value  pairs  in the same order as that   provided by a for   in loop  the difference being that a for-in loop   enumerates properties in the prototype chain as well     Basically with Object entries we can forgo the following extra step that is required with the older for   in loop      This step is not necessary with Object entries if  object hasOwnProperty property          do stuff

User · Answer

You basically want to loop through each property in the object   JSFiddle  var Dictionary       If        you          can            make                sense            of        the          sentence            it              worked                           function Iterate obj      for  prop in obj        if  obj hasOwnProperty prop   amp  amp  isNaN prop           console log prop          obj prop          Iterate obj prop                Iterate Dictionary

User · Answer

What for  in loop does is that it creates a new variable  var someVariable  and then stores each property of the given object in this new variable someVariable  one by one  Therefore if you use block     you can iterate  Consider the following example    var obj          name  raman        hobby  coding        planet  earth           for var someVariable in obj        do nothing      console log someVariable      outputs planet

User · Answer

It s just a for   in loop  Check out the documentation at Mozilla

[javascript] Iterate through object properties

Examples related to javascript

Examples related to loops

Examples related to object