JS 实现链式调用

什么是链式调用?

链式调用(Chaining Method Calls)是一种编程技巧,即连续调用一个类中的多个方法,比如

js 复制代码
// 创建一个计算机对象实例
const calc = new Calculator();
// 使用链式调用 add 方法,实现连续累加
const result = calc.add(1).add(2).result;

console.log(result); // 输出:3

技术要点

支持链式调用的对象方法,必须返回对象自身(以便后续继续调用对象方法)

代码实现

js 复制代码
// 声明类 Calculator - 计算器
class Calculator {
  // 创建对象实例时,初始化属性 result 的值为 0
  constructor() {
    this.result = 0;
  }

  // 对象方法-add 求和
  add(num) {
    this.result += num;
    // 返回当前对象,以支持链式调用
    return this;
  }
}
相关推荐
踢球的打工仔9 分钟前
typescript-null和undefined
前端·javascript·typescript
前端小蜗12 分钟前
对不起,我很贱:老板还没催,我自己就统计《GitLab年度代码报告》
前端·javascript·人工智能
康一夏29 分钟前
React面试题,useRef和普通变量的区别
前端·javascript·react.js
冴羽1 小时前
2025 年 HTML 年度调查报告公布!好多不知道!
前端·javascript·html
wszy18091 小时前
rn_for_openharmony_空状态与加载状态:别让用户对着白屏发呆
android·javascript·react native·react.js·harmonyos
程序员Agions1 小时前
别再只会 console.log 了!这 15 个 Console 调试技巧,让你的 Debug 效率翻倍
前端·javascript
我的div丢了肿么办1 小时前
vue使用h函数封装dialog组件,以命令的形式使用dialog组件
前端·javascript·vue.js
UIUV1 小时前
Git 提交规范与全栈AI驱动开发实战:从基础到高级应用
前端·javascript·后端
lili-felicity2 小时前
React Native for Harmony:登录页“记住密码+深色模式适配”完整实现
javascript·react native·react.js
摘星编程2 小时前
Flutter for OpenHarmony 实战:CustomScrollView 自定义滚动视图详解
android·javascript·flutter