如何让JavaScript Proxy的set handler捕获嵌套属性完整键路径？

问题核心是当前每个嵌套对象的Proxy仅知晓自身当前属性，无法获取上层路径。要实现获取完整嵌套路径，需在创建子Proxy时传递上层路径信息，具体实现如下：

1. 封装handler创建函数，用于接收并存储当前路径前缀
2. 在get方法中创建子Proxy时，拼接当前前缀与属性名，生成新前缀传递给子handler
3. 在set方法中，通过前缀与当前prop拼接出完整路径，再进行逻辑判断

修改后的代码：

let globalVar = [];

// 生成带路径前缀的handler
const createHandler = (prefix = '') => ({
  get(target, name) {
    const v = name in target ? target[name] : (target[name] = {});
    // 拼接新的路径前缀
    const newPrefix = prefix ? `${prefix}.${name}` : name;
    return typeof v === 'object' ? new Proxy(v, createHandler(newPrefix)) : v;
  },
  set(target, prop, val) {
    // 拼接完整属性路径
    const fullPath = prefix ? `${prefix}.${prop}` : prop;
    
    if (fullPath === "a") {
      console.log(`myObject[${fullPath}] setto ${val}`);
    } else if (fullPath === "b") {
      console.log(`myObject[${fullPath}] setto ${val}`);
    } else if (fullPath === "c") {
      console.log(`myObject[${fullPath}] setto ${val}`);
    } else if (fullPath === "a.b") { // 现在可以触发该逻辑
      console.log(`myObject[${fullPath}] setto ${val}`);
    } else if (fullPath === "a.x") {
      console.log(`myObject[${fullPath}] setto ${val}`);
    }
    target[prop] = val;
    return true; // 符合Proxy规范：set需返回布尔值表示设置成功
  }
});

globalVar = new Proxy(globalVar, createHandler());

globalVar.a.x = "55a"; // 输出 myObject[a.x] setto 55a
globalVar.a.b = "55b"; // 输出 myObject[a.b] setto 55b
globalVar.a.c = "et4"; // 输出 myObject[a.c] setto et4

说明：

• 每个子Proxy通过createHandler持有自身的路径前缀，确保嵌套访问时能追踪完整路径
• set方法中通过前缀拼接得到完整路径，可直接匹配"a.b"这类嵌套属性的判断逻辑
• 补充set方法的返回值，避免严格模式下出现报错

内容的提问来源于stack exchange，提问作者dede