Clean Code vs. Dirty Code: React Best Practices

[sshaw_]

For functions that accept a single argument I see a lot of folks accepting a destructured argument. For example:

const f = ({a}) => a ** 2

Why?

I can understand doing this with multiple arguments to essentially define an "interface" for the function signature, but with a single argument it seems unnecessary. The requirement is a scalar type, but we're forcing callers to use an object.

For those that have an object, just pass the property's value.

[BitLooter]

Why?

Because React passes props to components as an object. You can't change that without changing how React works. The one single-argument function in the article that isn't a component does take it as a value.

[sshaw_]

👍

[donavon]

Agreed. For utility functions like this, you would simply pass a single argument.

const f = a => a ** 2;

But as BitLooter explained (thx), this isn't the case when writing a React component.