How to access [object object]

#1

Hello, I am making a filter for my school assignment. It dynamically filters the data based on the radio box.

I created an object to store my data. And I store the selected fruit into an array

const fruits = {
    "tomatos": {
      "Id": 1,
      "colors": ["red", "yellow", "orange", "black"],
    },
    "apple": {
      "Id": 2,
      "colors": ["red", "yellow", "black"]
     }
} 

const selected = []

I am able to filter the object, but I m having some issues getting the colors array.

showColors: function() {
      const filtered = Object.keys(fruits)
        .filter(key => selected.includes(key))
        .reduce((obj, key) => {
          obj[key] = fruits[key];
          return obj;
        }, {});
    }
  }

For example, if I check “Apple”, my selected will be [‘apple’], but for my filtered, I am getting

{
    "apple": {
      "Id": 2,
      "colors": ["red", "yellow", "black"]
     }
}

Instead of having an extra wrapping div, how can I get only the inside part

{
      "Id": 2,
      "colors": ["red", "yellow", "black"]
     }
#2

If your apple object is "Id": 2, "colors": ["red", "yellow", "black"], then apple.colors should return just ["red", "yellow", "black"]

#3

sorry, i dont get it

#4

Try changing your return obj statement to return obj.colors?

#5

I tried it :frowning: but it return undefined

#6

Maybe bracket notation then. obj[colors]?

#7

No :frowning: ReferenceError: colors is not defined. I think my filter function is wrong

#8

What does return obj return?

#9

it reutns: {apple: {…}}

#10

So, looking at your first post, let me know if I am understanding this correctly.
You have two radio buttons, one for “tomatos” and one for “apple”. If I click the “apple” radio button, it should run a function to return the “colors” for apple, right?

#11

that is what I wanna do, but my current return function does not return colors array, but it return {apple: {…}}

#12

Are you familiar with event listeners? You can set up an event listener so that when I click on the apple button, it returns apple.colors directly. There are some downsides to this, but it might work for what you are trying to accomplish.

#13

not very familiar. just know onChange

#14

You can also run a function for onClick.

#16