如何通过字符串路径动态调用JavaScript对象与函数

在JavaScript开发过程中，经常会遇到需要根据字符串形式的路径来访问对象属性或者调用函数的需求，比如从配置文件读取动态逻辑、实现插件化的功能加载等场景。这种需求的核心是将字符串形式的路径转换为实际的对象引用或者可执行的函数，同时要保证操作的安全性，避免出现未定义错误或者安全漏洞。

基础实现方案：逐层解析路径

最常见的实现思路是将字符串路径按照分隔符拆分，然后逐层访问对象的属性。假设路径分隔符是点号，我们可以按照下面的方式实现基础的对象属性访问：

// 基础的对象路径解析函数
function getObjectByPath(obj, path) {
  // 拆分路径为数组
  const keys = path.split('.');
  let current = obj;
  // 逐层访问属性
  for (let key of keys) {
    // 如果当前层不存在，返回undefined
    if (current == null) {
      return undefined;
    }
    current = current[key];
  }
  return current;
}

// 测试示例
const testObj = {
  user: {
    name: '张三',
    getInfo: function() {
      return '用户姓名：' + this.name;
    }
  }
};

// 获取对象属性
const name = getObjectByPath(testObj, 'user.name');
console.log(name); // 输出 张三

// 获取函数引用
const getInfoFunc = getObjectByPath(testObj, 'user.getInfo');
console.log(typeof getInfoFunc); // 输出 function

动态调用函数的实现

获取到函数引用之后，需要注意函数执行时的this指向问题。如果是对象上的方法，直接调用会导致this丢失，需要手动绑定上下文。下面是完整的动态调用函数的实现：

// 动态调用路径对应的函数
function callFunctionByPath(obj, path, ...args) {
  const func = getObjectByPath(obj, path);
  // 判断是否为可执行函数
  if (typeof func !== 'function') {
    throw new Error('路径对应的不是可执行函数');
  }
  // 获取函数的所属对象，用于绑定this
  const pathArr = path.split('.');
  pathArr.pop(); // 去掉最后的函数名，得到函数所属对象的路径
  const context = pathArr.length > 0 ? getObjectByPath(obj, pathArr.join('.')) : obj;
  // 绑定this并执行函数
  return func.apply(context, args);
}

// 测试调用
try {
  const result = callFunctionByPath(testObj, 'user.getInfo');
  console.log(result); // 输出 用户姓名：张三
} catch (e) {
  console.error(e.message);
}

处理特殊路径场景

支持数组索引的路径

实际场景中路径可能包含数组索引，比如list[0].name这种形式，我们需要扩展解析逻辑，支持这种混合路径：

function getObjectByPathWithArray(obj, path) {
  // 用正则匹配路径中的普通属性和数组索引
  const reg = /([^.[]]+)|([d+])/g;
  const keys = [];
  let match;
  while ((match = reg.exec(path)) !== null) {
    const key = match[0];
    // 如果是数组索引，去掉方括号转成数字
    if (key.startsWith('[')) {
      keys.push(Number(key.slice(1, -1)));
    } else {
      keys.push(key);
    }
  }
  let current = obj;
  for (let key of keys) {
    if (current == null) {
      return undefined;
    }
    current = current[key];
  }
  return current;
}

// 测试数组路径
const arrObj = {
  list: [
    { name: '第一个元素' },
    { name: '第二个元素' }
  ]
};
const firstItemName = getObjectByPathWithArray(arrObj, 'list[0].name');
console.log(firstItemName); // 输出 第一个元素

避免安全风险

不要使用eval或者new Function来实现路径解析，这两种方式会执行任意字符串代码，存在严重的安全漏洞。如果路径来自用户输入，还需要增加白名单校验，只允许访问预定义的合法路径：

// 白名单校验示例
const allowedPaths = ['user.name', 'user.getInfo', 'list[0].name'];

function safeGetObjectByPath(obj, path) {
  // 先校验路径是否在白名单中
  if (!allowedPaths.includes(path)) {
    throw new Error('不允许访问该路径');
  }
  // 调用之前的解析函数
  return getObjectByPathWithArray(obj, path);
}

不同方案对比

下面是几种常见实现方案的对比：

边界情况处理建议

• 路径为空字符串时，直接返回原对象
• 访问过程中遇到null或者undefined时，返回undefined而不是报错
• 如果路径对应的属性是基本类型，调用函数时需要提前判断类型，避免类型错误
• 如果对象是不可扩展的或者属性是只读的，解析过程不会修改对象，不需要额外处理

实际开发中可以根据需求选择合适的实现方案，优先选择安全可控的解析方式，避免引入不必要的安全风险。如果路径格式固定，也可以简化解析逻辑，提升执行效率。

JavaScript动态调用对象路径函数引用字符串解析修改时间：2026-07-11 10:30:25