javascript - Call React Function not working -

i have code below, want result "hello mr. john doe".

function formatname(name) {     return name.fullname; };  const name = {     firstname: 'john',     lastname: 'doe',     fullname: function() {         return this.firstname + ' ' + this.lastname;     } };  const getname = (     <h1>hello mr. {formatname(name)}</h1> );  reactdom.render(     getname,     document.getelementbyid('root') ); 

but when save return "hello mr. ", wrong in variable fullname.

in code:

const name = {     firstname: 'john',     lastname: 'doe',     fullname: function() {         return this.firstname + ' ' + this.lastname;     } }; 

this not refered variable name anymore. solve, need bind name declared:

formatname(name).bind(name)() 

---

https://developer.mozilla.org/en-us/docs/web/javascript/reference/global_objects/function/bind

the bind() method creates new function that, when called, has keyword set provided value, given sequence of arguments preceding provided when new function called.