How to bind an object to a function in JavaScript?

Question

I have the next task:

const person = {name: 'Arnold'};

function fn(salut, lastName) {
    console.log(salut, this.name, lastName);
}

const bindName = bind(fn, person, 'Mr');

bindName('Helgov');

I have to write a function that prints: "Mr Arnold Helgov"

My realization of this task is the next function:

function bind(fn, person, salute) {
    return (lastname) => {
        return fn(salute, lastname);
    }
}

But I have a problem here. My function prints only "Mr Helgov" and the name 'Arnold' is lost. How to solve this problem (maybe by using bind or apply or call )?

Answer 1

How to solve this problem (maybe by using bind or apply or call )?

Yes, you can use call or bind to make sure this gets to be equal to person during the call of fn .

With call :

 const person = {name: 'Arnold'}; function fn(salut, lastName) { console.log(salut, this.name, lastName); } const bindName = bind(fn, person, 'Mr'); bindName('Helgov'); function bind(fn, person, salute) { return (lastname) => { return fn.call(person, salute, lastname); } }

Or, bind :

 const person = {name: 'Arnold'}; function fn(salut, lastName) { console.log(salut, this.name, lastName); } const bindName = bind(fn, person, 'Mr'); bindName('Helgov'); function bind(fn, person, salute) { return fn.bind(person, salute); }