Javascript Look through Array of Objects

Question

First time posting a question. Hunted through stackoverflow for the answer but didn't find it. If I missed it, and this is a duplicate question, please comment a link and I'll delete this! (newbie here)

So basically, I have an array them_dogs containing objects. I am trying to write a function that accepts an array and an object value, say 'tennis ball'. This function will then look through each item in the array and check to see if the value 'tennis ball' is present. If so, it will return the item name.

var them_dogs = [{
        name: 'Henry',
        age: 0.5,
        breed: 'Aussie',
        food: 'kibble',
        toys: ['tennis ball', 'chew toy'],
        picture: 'http://rubyriverminiaustralianshepherds.com/wp-content/uploads/aussie-puppy-for-sale-940x412.jpg'
    }, {
        name: 'Tilly',
        age: 5,
        breed: 'Mutt',
        food: 'kibble',
        toys: ['bone', 'kong', 'squeaky toy'],
        picture: 'http://www.dogchannel.com/images/zones/top_promo/excited-mixed-breed.jpg'
    }, {
        name: 'Apollo',
        age: 10,
        breed: 'Labrador',
        food: 'absolutely anything',
        toys: ['old sock', 'other old sock', 'more old socks'],
        picture: 'http://media.cmgdigital.com/shared/img/photos/2014/08/01/5a/66/LadyLabrador.jpg'
    }]

Here is the function

    var findDogByToy = function (arr, toyname) {
      arr.forEach (function (item) {
        if (item.toys === toyname) {
          return item.name;
        }
      })
    }

findDogByToy(them_dogs, 'tennis ball');

Using forEach is not the right solution when you want to find one item. What happens if two animals have the same toy? — epascarello, Jul 25 '15 at 00:42

score 2 · Accepted Answer · answered Jul 25 '15 at 01:35

As others have mentioned, using forEach to solve this problem is a naive approach, however for beginners to Array functions, this explanation may prove to be useful for your understanding:

function findDogByToy(array, toy) {
  // loop across each item in the array
  var result;
  array.forEach(function(dog) {
    // check that item (which is an object) to see if toy is in there
    dog.toys.forEach(function(item) {
      //if it is, then return item name
      if (item === toy) {
        result = dog.name;
      }
    });
  });
  return result;
}

score 1 · Answer 2 · edited May 23 '17 at 12:06

Instead of forEach, use every. every is cleaner since you are not looking to modify any elements. Also, it is harder to break out of a forEach. See how to stop Javascript forEach?
Use indexOf to detect if the toyname exists in the toys array
findDogByToy needs to actually return a value to benefit the caller

var them_dogs = [{
  name: 'Henry',
  age: 0.5,
  breed: 'Aussie',
  food: 'kibble',
  toys: ['tennis ball', 'chew toy'],
  picture: 'http://rubyriverminiaustralianshepherds.com/wp-content/uploads/aussie-puppy-for-sale-940x412.jpg'
}, {
  name: 'Tilly',
  age: 5,
  breed: 'Mutt',
  food: 'kibble',
  toys: ['bone', 'kong', 'squeaky toy'],
  picture: 'http://www.dogchannel.com/images/zones/top_promo/excited-mixed-breed.jpg'
}, {
  name: 'Apollo',
  age: 10,
  breed: 'Labrador',
  food: 'absolutely anything',
  toys: ['old sock', 'other old sock', 'more old socks'],
  picture: 'http://media.cmgdigital.com/shared/img/photos/2014/08/01/5a/66/LadyLabrador.jpg'
}];

var findDogByToy = function(arr, toyname) {
  var name;
  arr.every(function(item) {
    if (item.toys.indexOf(toyname) > -1) {
      name = item.name;
      return false;
    }
  });
  return name;
}


console.log(findDogByToy(them_dogs, 'tennis ball'));

score 1 · Answer 3 · answered Jul 25 '15 at 00:54

I think you might want to use filter() and map() and not forEach(). This way if you have more than one, you will get an array of names.

var them_dogs = [{
        name: 'Henry',
        age: 0.5,
        breed: 'Aussie',
        food: 'kibble',
        toys: ['tennis ball', 'chew toy'],
        picture: 'http://rubyriverminiaustralianshepherds.com/wp-content/uploads/aussie-puppy-for-sale-940x412.jpg'
    }, {
        name: 'Tilly',
        age: 5,
        breed: 'Mutt',
        food: 'kibble',
        toys: ['bone', 'kong', 'squeaky toy'],
        picture: 'http://www.dogchannel.com/images/zones/top_promo/excited-mixed-breed.jpg'
    }, {
        name: 'Apollo',
        age: 10,
        breed: 'Labrador',
        food: 'absolutely anything',
        toys: ['old sock', 'other old sock', 'more old socks'],
        picture: 'http://media.cmgdigital.com/shared/img/photos/2014/08/01/5a/66/LadyLabrador.jpg'
    }]

    var findDogByToy = function (arr, toyname) {
      return arr.filter (function (item) {
        return item.toys.indexOf(toyname) > -1;
      }).map( function(o){ return o.name; });
    }

console.log(findDogByToy(them_dogs, 'tennis ball'));

Other option, just use a simple for loop and push to an array.

nice approach using `filter` and **yes** the OP could definitely make use of having multiple names returned instead of the first one — AmmarCSE, Jul 25 '15 at 01:22

Javascript Look through Array of Objects

3 Answers3