JavaScript 实现通过字符串调用函数、方法

coder__c

已于 2023-04-26 09:16:27 修改

阅读量1.9k

点赞数

分类专栏： web前端文章标签： javascript 前端

于 2023-04-25 23:43:28 首次发布

本文链接：https://blog.youkuaiyun.com/qq_42026600/article/details/130376523

版权

web前端专栏收录该内容

14 篇文章

订阅专栏

文章介绍了JavaScript中三种动态调用函数和方法的方式：1)通过eval函数直接调用简单函数；2)使用构造函数和对象方法调用；3)对象字面量形式的方法调用。核心是eval函数的应用，它能将字符串转化为JS表达式执行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 简单函数形式

 function fun() {
     console.log("函数 fun 被调用");
 }

 /**
  * 简单函数形式，该方法传入函数名即可
  */
 function callModelFun(functionName) {
     //根据函数名得到函数类型
     let func = eval(functionName);
     //创建函数对象，并调用
     new func();
 }
 callModelFun("fun");

2. 构造函数形式

function User () {
    this.sayHello = function () {
        console.log("User 对象的 sayHello 方法被调用");
    }
}

/**
 * 构造函数的形式 通过构造函数名和方法名实现方法调用
 * @param objName
 * @param methodName
 */
function callObjectMethod(objName, methodName) {
    const func = eval(objName);
    const f = new func();
    f[methodName]();
}

callObjectMethod("User", "sayHello");

3. 对象字面量的形式

let Person = {
    speak: function () {
        console.log("speak方法调用");
        // return "hello hello";
    }
}

// callObjectMethod("Person", "speak"); // 不可行

/**
 * 对象字面量的形式 通过对象名和方法名实现方法调用
 * @param objName
 * @param methodName
 */
function callObjectMethod2(objName, methodName) {
    // 实现动态调用objName 对象的 methodName 方法
    const func = eval(objName);
    func[methodName]();
}

callObjectMethod2("Person", "speak");

以上是三种情况的处理方式。核心用到了 js 的eval 函数。

eval()函数是一种接受字符串作为参数，并且可以将接受的字符串转换成js表达式并且立即执行该表达式。将字符串转成js指令执行。