TypeError: #Object is not a function

The issue

When we were building ReactJS app we had to write quite a lot of components. As you know when you are thinking in React, you think of every reusable piece as a component.

In one of the components, we were returning an object. Later we have used that component as a callback of the map method. As soon as we have used the object of a map method we got into the following issue.

TypeError: #Object is not a function

And here the map call:

{items.map(<Card>)}  // Card is the component

Reason of the issue

map expects a function as a callback but in the above case we passed an object as the callback.

The issue

As soon as we have used an arrow function instead of object the error was resolved. Following is the working code:

{items.map((item, i) => <Card key={i} item={item}/>)}