Ensure es6 find don't break when property is not defined

Question

I have this code

const arr = [{
  id: 1,
  name: 'anything'
}, {
  id: 2,
  name: 'something'
}]

const target = [1]

I want to find whether target has 1 and I want the name property value

I'll do

arr.find(o => target.includes(o.id)).name

but this will break if

arr.find(o => target.includes(o.id)) doesn't have the name property, it break the entire app and throw error.

So how to ensure this from being crashed? I can do this but it's ugly

const somethingValue = arr.find(o => target.includes(o.id)) && arr.find(o => target.includes(o.id)).name

or I have to map to ensure the arr always have name property, I have to do this if the arr is dynamic and the south comes from external party.

Any other way to solve this?

score 1 · Answer 1 · answered May 17 '19 at 09:51

1

Extract the result from .find into a variable first, and then check to see if that variable is defined:

const foundObject = arr.find(o => target.includes(o.id));
const somethingValue = foundObject ? foundObject.name : null;

answered May 17 '19 at 09:51

yeah I know this but it's a 2 steps thing – Charles Jr. May 17 '19 at 09:56
1

Don't be afraid of defining variables - there's no need to create an extra object just to extract a non-existent property – CertainPerformance May 17 '19 at 09:58

Maheer Ali · Accepted Answer · 2019-05-17T09:55:09.567

1

You can use empty object {} and || operator.

(arr.find(o => target.includes(o.id)) || {}).name

If find() will return undefined so the expression will evaluate to {} and try to get name from {} which is undefined

edited May 17 '19 at 09:55

answered May 17 '19 at 09:51

Maheer Ali

2 Answers2