An object 's property can be null or undefined.
Accessing step by step is tedious
props.user &&
props.user.posts &&
props.user.posts[0] &&
props.user.posts[0].comments
Dynamic parsing path is too clever and involves string in the end, which is a no no
const get = (p, o) =>
p.reduce((xs, x) => (xs && xs[x]) ? xs[x] : null, o)
const getUserComments = get(['user', 'posts', 0, 'comments'])
Instead let's use function and catch errors explicitly, and defaults with a fallback
const get: (f, defaultValue) => {
try {
const value = f()
if (isNotNullOrUndefined(value)) {
return value
} else {
return defaultValue
}
} catch {
return defaultValue
}
}
const comments = get(() => { .user.posts[0].comments }, [])
Top comments (2)
For this purpose I'd recommend using what majority of devs use for this purpose: lodash.
This makes code easier for more people to understand. Also, using
try ... catchand creation of new function for each iteration might hurt performance in tight loops. lodash implementation is both optimized for performance and has tests for edge cases.Just make sure to use the import like in the above. :)
I've unfortunately seen waaay to many projects include the entire lodash library for just one or two functions...
Or even worse for already poly-filled array methods.. :D