Вызов .find () для пустого массива приводит к ошибке

Question

Я работаю над небольшим приложением, и иногда в моем массиве productTypes есть данные, а иногда нет ..

И я заметил, что в моем приложении нет данных об ошибках. Вот мой код:

 renderer: row =>
 row.data.productType && productTypes.find(x => x.key === row.data.productType).value

Как можно избежать проверки этого кода:

&& productTypes.find(x => x.key === row.data.productType).value

, если productTypes является пустым массивом .. потому что очевидно, что это позволит избежать ошибок ..

Спасибо

Answer 1

Возвращается undefined.

productTypes.find(x => x.key === row.data.productType)

Проверьте, отличается ли length от 0

productTypes.length && productTypes.find(x => x.key === row.data.productType).value

Или выполните что-то подобное

row =>{
    const item = productTypes.find(x => x.key === row.data.productType)

     return row.data.productType item && item.value
}

Для пользовательских сообщений вы можете использовать ternary operators

productTypes.length ? productTypes.find(x => x.key === row.data.productType).value : 'Not Available'

Answer 2

Проблема в том, что .find() возвращает undefined, если ничего не найдено. И undefined не имеет свойства .value. Быстрое решение состоит в том, чтобы обеспечить запасной вариант внутри выражения:

 renderer: row =>
 row.data.productType && ( productTypes.find(x => x.key === row.data.productType) || { value: null }).value

Это вернет ноль, если row.data.productType не .find() ed (найдено) внутри productType.

Это также защищает снова productTypes с несколькими элементами, но не с элементом с правильным key, что-то, что просто проверяет длину productTypes, не поможет.