React question, why use function and not a component though they asked for a component?

JavaScript
1

Continuing the discussion from freeCodeCamp Challenge Guide: Review Using Props with Stateless Functional Components:
how come a function was used and not a component for the Camper part? why did we have to use const Camper though they asked for a component?

2

Hello!

A functional(a.k.a. stateless) component is just a plain javascript function …

or in other words: functional component = JavaScript function

const Camper = props => <p>{props.name}</p>;

is the modern, short form of

const Camper = (props) => {

return  (

<p>{props.name}</p>

)};

a syntax you might be more familiar with in React, maybe you think of a component in this syntax?

3

i see, thank you sm!

4

“component” is just the name used for a function that builds a node in React, normally a bit of HTML (if it’s for a web app). If you’re using the older class syntax, then it’s what gets returned by the render function, if you use a function (of any kind) directly then it’s just what that function returns.

5

The challenge also calls it a component.

If you are asking why we are using a function component it is because the component has no state of its own and is only passed props. So creating a class component isn’t necessary. Not that a class component can’t be stateless, it just makes more sense to use function components for that (there is also the PureComponent for class components).

6

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.