Pass method as parameter and use that method on an object (Javascript)

Question

I need a javascript function that receives a method, and calls that method on an object created inside the function.

const callMethod = myMethod => {
    someObject.myMethod();
}

I need this because I want to make a function that makes an HTTP request via fetch, and specify which method to call after getting the response from the fetch, where the options are: .json(), .text(), .blob(), .formData() or .arrayBuffer()

This is my code:

const sendPost = (url, bodyObj) => {
    return new Promise(async (resolve, reject) => {
        try {
            const settings = {
                method: "POST",
                headers: {"Content-Type":"application/json"},
                body: JSON.stringify(bodyObj)
            }
            let req = await fetch(url, settings);
            
            // Here I'm forcing the .json() method, I want it to be able to choose between .json(), .text(), etc. when calling this function:
            let res = await req.json();
            
            return resolve(res);
        } catch (e) {
            return reject(e);
        }
    });
}

I have tried this, but it didn't work:

const sendPost = (url, bodyObj, func) => {
    // ...
    let req = await fetch(url, settings);
    let res = await req.func();
    // ...
}

sendPost("some url", {some object}, Response.json); // TypeError: req.func is not a function

I think the easiest way to do this is to pass a string with the name of the method I want to use, and then decide which method I want to call using conditionals. But I would like something more robust, which allows passing the pointer to an actual method, since the content of a string can be misspelled.

Consider passing a callback instead. someObject, response => response.json()); TypeScript (or, to a lesser extent, JSDoc) helps avoid misspelling typos too. — CertainPerformance
– CertainPerformance, Commented Jun 8, 2022 at 22:06
It depends on how the OP passes the information about the to be called/invoked method as parameter to the function. In case parameter func carries a string value like 'json' or 'text' then result will be processed like ... let res = await req[func](); ...but in case the OP passes real method references then a function's call method is the to be chosen tool ... let res = await func.call(req); ...And in case one is not sure about req then ...await req?.[func]?.() for the former case. — Peter Seliger
– Peter Seliger, Commented Jun 8, 2022 at 22:45

StriplingWarrior · Accepted Answer · 2022-06-09 18:45:03Z

1

There are a few ways you could do this.

The way you've written it, if you were to pass in a string ("json"), then you could do this:

let response = await sendPost(..., "json");

    let res = await req[func]();

That finds the member with the name matching the string found in func.

You could also use a callback:

let json = await sendPost(..., response => response.json());

    let res = await func(req);

But the only thing you're doing after that point in your helper function is resolving errors and returning the result. It might make more sense to have your helper function return a Promise with the response in it.

let response = await sendPost(...);
let json = response.json();

    let res = await fetch(url, settings);
    return res;

edited Jun 9, 2022 at 18:45

answered Jun 8, 2022 at 22:31

StriplingWarrior

158k29 gold badges261 silver badges326 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

HopFr0g Over a year ago

It works well! But I got an error using req.[func](). Considering Peter's comment, it's req[func]() (without the dot)

StriplingWarrior Over a year ago

Yep, of course. Just a typo on my part. I fixed it.

Collectives™ on Stack Overflow

Pass method as parameter and use that method on an object (Javascript)

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related