-1

I'm looking for a vanilla javascript solution to find an object using one or more conditions.

Ideally, I'd like to use a similar syntax as lodash.find and a reusable function that can take one or more conditions:

_.find(products, {code:"BLK")
_.find(products, {code:"BLK", sale: false})

In my case, I'm looking for one object, so I'd prefer find over filter.

const products = [
  {
    title: "Shirt",
    color: "Black",
    code: "BLK",
    sale: true
  },
  {
    title: "Better Shirt",
    color: "Black",
    code: "BLK",
    sale: false
  },
  {
    title: "Blue Shirt",
    color: "Blue",
    code: "BLU",
    sale: false
  }
]

// Lodash find using multiple conditions
console.log(_.find(products, {code:"BLK", sale: false}))

// Find all using one condition
console.log(products.filter(product => product.color === 'Black'))

// Find single with multiple conditions
console.log(products.find(product => product.color === 'Black' && product.sale === false ))
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js"></script>

How can I emulate the functionality of _.find from lodash in simple, vanilla js?

Seph Reed
  • 8,797
  • 11
  • 60
  • 125
RustyDev
  • 1,094
  • 1
  • 9
  • 18
  • 1
    Have a look at the lodash sourcecode? – Jonas Wilms Aug 22 '19 at 17:44
  • 2
    Here's the answer in gist: https://gist.github.com/SephReed/82eb00e44075576d4f778bfd71817c76 Why would marking a question as "unclear" make it unanswerable? If someone can answer it, it's obviously clear enough. – Seph Reed Aug 22 '19 at 17:51
  • 1
    Should be closed as a duplicate of [Find object by id in an array of JavaScript objects](https://stackoverflow.com/q/7364150/215552) – Heretic Monkey Aug 22 '19 at 20:43
  • Or [get one item from an array of name,value JSON](https://stackoverflow.com/q/7075485/215552) – Heretic Monkey Aug 22 '19 at 20:51

1 Answers1

2

You can clone the lodash behaviour by using Array.prototype.find and inside the callback you check each key and value of the individual objects in your supplied array with the filter object you pass as the second argument obj using Array.prototype.every():

const products = [
  {
    title: "Shirt",
    color: "Black",
    code: "BLK",
    sale: true
  },
  {
    title: "Better Shirt",
    color: "Black",
    code: "BLK",
    sale: false
  },
  {
    title: "Blue Shirt",
    color: "Blue",
    code: "BLU",
    sale: false
  }
]
function find(arr, obj){
  return arr.find((ele) => {
    return obj && Object.keys(obj).every(key => ele[key] === obj[key]);
  }) || arr[0];
}

// Lodash find using multiple conditions
console.log(find(products, {code:"BLK", sale: false}));
console.log(find(products, {title:"Blue Shirt", sale: false}));
console.log(find(products, undefined));
console.log(find(products, {}));
console.log(find(products, {title:"Better Shirt", sale: true}))
Fullstack Guy
  • 16,368
  • 3
  • 29
  • 44