What is the method to determine the size of an array of objects where each object contains its own internal array?

Question

What is the method to determine the size of an array of objects where each object contains its own internal array?

Here is the data that I have:

var a=[
        {
            name: "time",
            Details:[
                {value:"month",checked:true,id:1}
            ]
        },
        {
            name: "product",
            Details:[
                {value:"abc",checked:true,id:2},
                {value:"abx",checked:false,id:3}
            ]
        }
    ]

My goal is to efficiently find the count of checked items. In this example, the count is 2. Can someone suggest an optimized approach to achieve this without using a for loop or nested filters?

javascript angular typescript

Answer 1

Answer №1

You should consider using standard reducers in this scenario.

const items=[
  {
    title: "time",
    details:[
    {value:"month",selected:true,id:1}
    ]
  },
  {
    title: "product",
    details:[
    {value:"abc",selected:true,id:2},
    {value:"abx",selected:false,id:3}
    ]
  }
]

const totalSelected = items.reduce((total, item) => total + item.details.reduce((all, detail) => all + (detail.selected === true ? 1 : 0), 0), 0)

console.log(totalSelected);

Here is the code snippet in a more organized manner:

const totalSelected = items.reduce((total, item) => {
  return total + item.details.reduce((innerTotal, detail) => {
    if (detail.selected) {
      return innerTotal + 1;
    } else {
      return innerTotal;
    }
  }, 0), 
 }, 0);

Answer 2

You should consider using standard reducers in this scenario.

const items=[
  {
    title: "time",
    details:[
    {value:"month",selected:true,id:1}
    ]
  },
  {
    title: "product",
    details:[
    {value:"abc",selected:true,id:2},
    {value:"abx",selected:false,id:3}
    ]
  }
]

const totalSelected = items.reduce((total, item) => total + item.details.reduce((all, detail) => all + (detail.selected === true ? 1 : 0), 0), 0)

console.log(totalSelected);

Here is the code snippet in a more organized manner:

const totalSelected = items.reduce((total, item) => {
  return total + item.details.reduce((innerTotal, detail) => {
    if (detail.selected) {
      return innerTotal + 1;
    } else {
      return innerTotal;
    }
  }, 0), 
 }, 0);

Answer 3

Answer №2

To achieve the desired outcome, you must utilize two nested forEach() functions:

var items = [{
    name: "time",
    details: [{
      value: "month",
      checked: true,
      id: 1
    }]
  },
  {
    name: "product",
    details: [{
        value: "abc",
        checked: true,
        id: 2
      },
      {
        value: "abx",
        checked: false,
        id: 3
      }
    ]
  }
];

var count = 0;
items.forEach(({details}) => details.forEach(({checked}) => {
  if(checked){
    count++;
  }
}));


console.log(count);

Answer 4

To achieve the desired outcome, you must utilize two nested forEach() functions:

var items = [{
    name: "time",
    details: [{
      value: "month",
      checked: true,
      id: 1
    }]
  },
  {
    name: "product",
    details: [{
        value: "abc",
        checked: true,
        id: 2
      },
      {
        value: "abx",
        checked: false,
        id: 3
      }
    ]
  }
];

var count = 0;
items.forEach(({details}) => details.forEach(({checked}) => {
  if(checked){
    count++;
  }
}));


console.log(count);

Answer 5

Answer №3

Give this a try, I'm confident it will work for your issue

    let TotalCount=0;
var b=[
            {
                type: "color",
                Info:[
                    {name:"red",selected:true,id:1}
                ]
            },
            {
                type: "size",
                Info:[
                    {name:"medium",selected:true,id:2},
                    {name:"large",selected:false,id:3}
                ]
            }
        ];
b.map(function(item,key){
item.Info.map(function(subItem, subKey){
if( subItem.selected==true){
TotalCount++;
}
});
});

Answer 6

Give this a try, I'm confident it will work for your issue

    let TotalCount=0;
var b=[
            {
                type: "color",
                Info:[
                    {name:"red",selected:true,id:1}
                ]
            },
            {
                type: "size",
                Info:[
                    {name:"medium",selected:true,id:2},
                    {name:"large",selected:false,id:3}
                ]
            }
        ];
b.map(function(item,key){
item.Info.map(function(subItem, subKey){
if( subItem.selected==true){
TotalCount++;
}
});
});

Answer 7

Answer №4

If you want to retrieve all details with a checked value, you can utilize a combination of different functions:

a.map(item => item.Details).flat().filter(item => item.checked)

Begin by mapping the items, then flatten the results into a single array, and finally filter based on the checked value.

Answer 8

If you want to retrieve all details with a checked value, you can utilize a combination of different functions:

a.map(item => item.Details).flat().filter(item => item.checked)

Begin by mapping the items, then flatten the results into a single array, and finally filter based on the checked value.

What is the method to determine the size of an array of objects where each object contains its own internal array?

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Manage the jQuery resize handles by controlling their behavior when clicked inside and outside of the corresponding DIV

Having trouble with basic authorization for Facebook API using JavaScript?

Why is it necessary to include "ref" in the mongoose schema below? What potential consequences could arise if it is omitted?

After updating my Ionic Android App to Angular 12, it got stuck on a blank white screen with an error message stating: "goog.getLocale is

Choose does not showcase the updated value

interactive symbols in a reorganizable tree structure

Issue occurred: The error "Undefined offset 1" was encountered while trying to upload a file via

click event not triggering custom hook

Transforming a JavaScript chained setter into TypeScript

Strengthening the core: Preserving a full set of data on a server that doesn't

How can a PrivateRoute component effectively handle waiting for an asynchronous response?

The expandable column headers in Primeng are mysteriously missing

How can I retrieve the height of a dynamically generated div in Angular and pass it to a sibling component?

Before proceeding to update in Angular 8, ensure the repository is not dirty. Commit or stash any changes that have been

Converting a JavaScript variable into PHP using ajax: A comprehensive guide

Access your Angular 2 application on an external device during the development process

How does the "deliver_order" function retrieve the value of the name parameter?

Tips for implementing a switch-case statement with variable formats that may not always be

Using TypeScript to Declare Third Party Modules in Quasar

Setting up a plan for executing Javascript server side scripts