Home > Mobile >  How to call a JavaScript static class method when the class name and method name are strings?
How to call a JavaScript static class method when the class name and method name are strings?

Time:02-28

Suppose I have the following JavaScript class code. (EDIT: the code is running as an ES6 module that is imported using the standard ES6 "import" statement. So the following class is in a standalone file "C.js")

class C {
    static f() {
        console.log("hello world")
    }
}

Now I want to import the module and invoke the method C.f(), but I only have the name of the method as a string. The following works fine:

import "C.js"
var methodName="f"
C[methodName]()

Now suppose that I also have the name of the class as a string as follows:

import "C.js"
var className="C"
var methodName="f"
/* How do I invoke C.f() ? */

Things I've tried:

  • Using window/self/globalThis, which do NOT work:
import "C.js"
var className="C"
var methodName="f"
/* none of the below calls work */
window[className][methodName]()
self[className][methodName]()
globalThis[className][methodName]()

I've tried using the Function() constructor:

import "C.js"
var className="C"
var methodName="f"
/* the following does NOT work: */
var fn = new Function(className "." methodName "()")
fn()

The above code gives an error that "C" is not defined, when the fn() is executed.

I've also tried using "eval()", which would be my last choice anyways since I don't really need to evaluate "arbitrary" code. I just want to execute a static method in a class, whose names are in strings.

import "C.js"
var className="C"
var methodName="f"
var code = className   "."   methodName   "()"
eval(code)

The above does work as a standalone program in Node.JS, but it does NOT work in the Chrome web browser as part of a modern ES6 JavaScript application. The problem in the Chrome web browser is that the global "environment" used within "eval" does NOT see the "C" class definition.

So, what is the best way to implement this very simple call using string values for the class name and method name?

import "C.js"
var className="C"
var methodName="f"
/* now what? */

CodePudding user response:

Since the answer is buried in the comments to the question, I figured I should go ahead and post it here as an actual answer, so future viewers can easily find the answer.

The answer is: In JavaScript, it's not possible to invoke a method in a class that was loaded from an ES6 module, where the name of the class is in a string.

  • Related