JavaScript Filter Function: filtering based on multiple conditions (either one can evaluate to true)

Question

JavaScript Filter Function: filtering based on multiple conditions (either one can evaluate to true)

I seem to be missing something very simple here.

I am working with an array of objects that contains various information. Depending on user interaction, I want to filter out certain objects;

let arr = [
 {'num': 1, 'name': 'joe'},
 {'num': 2, 'name': 'jane'},
 {'num': 3, 'name': 'john'},
 {'num': 3, 'name': 'johnny'},
]

This is what I have attempted so far:

 function filterArr(arr) {
  return arr.filter(obj => {
    if(obj.num && obj.num !== 1) {
      return obj;
    }
    if(obj.num && obj.num !== 3) {
     return obj;
    }
  })
}

After running the filterArr function, I receive the original array back instead of just {'num': 2, 'name': 'jane'},, as expected. I have added console.log statements inside both nested conditions.

I would appreciate any assistance with filtering the array based on one of two conditions being true.

javascript arrays algorithm filter filtering

Answer 1

Answer №1

Each and every num will satisfy one of your if conditions because it is impossible for a number to be equal to both 1 and 3 simultaneously**. You can easily string together the && condition within the filter function to validate all numbers:

let arr = [
 {'num': 1, 'name': 'joe'},
 {'num': 2, 'name': 'jane'},
 {'num': 3, 'name': 'john'},
 {'num': 3, 'name': 'johnny'},
]

let filtered = arr.filter(a => a.num && a.num !== 3 && a.num !== 1)

console.log(filtered)

(**Unless it's 0, null, undefined or any other falsy value. In these cases, they will not meet the requirements set by the obj.num condition in either if statement)

Answer 2

Each and every num will satisfy one of your if conditions because it is impossible for a number to be equal to both 1 and 3 simultaneously**. You can easily string together the && condition within the filter function to validate all numbers:

let arr = [
 {'num': 1, 'name': 'joe'},
 {'num': 2, 'name': 'jane'},
 {'num': 3, 'name': 'john'},
 {'num': 3, 'name': 'johnny'},
]

let filtered = arr.filter(a => a.num && a.num !== 3 && a.num !== 1)

console.log(filtered)

(**Unless it's 0, null, undefined or any other falsy value. In these cases, they will not meet the requirements set by the obj.num condition in either if statement)

Answer 3

Answer №2

First things first, let's analyze the issue at hand.

You encountered a situation where you had two conditions; one checking for inequality to 1, and the other checking for inequality to 3. For instance, if num = 1, the first condition fails but the second one succeeds, leading to the return of true in all cases.

The solution is to combine both conditions into a single if statement.

let arr = [{'num': 1, 'name': 'joe'},{'num': 2, 'name': 'jane'},{'num': 3, 'name': 'john'},{'num': 3, 'name': 'johnny'},]

function filterArr(arr) {
  return arr.filter(obj => obj.num !== 1 && obj.num!=3)
}

console.log(filterArr(arr))

Answer 4

First things first, let's analyze the issue at hand.

You encountered a situation where you had two conditions; one checking for inequality to 1, and the other checking for inequality to 3. For instance, if num = 1, the first condition fails but the second one succeeds, leading to the return of true in all cases.

The solution is to combine both conditions into a single if statement.

let arr = [{'num': 1, 'name': 'joe'},{'num': 2, 'name': 'jane'},{'num': 3, 'name': 'john'},{'num': 3, 'name': 'johnny'},]

function filterArr(arr) {
  return arr.filter(obj => obj.num !== 1 && obj.num!=3)
}

console.log(filterArr(arr))

JavaScript Filter Function: filtering based on multiple conditions (either one can evaluate to true)

Answer №1

Answer №2

Similar questions

Utilizing array iteration to display images

Issues of unfulfilled requirements in the recent npm (and node) updates

Is it possible to arrange two items in one column and the rest as columns in MaterialUI Grid?

Updating the value of a Redux-Form Checkbox Field using programming methods

Cleve js does not include delimiters in its date output

I'm having trouble getting my application to output to the console. What could be the issue?

What can I do to prevent masonry images from piling on top of one another?

What is the proper way to utilize JQuery and Ajax to communicate with a global function in writing?

Dealing with an empty request.FILES using FileUploadParser in Django Rest Framework and Angular file upload technique

How can JavaScript be used to parse an XML file? Should we consider using SAX for handling large XML files

How to dynamically display a div in Vue.js depending on the attributes of another element

What is the method to define a loosely typed object literal in a TypeScript declaration?

PANDAS: Transforming arrays into individual numbers in a list

Having trouble converting Buffered Byte Array into Image in Browser

Can TypeScript be used to dynamically render elements with props?

Is there a method in AngularJS to have $http.post send request parameters rather than JSON?

Mobile devices do not support HTML5 Video playback

React Intersection Observer Triggering Memory Leaks

The charAt function in a basic JavaScript if statement is failing to execute

Is it possible to refresh text in table without clearing icons?