Как отфильтровать пустые объекты в Typescript?

Question

Надеюсь, вы мне поможете.

Я создаю карту с помощью mapbox-gl и отображаю некоторые координаты [lon, lat].

Некоторые значения null хотя, поэтому я пытаюсь отфильтровать их, используя редуктор, но для этих пустых значений я создаю только пустой объект, который не могу удалить, и получаю сообщение об ошибке (FilterPositions.lon -> error: свойство 'lon' не существует для типа '{}')

Как я могу рендерить только те кластеры с ненулевыми значениями? Вот мой код:

    <Cluster ClusterMarkerFactory={clusterMarker} zoomOnClick>
    {systems.map(({ last_position, id }) => {

        const filteredPositions = Object.entries(last_position).reduce((a,[k,v]) => (v == null ? a : {...a, [k]:v}), {})

        return (
          <SystemMarker
            key={id}
            coordinates={[filteredPositions.lon, filteredPositions.lat]}
            heading={0}
            id={id}
            onClick={onSystemSelect}
          />
        )
    })}
    </Cluster>

Answer 1

Редуктор должен выполнять некоторые вычисления для элементов списка и возвращать только один элемент. Типичным вариантом использования является вычисление суммы элементов списка:

let list = [1,2,3,4,5]
let sum = list.reduce((prev, curr) => prev + curr, 0); // 15

Если вы хотите отфильтровать список. существует метод filter . попробуйте использовать это.

const filteredPositions = Object.entries(last_position).filter(([k,v]) => v !== null)