JavaScript类中如何通过组合实现方法调用的穿透？

针对需求，我们可以通过Proxy对象包装结合实例间的双向引用来实现，无需继承或super()：

完整代码实现 #

class A {
    constructor(a, outer) {
        this.a = a;
        // 保存外部B实例的引用
        this.outer = outer;
    }

    showInfo() {
        console.log(this.a);
    }
}

class B {
    constructor(b) {
        // 创建A实例并传入自身引用，同时用Proxy包装A，实现方法穿透到B
        this.innerA = new Proxy(new A(b, this), {
            get(target, prop) {
                // 优先访问A自身的属性/方法
                if (prop in target) {
                    return typeof target[prop] === 'function' 
                        ? target[prop].bind(target) 
                        : target[prop];
                }
                // A没有时，转向外部B实例
                return target.outer[prop];
            }
        });

        // 用Proxy包装B实例，实现方法穿透到内部A
        return new Proxy(this, {
            get(target, prop) {
                // 优先访问B自身的属性/方法
                if (prop in target) {
                    return typeof target[prop] === 'function' 
                        ? target[prop].bind(target) 
                        : target[prop];
                }
                // B没有时，转向内部A实例
                return target.innerA[prop];
            }
        });
    }

    printText() {
        console.log('its B!');
    }
}

测试验证 #

执行以下代码验证效果：

const objB = new B(3);

// 需求1：调用objB不存在的showInfo，穿透到A执行
objB.showInfo(); // 输出：3

// 需求2：调用A实例不存在的printText，穿透到B执行
objB.innerA.printText(); // 输出：its B!

核心逻辑说明 #

1. 双向引用：在创建A实例时，将B自身作为参数传入，让A持有B的引用，反之B也持有A的引用。
2. Proxy拦截：
   • 包装B实例：当访问B不存在的属性/方法时，自动转向内部A实例查找。
   • 包装A实例：当访问A不存在的属性/方法时，自动转向外部B实例查找。
3. bind绑定上下文：确保方法执行时this指向正确的实例，避免上下文丢失。

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