Как вызвать динамически называемый метод в Javascript?
Я работаю над динамическим созданием Javascript, который будет вставлен на веб-страницу по мере ее создания.
Javascript будет использоваться для заполнения списка на основе выбора в другом списке. Когда выбор одного списка изменяется, он вызывается именем метода на основе выбранного значения списка.
Например:
Listbox1 содержит:
Цвета изображения
Формы
Если выбрано "Цвета", оно вызовет метод "populate_Colours", который заполняет другой список.
Чтобы прояснить мой вопрос: как мне сделать этот вызов "populate_Colours" в Javascript?
Ответы
Ответ 1
Предполагая, что метод populate_Colours находится в глобальном пространстве имен, вы можете использовать следующий код, который использует оба свойства объекта, к которым можно получить доступ, как если бы объект был ассоциативным массивом и что все глобальные объекты на самом деле являются свойствами хост-объект window
.
var method_name = "Colours";
var method_prefix = "populate_";
// Call function:
window[method_prefix + method_name](arg1, arg2);
Ответ 2
Как указывает Триптих, вы можете вызвать любую глобальную функцию области видимости, найдя ее в содержимом объекта хоста.
Более чистый метод, который значительно загрязняет глобальное пространство имен, заключается в том, чтобы явно помещать функции в массив непосредственно так:
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);
Этот массив также может быть свойством какого-либо объекта, отличного от глобального объекта хоста, что также означает, что вы можете эффективно создать собственное пространство имен так, как многие JS-библиотеки, такие как jQuery. Это полезно для уменьшения конфликтов, если при включении нескольких отдельных библиотек утилиты на одной странице и (в других частях вашего разрешения) можно упростить повторное использование кода на других страницах.
Вы также можете использовать такой объект, который вы можете найти более чистым:
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);
Обратите внимание, что с помощью массива или объекта вы можете использовать любой способ установки или доступа к функциям и, конечно же, хранить там и другие объекты. Вы также можете уменьшить синтаксис любого из методов для contant, который не является синтаксическим с использованием буквенной нотации JS следующим образом:
var dyn_functions = {
populate_Colours:function (arg1, arg2) {
// function body
};
, populate_Shapes:function (arg1, arg2) {
// function body
};
};
Редактирование: конечно, для более крупных блоков функциональности вы можете развернуть это выше до очень распространенного "шаблона модуля", который является популярным способом инкапсуляции функций кода организованным образом.
Ответ 3
Я бы порекомендовал НЕ использовать global
/window
/eval
для этой цели.
Вместо этого сделайте это так:
определим все методы как свойства Handler:
var Handler={};
Handler.application_run = function (name) {
console.log(name)
}
Теперь назовите это так
var somefunc = "application_run";
Handler[somefunc]('jerry');
Выход: Джерри
Ответ 4
вы можете сделать это следующим образом:
function MyClass() {
this.abc = function() {
alert("abc");
}
}
var myObject = new MyClass();
myObject["abc"]();
Ответ 5
Привет, попробуйте это,
var callback_function = new Function(functionName);
callback_function();
он будет обрабатывать сами параметры.
Ответ 6
для простой функции javascript, мы можем использовать -
var function_name='additionFunction';
var argMap={"name":"yogesh"};
var argArray=[{"name":"yogesh"}];
window[function_name](argMap);
или
window[function_name](argArray);
или
window[function_name](argMap,argArray);
при условии, что так называемая функция существует и имеет такие параметры в реальной реализации.
Ответ 7
В ServiceWorker
или Worker
замените window
на self
:
self[method_prefix + method_name](arg1, arg2);
Рабочие не имеют доступа к DOM, поэтому window
является недействительной ссылкой. Эквивалентный идентификатор глобальной области видимости для этой цели - self
.
Ответ 8
Вот рабочее и простое решение для проверки существования функции и сортировки, которая динамически функционирует с помощью другой функции;
Функция запуска
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
}
}
и теперь вы можете генерировать функцию динамически, возможно, с помощью PHP, как это
function runThis_func(my_Parameter){
alert(my_Parameter +" triggerd");
}
теперь вы можете вызывать функцию, используя динамически генерируемое событие
<?php
$name_frm_somware ="runThis_func";
echo "<input type='button' value='Button' onclick='runDynmicFunction(\"".$name_frm_somware."\");'>";
?>
Точный HTML-код вам нужен
<input type="button" value="Button" onclick="runDynmicFunction('runThis_func');">
Ответ 9
Попробуйте следующее:
var fn_name = "Colours",
fn = eval("populate_"+fn_name);
fn(args1,argsN);