Filter an array of objects in Javascript and determine the number of elements that meet the filtering criteria

Question

Filter an array of objects in Javascript and determine the number of elements that meet the filtering criteria

I have a collection of various objects structured like the following:

[{
   color:'red',
   'type':'2',
   'status':'true'
 },
 {
   color:'red',
   'type':'2',
   'status':'false'
 }]

My goal is to filter the elements by status and then tally the filtered results. For example, if the status is false, then return 1.

Below is the code I attempted, but I'm unsure of my approach:

for (i = 0; i < check.length; i++) {
  var check2;

  console.log(check[i].isApproved);
  (function(check2) {
    return check2 = check.filter(function(val) { 
        return val == false 
    }).length;
  })(check2)

  console.log('again Rides',check2);
}

javascript arrays filter

Answer 1

Answer №1

To clarify, you are looking to tally the instances where the status is 'false'. It's important to note that the values in status are strings.

var items = [
  { color:'red', 'type':'2', 'status':'true' }, 
  { color:'red', 'type':'2', 'status':'false' } 
];

var countMatches = items.filter(function(item){
    return item.status === 'false';
}).length

console.log(countMatches);

Answer 2

To clarify, you are looking to tally the instances where the status is 'false'. It's important to note that the values in status are strings.

var items = [
  { color:'red', 'type':'2', 'status':'true' }, 
  { color:'red', 'type':'2', 'status':'false' } 
];

var countMatches = items.filter(function(item){
    return item.status === 'false';
}).length

console.log(countMatches);

Answer 3

Answer №2

Consider the following data set:

const elements = [
  { color:'blue', type:'1', status:'true' }, 
  { color:'blue', type:'2', status:'false' } 
];

Here are a couple of methods to address the issue:

Utilizing reduce

const falseCount = elements.reduce((num, element) => element.status === 'false' ? num+1 : num, 0)

Using filter approach

const falseCount = elements.filter(item => item.status === 'false').length;

Please take note that as per

const elements = [
  { color:'red', type:'2', status:'true' }, 
  { color:'red', type:'2', status:'false' } ,
  { color:'red', type:'2', status:'false' } ,
  { color:'green', type:'1', status:'false' } ,
  { color:'red', type:'1', status:'true' } 
]

const falseNb = elements.reduce((n, e) => e.status === 'false' ? n+1 : n, 0)

document.getElementById('result1').innerHTML = falseNb

const falseNbFilter = elements.filter(e => e.status === 'false').length

document.getElementById('result2').innerHTML = falseNb

body { background: #333; color: #0f0; font-family: monospace}

<pre>
[
  { color:'red', type:'2', status:'true' }, 
  { color:'red', type:'2', status:'false' } ,
  { color:'red', type:'2', status:'false' } ,
  { color:'green', type:'1', status:'false' } ,
  { color:'red', type:'1', status:'true' } 
]
</pre>
Result with Reduce => <span id='result1'></span><br><br>

Result with Filter => <span id='result2'></span>

Answer 4

Consider the following data set:

const elements = [
  { color:'blue', type:'1', status:'true' }, 
  { color:'blue', type:'2', status:'false' } 
];

Here are a couple of methods to address the issue:

Utilizing reduce

const falseCount = elements.reduce((num, element) => element.status === 'false' ? num+1 : num, 0)

Using filter approach

const falseCount = elements.filter(item => item.status === 'false').length;

Please take note that as per

const elements = [
  { color:'red', type:'2', status:'true' }, 
  { color:'red', type:'2', status:'false' } ,
  { color:'red', type:'2', status:'false' } ,
  { color:'green', type:'1', status:'false' } ,
  { color:'red', type:'1', status:'true' } 
]

const falseNb = elements.reduce((n, e) => e.status === 'false' ? n+1 : n, 0)

document.getElementById('result1').innerHTML = falseNb

const falseNbFilter = elements.filter(e => e.status === 'false').length

document.getElementById('result2').innerHTML = falseNb

body { background: #333; color: #0f0; font-family: monospace}

<pre>
[
  { color:'red', type:'2', status:'true' }, 
  { color:'red', type:'2', status:'false' } ,
  { color:'red', type:'2', status:'false' } ,
  { color:'green', type:'1', status:'false' } ,
  { color:'red', type:'1', status:'true' } 
]
</pre>
Result with Reduce => <span id='result1'></span><br><br>

Result with Filter => <span id='result2'></span>

Answer 5

Answer №3

To determine the number of objects with a specific status, you have two options: you can either count them directly or use a filter and find the length of the resulting array.

var count = 0;
var arr = [{color:'red', type:'2', status:'true'},
           {color:'red', type:'2', status:'false'} ];
// Demonstrating the robustness of filtering. For simplicity, you could achieve
// the same result in a loop if you don't require the subarray. 
var filtered = arr.filter ( function ( d ) {
    // Since your objects contain string values for 'status', checking against strings is necessary.
    // If the status was boolean, you'd use if ( d.status ) { ... }
    count++;
    return d.status === 'false';
});

// Both counts should be equivalent, representing the number of objects with status 'false'
console.log ( count );
console.log ( filtered.length );
// This will display the subarray of objects with status set to 'false'
console.log ( filtered );

Answer 6

To determine the number of objects with a specific status, you have two options: you can either count them directly or use a filter and find the length of the resulting array.

var count = 0;
var arr = [{color:'red', type:'2', status:'true'},
           {color:'red', type:'2', status:'false'} ];
// Demonstrating the robustness of filtering. For simplicity, you could achieve
// the same result in a loop if you don't require the subarray. 
var filtered = arr.filter ( function ( d ) {
    // Since your objects contain string values for 'status', checking against strings is necessary.
    // If the status was boolean, you'd use if ( d.status ) { ... }
    count++;
    return d.status === 'false';
});

// Both counts should be equivalent, representing the number of objects with status 'false'
console.log ( count );
console.log ( filtered.length );
// This will display the subarray of objects with status set to 'false'
console.log ( filtered );

Filter an array of objects in Javascript and determine the number of elements that meet the filtering criteria

Answer №1

Answer №2

Utilizing reduce

Using filter approach

Answer №3

Similar questions

Navigating through property objects in Vue: accessing individual elements

Store vueJs data in browser's localStorage

tips for replacing multiple route parameters in Angular using the replace function

Removing dropdown lists from input forms can be achieved without using jQuery by utilizing vanilla JavaScript

Search and extract JSON data in MySQL

Error: Attempting to access 'props' property of undefined when clicking on a button within a React application leads to a TypeError

Vue - Error Message from Eslint Regarding Absence of Variable in Setup Function

Angular 5 arrays within arrays

Error message 800A03EA in Windows Script Host encountered while running Express.js script

Laravel and Vue: tackling pagination issues in a Vue.js and Laravel application

Accessing the identical file concurrently through ajax 12 times

The toggle feature doesn't seem to be working properly in Bootstrap 5

Fetching various data from MongoDB using NodeJS and presenting it in Jade(Pug) template

The element 'flat' is not found within the specified type

Testing infinite scrolling with the help of protractor

Obtain the value of a two-handle slider using jQuery

Simple yet perplexing JavaScript within an Angular directive

I'm looking to add CSS transitions, like fade-ins, to a list of items in React in a way that the animations occur one after the other upon rendering. How can this be achieved?

What is the best way to convert a requested JSON array into a CSV file using Python?

Sending files to different URLs based on their type for upload