In react you create components.

There are some ways to create component, one of them is functional component (a function that returns a component - so at the very least, return the html tags from your functions).

const solutionA = () => { return <p>A Text</p> }; 

function solutionB() { return <p>B Text</p> }

const solutionC; //later

than in your JSC files you can use components like <solutionA /> or <solutionB />.

As for solutionC it doesn't returns a component, but you can use it inside a component like this:

const solutionC = (<p>C Text</p>);

function solutionD() { return (<div> Hello {solutionC} </div>)

Since solutionC is not a component but a variable holding html tag, you can use JSX syntax ({}) and use it as a variable.

So this solutionD component will result in this HTML:

<div> 
  Hello <p>C Text</p>
</div>

The main difference between function declaration and function expression is that in the first case you can call the function even before you have defined it. On the other hand, since a function expressions is stored in a variable, you cannot call the function if its name has not been defined first. There are many other differences and you can read about them in this MDN article.

Regarding arrow functions I'd say that their only benefit is in making the code shorter, but only in particular cases. Here's an example where it shortens the function from 5 rows to just 1 while making it more readable even:

Before

function (myObject) {
    return givenArray.every( function (cell) {
        return cell === myObject);
    });
};

After

myObject => givenArray.every(cell => cell === myObject);

This function can be read as: "Checks if every element of the givenArray is equal to myObject".

Generally, I'd reduce the benefits of array functions in three cases:

• In functions that only have one return statement; your example can be shortened to: const solutionA = () => <p>A Text</p>
• In functions that consist of only one condition that returns a boolean.
• In functions that are used as input by another function.

You can also read here for more info about arrow function expression.

when you use const before your function, it implies that this function could not change, you can do not use it and so, you can redefine your function or assign a variable to that name somewhere in your code! so it is common to use const before the functions name. About defining the function prefix like function test = ... it is not useful in react anymore. but I totally recommend using const to prevent any possible reusage of that variable name. Also, the arrow function is relatively similar to the conventional function. However, personally prefer to use the arrow function. for more info see this: https://dmitripavlutin.com/differences-between-arrow-and-regular-functions/