¿Cómo puedo evitar los errores ‘no se puede leer la propiedad de undefined’?

Question 1

En mi código, trato con una matriz que tiene algunas entradas con muchos objetos anidados unos dentro de otros, mientras que otros no. Se parece a lo siguiente:

// Where this array is hundreds of entries long, with a mix
// of the two examples given
var test = [{'a':{'b':{'c':"foo"}}}, {'a': "bar"}];

Esto me está dando problemas, porque necesito iterar a través de la matriz a veces, y la inconsistencia me arroja errores como este:

for (i=0; i<test.length; i++) {
    // OK, on i==0, but 'cannot read property of undefined' on i==1
    console.log(a.b.c);
}

Soy consciente de que puedo decir if(a.b){ console.log(a.b.c)}, pero esto es extraordinariamente tedioso en los casos en que hay hasta 5 o 6 objetos anidados unos dentro de otros. ¿Hay alguna otra manera (más fácil) de que pueda tenerlo? solo Hacer el console.log si existe, pero sin tirar un error?

Question 2

Actualizar:

Si usa JavaScript de acuerdo con ECMAScript 2020 o posterior, consulte encadenamiento opcional.
TypeScript ha agregado soporte para encadenamiento opcional en la versión 3.7.

// use it like this
obj?.a?.lot?.of?.properties

Solución para JavaScript anterior a ECMASCript 2020 o TypeScript anterior a la versión 3.7:

Una solución rápida es usar una función auxiliar de prueba/captura con ES6 función de flecha:

function getSafe(fn, defaultVal) {
  try {
    return fn();
  } catch (e) {
    return defaultVal;
  }
}

// use it like this
console.log(getSafe(() => obj.a.lot.of.properties));

// or add an optional default value
console.log(getSafe(() => obj.a.lot.of.properties, 'nothing'));

Question 3

Lo que está haciendo plantea una excepción (y con razón). Siempre puedes hacer:

try{
   window.a.b.c
}catch(e){
   console.log("YO",e)
}

Pero no lo haría, en lugar de eso, piense en su caso de uso.

¿Por qué está accediendo a datos, 6 niveles anidados que no conoce? ¿Qué caso de uso justifica esto?

Por lo general, le gustaría validar con qué tipo de objeto está tratando.

Además, en una nota al margen, no debe usar declaraciones como if(a.b) porque devolverá falso si ab es 0 o incluso si es “0”. En su lugar, compruebe si a.b !== undefined

Question 4

Si entiendo su pregunta correctamente, desea la forma más segura de determinar si un objeto contiene una propiedad.

La forma más fácil es usar el in operador.

window.a = "aString";
//window should have 'a' property
//lets test if it exists
if ("a" in window){
    //true
 }

if ("b" in window){
     //false
 }

Por supuesto, puedes anidar esto tan profundo como quieras.

if ("a" in window.b.c) { }

No estoy seguro si esto ayuda.

Question 5

Prueba esto. Si a.b es undefineddejará el if declaración sin ninguna excepción.

if (a.b && a.b.c) {
  console.log(a.b.c);
}

Question 6

Si estás usando lodashpodrías usar su has función. Es similar al nativo “in”, pero permite caminos.

var testObject = {a: {b: {c: 'walrus'}}};
if(_.has(testObject, 'a.b.c')) {
  //Safely access your walrus here
}

Question 7

Si utiliza Babelya puede usar la sintaxis de encadenamiento opcional con @babel/plugin-proposal-opcional-encadenamiento Complemento de Babel. Esto le permitiría reemplazar esto:

console.log(a && a.b && a.b.c);

con este:

console.log(a?.b?.c);

Question 8

Si usted tiene Lodashpuedes usar su .get método:

_.get(a, 'b.c.d.e')

O darle un valor predeterminado:

_.get(a, 'b.c.d.e', default)

¿Ha sido útil esta solución?