Call a JavaScript function name using a string?

前端 未结 10 1057
孤独总比滥情好
孤独总比滥情好 2020-11-30 07:07

How can I hook up an event to a function name I have defined as a string?

I\'m using Prototype.js, although this is not Prototype-speficic.

$(inputId         


        
相关标签:
10条回答
  • 2020-11-30 07:38

    If you need to call a string function with arguments, do this:

    window[stringFunctionName].apply( window, arrayOfArguments )
    

    You can use scope in place of window if preferred

    0 讨论(0)
  • 2020-11-30 07:38

    update:--- use ES6 export and import

    a.js

    const fn = {
      aaa: function() {
        //code
      },
      bbb: function() {
        //code
      },
      //codes ....
      nnn: function() {
        //code
      }
    }
    
    export default fn
    

    b.js

      import someFn from './a'
      //eg
      const str1='aaa'
      const str2 = 'bbb'
    
      someFn[str1]()
    

    • eval('str') (obsolete feature https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features )

    • setTimeout('str') setInterval('str')

    • window['str'] (but...sometimes,global object is not window)

    • new Function('str')

    These methods above always not be recommend by some reasons, but they are really convenient to use. These methods below are safe, but really not conveninet to use.

    • switch...case (or if...else)

      switch(str){
          case 'str1': 
              fn1()
              break
          case 'str2':
              fn2
              //and so on
      }
      
    • put functions in a object

      const fn={
          str1:fn1,
          str2:fn2
          //and so on
      }
      fn[str1] //call function
      
    0 讨论(0)
  • 2020-11-30 07:41

    ... or this[myFuncName];

    0 讨论(0)
  • 2020-11-30 07:42

    I have worked on this problem, as I needed a function like this. Here is my sandbox code, not thoroughly tested, but can be a startpoint for others. Note that there is one eval() in the code as I couldn't figure out how to bypass that step, maybe a javascript quirk and cannot be done in any other way. Let me know if there is a way to get rid of eval() here!

    executeFunctionByName = function(functionName)
    {
        var args = Array.prototype.slice.call(arguments).splice(1);
        //debug
        console.log('args:', args);
    
        var namespaces = functionName.split(".");
        //debug
        console.log('namespaces:', namespaces);
    
        var func = namespaces.pop();
        //debug
        console.log('func:', func);
    
        ns = namespaces.join('.');
        //debug
        console.log('namespace:', ns);
    
        if(ns == '')
        {
            ns = 'window';
        }
    
        ns = eval(ns);
        //debug
        console.log('evaled namespace:', ns);
    
        return ns[func].apply(ns, args);
    }
    
    
    core = {
        paragraph: {
            titlebar: {
                user: "ffffd",
                getUser: function(name)
                {
                    this.user = name;
                    return this.user;
                }
            }
        }
    }
    
    var testf = function()
    {
        alert('dkdkdkd');
    }
    
    var x = executeFunctionByName('core.paragraph.titlebar.getUser', 'Ikon');
    executeFunctionByName('testf');
    
    0 讨论(0)
  • 2020-11-30 07:43

    Property accessors can be used to access any object's properties or functions.

    If the function is in the global scope, you can get it using the window object:

    var myFunc = window[myFuncName];
    

    This also works within the this scope:

    var myFunc = this[myFuncName];
    
    0 讨论(0)
  • 2020-11-30 07:43
    window.myFunction === window["myFunction"]
    
    0 讨论(0)
提交回复
热议问题