¿Cómo llamo a un método con nombre dinámico en Javascript?

Estoy trabajando en la creación dinámica de JavaScript que se insertará en una página web a medida que se construye.

El JavaScript se utilizará para rellenar un listboxbasado en la selección de otro listbox. Cuando listboxse cambia la selección de uno , llamará a un nombre de método basado en el valor seleccionado de listbox.

Por ejemplo:

Listbox1 contiene:

• Colours
• Shapes

Si Coloursestá seleccionado, llamará a un populate_Coloursmétodo que rellene otro listbox.

Para aclarar mi pregunta: ¿Cómo hago esa populate_Coloursllamada en JavaScript?

Suponiendo que el populate_Coloursmétodo está en el espacio de nombres global, puede usar el siguiente código, que explota tanto que se puede acceder a todas las propiedades del objeto como si el objeto fuera una matriz asociativa, y que todos los objetos globales son en realidad propiedades del windowobjeto anfitrión.

var method_name = "Colours";
var method_prefix = "populate_";

// Call function:
window[method_prefix + method_name](arg1, arg2);

Como señala Triptych, puede llamar a cualquier función de alcance global encontrándola en el contenido del objeto host.

Un método más limpio, que contamina mucho menos el espacio de nombres global, es poner explícitamente las funciones en una matriz directamente así:

var dyn_functions = [];
dyn_functions['populate_Colours'] = function (arg1, arg2) { 
                // function body
           };
dyn_functions['populate_Shapes'] = function (arg1, arg2) { 
                // function body
           };
// calling one of the functions
var result = dyn_functions['populate_Shapes'](1, 2);
// this works as well due to the similarity between arrays and objects
var result2 = dyn_functions.populate_Shapes(1, 2);

Esta matriz también podría ser una propiedad de algún objeto que no sea el objeto de host global, lo que significa que puede crear efectivamente su propio espacio de nombres como lo hacen muchas bibliotecas JS como jQuery. Esto es útil para reducir conflictos si / cuando incluye varias bibliotecas de utilidades separadas en la misma página, y (si otras partes de su diseño lo permiten) puede facilitar la reutilización del código en otras páginas.

También puede usar un objeto como este, que puede encontrar más limpio:

var dyn_functions = {};
dyn_functions.populate_Colours = function (arg1, arg2) { 
                // function body
           };
dyn_functions['populate_Shapes'] = function (arg1, arg2) { 
                // function body
           };
// calling one of the functions
var result = dyn_functions.populate_Shapes(1, 2);
// this works as well due to the similarity between arrays and objects
var result2 = dyn_functions['populate_Shapes'](1, 2);

Tenga en cuenta que con una matriz o un objeto, puede utilizar cualquier método de configuración o acceso a las funciones y, por supuesto, también puede almacenar otros objetos allí. Puede reducir aún más la sintaxis de cualquiera de los métodos para el contenido que no es tan dinámico mediante el uso de la notación literal JS así:

var dyn_functions = {
           populate_Colours:function (arg1, arg2) { 
                // function body
           };
         , populate_Shapes:function (arg1, arg2) { 
                // function body
           };
};

Editar: por supuesto, para bloques de funcionalidad más grandes, puede expandir lo anterior al "patrón de módulo" muy común, que es una forma popular de encapsular características de código de manera organizada.

Recomendaría NO usar global/ window/ evalpara este propósito.
En su lugar, hazlo de esta manera:

define todos los métodos como propiedades de Handler:

var Handler={};

Handler.application_run = function (name) {
console.log(name)
}

Ahora llámalo así

var somefunc = "application_run";
Handler[somefunc]('jerry');

Salida: jerry

puedes hacerlo así:

function MyClass() {
    this.abc = function() {
        alert("abc");
    }
}

var myObject = new MyClass();
myObject["abc"]();

Dentro de ServiceWorkero Worker, reemplace windowcon self:

self[method_prefix + method_name](arg1, arg2);

Los trabajadores no tienen acceso al DOM, por windowlo tanto, es una referencia inválida. El identificador de alcance global equivalente para este propósito es self.

No recomendaría usar la ventana como sugieren algunas de las otras respuestas. Utilice thisy alcance en consecuencia.

this['yourDynamicFcnName'](arguments);

Otro buen truco es llamar dentro de diferentes ámbitos y usarlo como herencia. Digamos que ha anidado la función y desea acceder al objeto de ventana global. Podrías hacer esto:

this['yourDynamicFcnName'].call(window, arguments);

Hola prueba esto

 var callback_function = new Function(functionName);
 callback_function();

manejará los parámetros por sí mismo.

Aquí hay una solución funcional y simple para verificar la existencia de una función y clasificar esa función dinámicamente por otra función;

Función de disparo

function runDynmicFunction(functionname){ 

    if (typeof window[functionname] == "function"  ) { //check availability

        window[functionname]("this is from the function it "); //run function and pass a parameter to it
    }
}

y ahora puede generar la función dinámicamente, tal vez usando php como este

function runThis_func(my_Parameter){

    alert(my_Parameter +" triggerd");
}

ahora puede llamar a la función usando un evento generado dinámicamente

<?php

$name_frm_somware ="runThis_func";

echo "<input type='button' value='Button' onclick='runDynmicFunction(\"".$name_frm_somware."\");'>";

?>

el código HTML exacto que necesita es

<input type="button" value="Button" onclick="runDynmicFunction('runThis_func');">

Prueba con esto:

var fn_name = "Colours",
fn = eval("populate_"+fn_name);
fn(args1,argsN);