Exploring nested objects in Javascript through iterating and extracting all properties in a continuous loop (Updated)

Question

Exploring nested objects in Javascript through iterating and extracting all properties in a continuous loop (Updated)

In my code, I created an object with two sub-objects structured like this:

 var testObject = { 
           "page":{
             "type": "ePurchase",
             "title":"Purchase confirmation"
             }, 
           "user": {
             "name": "Peter",
             "lastname": "Smith"
             }
            };

What I am trying to achieve is to have an input field in the html page where I can type a property name, such as "name", and then have the program loop through all the attributes of the object to see if there are any matches. My approach is as follows:

    var input = document.getElementById('propertyName').value; 
    for (var i=0; i < Object.keys(testObject).length; i++ ) {
       for (var j=0; j < Object.getOwnPropertyNames(testObject[i]).length; j++ ) {
          if(testObject[i].getOwnPropertyNames[j] == input) { 
             console.log("The relevant input value ");
          } 
       } 
   }

Therefore, if I type "name" in the input field, I expect to receive "Peter" as the output.

However, I encounter the error "Cannot covert undefined or null to object". How can I rectify this issue?

Additionally, given that I am new to JavaScript and programming in general, do you have any suggestions on improving this logic or expressing it more effectively?

Thank you for your assistance in advance! =)

javascript

Answer 1

Answer №1

It appears that the objects are being used incorrectly at inappropriate times.

Please review the console logs provided below:

var sampleObject = {
  "page": {
    "type": "eCommerce",
    "title": "Order confirmation"
  },
  "user": {
    "name": "John",
    "lastname": "Doe"
  }
};


var searchItem = "John" // document.getElementById('propertyName').value;
var properties = Object.keys(sampleObject);
for (var x = 0; x < properties.length; x++) {
  console.log(properties[x])
  var propNames = Object.getOwnPropertyNames(sampleObject[properties[x]])
  console.log(propNames)
  for (var y = 0; y < propNames.length; y++) {
    console.log(searchItem,propNames[y],sampleObject[properties[x]][propNames[y]])
    if (sampleObject[properties[x]][propNames[y]] == searchItem) {
      console.log("Match found");
    }
  }
}

Answer 2

It appears that the objects are being used incorrectly at inappropriate times.

Please review the console logs provided below:

var sampleObject = {
  "page": {
    "type": "eCommerce",
    "title": "Order confirmation"
  },
  "user": {
    "name": "John",
    "lastname": "Doe"
  }
};


var searchItem = "John" // document.getElementById('propertyName').value;
var properties = Object.keys(sampleObject);
for (var x = 0; x < properties.length; x++) {
  console.log(properties[x])
  var propNames = Object.getOwnPropertyNames(sampleObject[properties[x]])
  console.log(propNames)
  for (var y = 0; y < propNames.length; y++) {
    console.log(searchItem,propNames[y],sampleObject[properties[x]][propNames[y]])
    if (sampleObject[properties[x]][propNames[y]] == searchItem) {
      console.log("Match found");
    }
  }
}

Answer 3

Answer №2

Give this a shot

for (var index=0; index < Object.keys(dataObject).length; index++ ) {
var testObj = Object.keys(dataObject[Object.keys(dataObject)[index]])
       for (var k=0; k <testObj.length; k++ ) {
          if(testObj[k]== user_input) { 
             console.log("Record found");
          } 
       } 
   }

Answer 4

Give this a shot

for (var index=0; index < Object.keys(dataObject).length; index++ ) {
var testObj = Object.keys(dataObject[Object.keys(dataObject)[index]])
       for (var k=0; k <testObj.length; k++ ) {
          if(testObj[k]== user_input) { 
             console.log("Record found");
          } 
       } 
   }

Answer 5

Answer №3

Exploring the for..in StatementThe for...in statement allows us to iterate over the enumerable properties of an object, following its original insertion order. For each property, we can execute specific statements.

var testObject = {
        "page": {
            "type": "ePurchase",
            "title": "Purchase confirmation"
        },
        "user": {
            "name": "Peter",
            "lastname": "Smith"
        }
    };
    for (var outerObj in testObject) {
        for (var innerObj in testObject[outerObj]) {
            if (testObject[outerObj][innerObj] === "Smith") { // document.getElementById('propertyName').value;
                console.log("Record matched");
            }
        }
    }

Let's delve into understanding JSON notation and objects in JavaScript. An object comprises key-value pairs within a JSON structure, allowing access to both keys and values when using a 'for..in' loop. In this scenario, testObject represents a JavaScript object. By iterating over it with 'for..in', we retrieve keys like outerObj which correspond to values, themselves being objects. This enables further nested iterations with innerObj, providing insights into the values linked to these keys. I hope this explanation clarifies the concept for you!

Answer 6

Exploring the for..in StatementThe for...in statement allows us to iterate over the enumerable properties of an object, following its original insertion order. For each property, we can execute specific statements.

var testObject = {
        "page": {
            "type": "ePurchase",
            "title": "Purchase confirmation"
        },
        "user": {
            "name": "Peter",
            "lastname": "Smith"
        }
    };
    for (var outerObj in testObject) {
        for (var innerObj in testObject[outerObj]) {
            if (testObject[outerObj][innerObj] === "Smith") { // document.getElementById('propertyName').value;
                console.log("Record matched");
            }
        }
    }

Let's delve into understanding JSON notation and objects in JavaScript. An object comprises key-value pairs within a JSON structure, allowing access to both keys and values when using a 'for..in' loop. In this scenario, testObject represents a JavaScript object. By iterating over it with 'for..in', we retrieve keys like outerObj which correspond to values, themselves being objects. This enables further nested iterations with innerObj, providing insights into the values linked to these keys. I hope this explanation clarifies the concept for you!

Exploring nested objects in Javascript through iterating and extracting all properties in a continuous loop (Updated)

Answer №1

Answer №2

Answer №3

Similar questions

Transferring information to the server with JSON in the Codeigniter framework

Ways to retrieve the child number using JavaScript or PHP

Error: Unable to set reference. The initial argument includes an undefined value in the 'gender' property of 'Users.ji8A7TkSldfdvieDqGxko9eV3Jy1'

Discovering the worth of an array property in JavaScript

Error code 405 (METHOD NOT ALLOWED) is received when attempting to make a post request to an API

When attempting to make a post using Prisma's ORM, users may encounter an error message indicating that the post function

Is React failing to identify parameters?

What is the process for setting default parameters using a recompose, lifecycle HOC?

Quasar - Optimize for varied platforms

Is it possible to add a personalized parameter to an unnamed JavaScript replace function?

When opening a dialog at the bottom of the page, the window will automatically scroll to the top

Associating an event with a newly created element in Angular2

The event "subscriptionRemoved" is not being triggered when a password change is made on the Microsoft Graph API

How to use $$[n] in Spectron/WebdriverIO to target the nth child element instead of the selector

What is the best way to retrieve a complete DynamoDB scan response using aws-sdk-js-v3 without object types included in the marshaled response?

Encountering an issue with Meteor and node-celery: "Unable to access property 'slice' of null"

Achieving JSON element sorting in the most effective way

activate the bootstrap popover by double-clicking instead of a single click

Implementing a function to specify size limits

Tips for creating dynamic alerts using mui v5 Snackbar