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;
  }
}
相关推荐
半个落月几秒前
面试必问的 JS 原型链,我用 16 个示例给你彻底讲明白
javascript
丷丩17 分钟前
12. 渲染:MapLibre GL JS 集成与多源瓦片联动
javascript·矢量瓦片·maplibre gl js·地图服务器
橘子星31 分钟前
别再懵圈!JS 执行机制的 “千层套路” 全揭秘
前端·javascript
拾年27535 分钟前
__proto__ vs prototype:90% 的人分不清的 JavaScript 核心
前端·javascript·面试
提子拌饭1331 小时前
个人月事记录表应用 - 鸿蒙PC Electron框架完整实现指南
前端·javascript·华为·electron·前端框架·开源·鸿蒙系统
超人气王1 小时前
新手学前端JS浅拷贝和深拷贝:对象复制竟然是个“替身文学”?
javascript·面试
YHL1 小时前
📚 JS执行机制(执行上下文 + 调用栈 + 编译流程)
前端·javascript
不简说1 小时前
这次真香!sv-print 可视化打印设计器更新:插件脚手架、Excel 导出、弹窗 API 三连发
前端·javascript·前端框架
无聊的老谢1 小时前
Web GIS 最佳实践:Vue 集成 Leaflet/OpenLayers 实现基站海量点位渲染
前端·javascript·vue.js
东风破_1 小时前
V8 如何执行你的代码——编译、上下文与调用栈
javascript