Usando javascript puro, sin terceros / lodash, etc.
Dado que un usuario busca la existencia de un nodo anidado profundo, ¿existe una forma más limpia de garantizar que cada nodo principal exista para no devolverlo indefinido?
Manteniéndolo simple, verifique que un accesorio anidado tenga longitud antes de realizar una acción.
El problema es que, especialmente al pasar props, en cualquier nodo dado, podrías terminar con undefined .
¿Hay alguna manera de evitar verificar que cada nodo exista de esta manera:
if( !!Grandparent && !!Grandparent.Parent && !!Grandparent.Parent.child && !!Grandparent.Parent.child.prop3.length){ // do something } Algo más como esto: (lo cual sé que no es correcto ya que cualquier nodo que no esté undefined controla el proceso).
if(!!Grandparent.Parent.child.prop3.length) { // do something } // OR if(typeof Grandparent.Parent.child.prop3.length !== "undefined"){ // do something }EX:
Grandparent: { Parent: { child: { prop1: 'alpha', prop2: 'beta', prop3: [ item: { name: 'first', type: 'string' }, item: { name: 'second', type: 'number' } ] } } }Como han indicado los comentaristas, el JavaScript moderno proporciona el operador de encadenamiento opcional ( ?. ) , que puede usar así (siempre que no esté tratando de admitir IE):
const grandparent = getObject(), itemsCount = grandparent?.parent?.child?.prop3?.length, oops = grandparent?.parent?.child?.length; console.log(itemsCount ?? "No such property"); console.log(oops ?? "No such property"); function getObject(){ return { parent: { child: { prop1: 'alpha', prop2: 'beta', prop3: [ { item: { name: 'first', type: 'string' }}, { item: { name: 'second', type: 'number' }} ] } } }; }