¿Cómo llamo a un método dinámicamente nombrado en Javascript?

Question

Estoy trabajando en la creación dinámica de Javascript que se insertará en una página web mientras se está construyendo.

El Javascript se utilizará para rellenar un cuadro de lista en función de la selección en otro cuadro de lista. Cuando se cambia la selección de un listbox llamará un nombre de método basado en el valor seleccionado del listbox.

Por ejemplo:

Listbox1 contiene:

Colores
Formas

Si se selecciona 'Colores' entonces se llamará a un método "populate_Colours" que puebla otro cuadro de lista.
Para aclarar mi pregunta: ¿cómo hago esa llamada "populate_Colours" en Javascript?

Answer 1

Suponiendo que el método 'populate_Colours' está en el espacio de nombres global, puede usar el siguiente código, que explora que se puede acceder a todas las propiedades del objeto como si fuera una matriz asociativa y que todos los objetos globales son en realidad propiedades del objeto host window.

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

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

Answer 2

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

Un método más limpio, lo que contamina el espacio de nombres global mucho menos, es poner de forma explícita 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 un objeto que no sea el mundial objeto host también significa que puede crear efectivamente su propio espacio de nombres como muchas bibliotecas JS como jQuery. Esto es útil para reducir conflictos si/cuando incluye múltiples bibliotecas de utilidades separadas en la misma página, y (otras partes de su permiso de diseño) pueden facilitar la reutilización del código en otras páginas.

También es posible usar un objeto como tal, la que es posible 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, ya sea con una matriz o un objeto, puede utilizar cualquiera de los métodos de establecer o acceder a las funciones, y puede por supuesto, almacenar otros objetos allí también. Puede reducir aún más la sintaxis de cualquiera de los métodos para contanto que no es que Synamic 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 los bloques más grandes de la funcionalidad se puede ampliar lo anterior a la muy comunes "patrón de módulo", que es una forma popular de encapsular las características del código de una manera organizada.

Answer 3

Hola probar esto,

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

que se encargará de la propia parámetros.

Answer 4

puede hacerlo de esta manera:

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

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

Answer 5

por una simple función de JavaScript, podemos usar-

var function_name='additionFunction'; 
var argMap={"name":"yogesh"}; 
var argArray=[{"name":"yogesh"}]; 

window[function_name](argMap); 

o

window[function_name](argArray); 

o

window[function_name](argMap,argArray); 

proporciona la llamada función y tiene tales parámetros en la implementación real.

Answer 6

Pruebe con esto:

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

Answer 7

recomendaría NO de usar global/window/eval para este propósito.
En cambio, hacerlo de esta manera:

definir todos los métodos como las propiedades de Handler:

var Handler={}; 

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

Ahora llamarlo como esto

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

Salida: Jerry