如何实现类中非函数形式的result属性以支持方法链式调用？

需求说明 #

需要修改现有Library类，使得执行var x = $.add(3,5).add(5,10).subtract(10).result;时，x直接得到计算结果23（而非函数）；执行var y = $.add(3,5).add(5,10).subtract(10,3,5).result时得到15。原代码中result是函数形式，无法满足该需求。

原代码 #

class Library {
    constructor(a){
        this.total = a;
    }
            
    add(...a){
        for (const arg of a) {
              this.total += arg;
        }
        return this;
    }
    
    subtract(...b){
        for (const args of b) {
          this.total -= b;
        }
        return this;
    }
        
    result() {
        console.log(this.total);
        return this.total
    }
}

$ = new Library(10); // 初始值设为10

// 期望调用方式：
// var x = $.add(3,5).add(5,10).subtract(10).result;    
// x 应为 10+3+5+5+10-10 = 23
// var y = $.add(3,5).add(5,10).subtract(10,3,5).result 应返回15

解决方案 #

通过类的getter访问器属性实现，同时修复subtract方法的逻辑错误：

class Library {
    constructor(a){
        this.total = a;
    }
            
    add(...a){
        for (const arg of a) {
              this.total += arg;
        }
        return this;
    }
    
    subtract(...b){
        // 修复bug：将 this.total -= b 改为 this.total -= args
        for (const args of b) {
          this.total -= args;
        }
        return this;
    }
        
    // 将result定义为getter属性
    get result() {
        console.log(this.total);
        return this.total;
    }
}

$ = new Library(10);

// 测试调用
var x = $.add(3,5).add(5,10).subtract(10).result;    
console.log(x); // 输出23

// 重置实例重新测试y的场景
$ = new Library(10);
var y = $.add(3,5).add(5,10).subtract(10,3,5).result;
console.log(y); // 输出15

关键说明 #

• getter属性的特性：当访问instance.result时，会自动执行get result()中的逻辑并返回值，不需要加括号调用
• 修复subtract方法：原代码中this.total -= b会把整个参数数组b作为数值减去，导致计算错误，改为this.total -= args才是逐个减去传入的参数

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