How to safely access deeply nested object in Javascript

Issue #390

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 }, [])

Read more

• https://medium.com/javascript-inside/safely-accessing-deeply-nested-values-in-javascript-99bf72a0855a