如何使用 JavaScript 从存储在字符串中的函数名称调用函数?

介绍

在 JavaScript 中,函数被视为第一类对象,因此在应用程序中,我们可以将函数存储在变量中,使用它们作为函数参数,并从函数中返回函数。在 JavaScript 中,函数名称只是指向函数的一个指针,因此您可以将函数存储在字符串中,并使用 eval() 函数调用函数,但是这是不安全和不推荐的做法。

使用eval()函数调用函数

在 JavaScript 中,您可以使用 eval() 函数将字符串中的函数名称解析为实际函数的引用,并调用该函数。

语法

eval(string);

例子

function add(a, b) {

return a + b;

}

var functionName = 'add';

var result = eval(functionName)(2, 3);

console.log(result); // 输出 5

在上面的例子中,我们首先定义了一个函数 add,它返回两个数字的和。然后,我们将函数名称存储在字符串变量 functionName 中,并定义输入值 a 和 b。使用 eval() 函数调用字符串中存储的函数名称,并传递参数 2 和 3。输出 result 为 5,这是由函数 add 的调用返回的结果。

尽管使用 eval() 函数可以解决问题,但不推荐使用它。该函数可以执行任何 JavaScript 代码,这样就可能导致不安全的代码注入攻击。

使用window对象调用函数

JavaScript 中的每个全局对象都是 window 对象的一个属性。可以将函数存储在全局对象中,并使用 window[functionName] 表达式来调用该函数。

例子

function subtract(a, b) {

return a - b;

}

window['subtract'](10, 5); // 输出 5

在此示例中,我们首先定义了函数 subtract,它返回输入值 a 和 b 的差。然后,我们使用窗口对象调用函数,只需将函数名称作为字符串传递给 window[] 并传递输入值 10 和 5。

使用对象调用函数

您可以将函数存储在 JavaScript 对象中,并使用点符号调用该函数。

例子

var myObj = {

multiply: function(a, b) {

return a * b;

}

};

myObj.multiply(2, 3); // 输出 6

在此示例中,我们创建了一个名为 myObj 的 JavaScript 对象,并使用它存储一个名为 multiply 的函数。我们使用点符号调用该函数,并传递输入值 2 和 3。输出值为 6,这是函数的调用结果。

使用解构赋值调用函数

ES6 中引入了解构赋值语法,可以轻松访问已存储在对象中的函数并直接调用它。

例子

var myObj = {

divide: function(a, b) {

return a / b;

}

};

const { divide } = myObj;

divide(10, 2); // 输出 5

在示例中,我们定义 myObj 对象,并使用它存储一个名为 divide 的函数。然后,使用解构赋值语法访问该函数。在变量 divide 中存放函数。最后,可以直接调用新的变量名 divide,并提供输入值 10 和 2。输出结果为 5。

结论

在 JavaScript 中,您可以将函数存储在各种数据类型中,并使用不同的方法访问这些函数。使用 eval() 函数虽然可以实现调用字符串中存储的函数名称,但是它有安全隐患,并且不推荐使用。其他访问函数的方法包括使用全局 window 对象、JavaScript 对象以及解构赋值语法。在实际应用程序中,应根据代码需求和安全性决定使用哪种方法。

免责声明:本文来自互联网,本站所有信息(包括但不限于文字、视频、音频、数据及图表),不保证该信息的准确性、真实性、完整性、有效性、及时性、原创性等,版权归属于原作者,如无意侵犯媒体或个人知识产权,请来电或致函告之,本站将在第一时间处理。猿码集站发布此文目的在于促进信息交流,此文观点与本站立场无关,不承担任何责任。