JS中如何实现Dog类eat方法链式调用floss并自动传参

需求回顾 #

现有Dog类及调用方式：

class Dog{
  eat(dogName){
    // 原有逻辑
  }
}

// 原调用方式
let doggy = new Dog();
doggy.eat('Max');

需要支持链式调用doggy.eat('Max').floss()，且floss无需重复传入狗名，同时保留原调用方式的兼容性。

方案一：实例属性存储参数（简单直观） #

修改Dog类，在eat方法中将狗名存入实例属性，返回实例本身以支持链式调用，同时新增floss方法读取该属性：

class Dog{
  eat(dogName){
    // 执行原有eat逻辑
    console.log(`${dogName} 正在进食`);
    // 把狗名存到实例属性
    this._currentDog = dogName;
    // 返回实例，开启链式调用
    return this;
  }

  floss(){
    // 直接使用实例中存储的狗名
    console.log(`${this._currentDog} 正在清洁牙齿`);
    // 若需继续链式调用其他方法，可继续返回this
    return this;
  }
}

调用验证

• 原调用方式仍有效：

let doggy = new Dog();
doggy.eat('Max'); // 输出：Max 正在进食

• 链式调用正常工作：

doggy.eat('Max').floss(); // 输出：Max 正在进食 → Max 正在清洁牙齿

方案二：闭包捕获参数（避免实例属性污染） #

如果不想在实例上存储临时参数，可以用闭包让floss直接捕获eat传入的狗名：

class Dog{
  eat(dogName){
    // 执行原有eat逻辑
    console.log(`${dogName} 正在进食`);
    // 返回包含floss的对象，闭包保留当前dogName
    return {
      floss: () => {
        console.log(`${dogName} 正在清洁牙齿`);
        // 若需调用Dog实例的其他方法，返回this即可
        return this;
      }
    };
  }

  // 示例其他实例方法
  bark(){
    console.log('汪汪汪！');
    return this;
  }
}

优势说明

这种方式不会修改实例属性，多次调用eat后，每个返回的floss都对应各自的狗名：

let doggy = new Dog();
const maxOps = doggy.eat('Max');
const buddyOps = doggy.eat('Buddy');

maxOps.floss(); // 输出：Max 正在清洁牙齿
buddyOps.floss(); // 输出：Buddy 正在清洁牙齿
// 还能继续链式调用实例方法
maxOps.floss().bark(); // 输出：Max 正在清洁牙齿 → 汪汪汪！

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