A feature in Lodash called 'exclude' using both property and array input

Question

A feature in Lodash called 'exclude' using both property and array input

I need to create a function that uses lodash's "without" method, which involves an object property and an array of values, similar to the "include" method.

Here is my code for the "_.include()" function:

 this.filters = {} //function for filtering data in table based on column name
 this.columnName = 'id'

 this.tempQuery = [1,2]

 this.data = [
 {
  id: 1,
  name: 'aaa',
  rejectedNumber: 1
 },  
 {
  id: 2,
  name: 'bbb',
  rejectedNumber: 2
 },
 {
  id: 3,
  name: 'ccc',
  rejectedNumber: 3
 }
]

 this.filters[this.columnName] = _.partial(_.includes, this.tempQuery);

 this.filteredData = _.filter( this.data, _.conforms( this.filters ));

And here is the resulting output:

 this.filteredData = [ 
{
  id: 1,
  name: 'aaa',
  rejectedNumber: 1
 },  
 {
  id: 2,
  name: 'bbb',
  rejectedNumber: 2
 }]

However, I am unable to achieve the same results with the "_.without" function.

this.filters[this.columnName] = _.partial(_.without, this.tempQuery);

Unfortunately, it did not work as expected and returned all the data...

Does anyone have any suggestions on how to implement this using lodash functions?

javascript angular typescript lodash

Answer 1

Answer №1

Replacing _.includes with _.without is not a simple task, as they are not directly opposites of each other. While both functions can take an array as their first argument, their purposes and outputs differ:

_.includes returns a boolean indicating whether the second argument exists in the array
_.without returns a new array that excludes the specified value(s) from the original array.

Since arrays are always considered truthy, using _.conform based on _.without will always yield a true result.

To create the true opposite of _.includes, you can utilize _.negate instead of _.without:

this.filters[this.columnName] = _.partial(_.negate(_.includes), this.tempQuery);

If you prefer not to modify your use of _.filter, another option could be to negate it using _.reject.

Answer 2

Replacing _.includes with _.without is not a simple task, as they are not directly opposites of each other. While both functions can take an array as their first argument, their purposes and outputs differ:

_.includes returns a boolean indicating whether the second argument exists in the array
_.without returns a new array that excludes the specified value(s) from the original array.

Since arrays are always considered truthy, using _.conform based on _.without will always yield a true result.

To create the true opposite of _.includes, you can utilize _.negate instead of _.without:

this.filters[this.columnName] = _.partial(_.negate(_.includes), this.tempQuery);

If you prefer not to modify your use of _.filter, another option could be to negate it using _.reject.

Answer 3

Answer №2

To filter your collection, you can use the _.filter method to iterate over it and return a truthy or falsey value based on your filtering criteria. Another option is to check if a specific value exists in the collection using the _.includes method. By combining these methods, you can create a new array with the filtered data.

Check out this Pen for a working example: https://codepen.io/joshuakelly/pen/aPgLmL

const tempQuery = [1, 2];
const data = [
 {
  id: 1,
  name: 'aaa',
  rejectedNumber: 1
 },  
 {
  id: 2,
  name: 'bbb',
  rejectedNumber: 2
 },
 {
  id: 3,
  name: 'bbb',
  rejectedNumber: 3
 }
];

const withFilteredData = _.filter(data, col => _.includes(tempQuery, col.id));
const withoutFilteredData = _.filter(data, col => !_.includes(tempQuery, col.id));

console.log(withFilteredData, withoutFilteredData);

Answer 4

To filter your collection, you can use the _.filter method to iterate over it and return a truthy or falsey value based on your filtering criteria. Another option is to check if a specific value exists in the collection using the _.includes method. By combining these methods, you can create a new array with the filtered data.

Check out this Pen for a working example: https://codepen.io/joshuakelly/pen/aPgLmL

const tempQuery = [1, 2];
const data = [
 {
  id: 1,
  name: 'aaa',
  rejectedNumber: 1
 },  
 {
  id: 2,
  name: 'bbb',
  rejectedNumber: 2
 },
 {
  id: 3,
  name: 'bbb',
  rejectedNumber: 3
 }
];

const withFilteredData = _.filter(data, col => _.includes(tempQuery, col.id));
const withoutFilteredData = _.filter(data, col => !_.includes(tempQuery, col.id));

console.log(withFilteredData, withoutFilteredData);

A feature in Lodash called 'exclude' using both property and array input

Answer №1

Answer №2

Similar questions

Encountering a Typescript error while attempting to convert a JavaScript file to Typescript within an Express

A guide on utilizing the React Suite range slider in rsuite

Using ReactJS and Ruby on Rails to implement an AJAX delete request

Ways to invoke a slice reducer from a library rather than a React component

Ways to transfer a variable from a Node.js script to a JavaScript file on the client side

Display the directive after including JavaScript on the webpage

Create a single HTML page with multiple images displayed

Class fully loaded with Angular 2

Including JavaScript in HTML Error 404

Trilateration of three-dimensional points using K vertices on each face

TreeView Filtering

Switch out the URL in npm's build process

There seems to be an issue with the next function's functionality within a Nodejs middleware

Dynamic backdrop featuring engaging content

Having trouble getting the ng-bootstrap Rating component to function on Angular 6?

Floating motion when dragging

Transferring information to the specified link using AJAX and PHP

My software consistently triggers the default servlet

Angular-Daterangepicker: Dynamically Updating Start Date Selection

Is there a way to use Javascript to determine if a string within a JSON object has been altered?