How to Recursively Iterate Through Nested Objects in JavaScript

Iterating Through Nested Objects Recursively

In this inquiry, the user seeks a mechanism to iterate over an object, its children, and its descendants recursively. Additionally, they wish to retrieve the name of each encountered node.

The for...in Loop

The solution lies in the JavaScript for...in loop. This loop iterates over the enumerable properties of an object. It can be employed as follows:

<code class="javascript">for (var key in foo) {
  if (key === "child") {
    // Perform an action specific to the "child" node
  }
}</code>

Handling Inherited Properties

Note that the for...in loop can iterate over both the object's own properties and inherited properties. To avoid acting on inherited properties, utilize the hasOwnProperty method:

<code class="javascript">for (var key in foo) {
  if (!foo.hasOwnProperty(key)) {
    continue; // Skip inherited properties
  }

  if (key === "child") {
    // Perform an action specific to the "child" node
  }
}</code>

Recursive Iteration

To perform the iteration recursively, a recursive function can be employed:

<code class="javascript">function eachRecursive(obj) {
  for (var k in obj) {
    if (typeof obj[k] === "object" && obj[k] !== null) {
      eachRecursive(obj[k]); // Recurse through the nested node
    } else {
      // Perform an action specific to the non-object node
    }
  }
}</code>

The above is the detailed content of How to Recursively Iterate Through Nested Objects in JavaScript. For more information, please follow other related articles on the PHP Chinese website!