I created a function in ReactJs but it's not working

Question

Code:

 import './App.css';

function App() {
  const firstName = 'Toto';
  const lastName = 'Wolff';
  const age = 35;
  const job = 'Principal';

  const getFullName = (firstName,
    lastName) => '${firstName} ${lastName}'

  return (
    <div className="App">
      <h3>Full Name: {getFullName(firstName,
        lastName)} </h3>
      <p>Age : {age}</p>
      <p>Job : {job}</p>
    </div>
  );
}

export default App;

Output:

Full Name: ${firstName} ${lastName}
Age : 35
Job : Principal

Answer 1

You are mixing syntax. Template strings require backticks.

`${firstName} ${lastName}`

If you want to use single quotes

firstName + ' ' + lastName

Answer 2

Your code is fine its just you used single quotes '' instead of backquotes `` here

 const getFullName = (firstName,
    lastName) => `${firstName} ${lastName}`

full code

import './App.css'

function App() {
  const firstName = 'Toto';
  const lastName = 'Wolff';
  const age = 35;
  const job = 'Principal';

  const getFullName = (firstName,
    lastName) => `${firstName} ${lastName}`

  return (
    <div className="App">
      <h3>Full Name: {getFullName(firstName,
        lastName)} </h3>
      <p>Age : {age}</p>
      <p>Job : {job}</p>
    </div>
  );
}
export default App;

see: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

Answer 3

You are using single quotes use backticks(Template literals) instead

const getFullName = (firstName,lastName) => `${firstName} ${lastName}`

Learn about template literals here

Answer 4

I would simply do it this way:

const getFullName = (firstName,lastName) => firstName + ' ' + lastName