Как вызвать функцию по имени или вызов функции используя объект window

Многие новички задаются вопросом типа:

• "Как вызвать функцию по ее имени"
• "Как вызвать функцию если ее имя хранится в переменной"
• Ну, и тому подобные вопросы :)

Возьмем пример задачи:

var name = 'myFunc';

function myFunc(text) {
    alert(text);
}

И так, у нас есть функция под именем myFunc и переменная name которая содержит в себе имя функции.


Как можно вызвать функцию, используя переменную ?
Есть 3 варианта решения этой задачи:

• Использовать объект window
• Использовать функцию eval()
• Создать свой объект, в котором описать функцию.

1) Использовать объект window

На мой взгляд самый подходящий вариант.

Делается следующим образом:

window[funcName](params);

funcName - имя вызываемой функции
params - параметры передаваемые функции.

Нашу задачу можно решить следующим образом:

var name = 'myFunc';

function myFunc(text) {
    alert(text);
}

window[name]('bla bla bla'); //Вызываем функцию myFunc и передаем в качестве параметра текст "bla bla bla"

Вот еще примеры:

window['alert']('bla bla bla'); // Выведется Alert с текстом "bla bla bla" 

var myFunc = 'myAlert';
function myAlert(text) {
   alert(text);
}
window[myFunc]('bla bla bla'); // Выведется Alert с текстом "bla bla bla" 

2) Использовать функцию eval()


С помощью функции eval() можно выполнить какую ту часть кода, в том числе и вызвать функцию.
Пример:

function myAlert(text) {
   alert(text);
}

eval('myAlert("bla bla bla");');

Нашу задачу можно решить так:

var name = 'myFunc';

function myFunc(text) {
    alert(text);
}

eval(name+'("bla bla bla");'); //Вызываем функцию myFunc и передаем в качестве параметра текст "bla bla bla"

Но не злоупотребляйте данной функции так как неправильное использование eval():

• Открывает ваш код для Инъекций
• Отладка может быть более сложная (без номера строк)
• Код выполняется медленее

3) Создать свой объект, в котором описать функцию

И так, как вариант мы можем создать свой объект и из него вызвать функцию, по сути получится тоже самое как и использование объекта window.

Пример:

var obj = {
   firstFunc: function(text) {
      alert('first func:  '+text);
   },
   secondFunc: function(text) {
      alert('second func:  '+text);
   }
}

obj['firstFunc']("bla bla bla"); //Вызываем функцию firstFunc
obj['secondFunc']("bla bla bla"); //Вызываем функцию secondFunc

var name = 'first';
obj[name+'Func']("bla bla bla"); //Вызываем функцию firstFunc

Нашу задачу можно решить следующим образом:

var name = 'myFunc';

obj = { // Описываем наш объект
   myFunc: function(text) { //Описываем нашу функцию в объекте
      alert(text);
   }
}

obj[name]("bla bla bla"); //Вызываем функцию myFunc из объекта obj и передаем в качестве параметра текст "bla bla bla"

Заключение
Ну вот примерно и все :)
По моему мнению самый оптимальный вариант это использовать объект window хотя редко бывают ситуации когда имя функции берется из переменной, по сути вам даже стоит избегать таких ситуации и искать другие решения.