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;
  }
}
相关推荐
摘星编程31 分钟前
用React Native开发OpenHarmony应用:NFC读取标签数据
javascript·react native·react.js
AGMTI2 小时前
webSock动态注册消息回调函数功能实现
开发语言·前端·javascript
不吃香菜的猪3 小时前
使用@vue-office/pdf时,pdf展示不全
javascript·vue.js·pdf
wuhen_n3 小时前
TypeScript的对象类型:interface vs type
前端·javascript·typescript
css趣多多3 小时前
props,data函数,computed执行顺序
前端·javascript·vue.js
一个不称职的程序猿3 小时前
构建优雅的 Vue.js 表情包选择器:一个功能丰富且可定制的 Emoji Picker 组件
前端·javascript·vue.js
无风听海3 小时前
AngularJS中$q.when()的用法
javascript·ecmascript·angular.js
Amumu121384 小时前
Vue核心(二)
前端·javascript·vue.js
2501_944424124 小时前
Flutter for OpenHarmony游戏集合App实战之记忆翻牌配对消除
android·java·开发语言·javascript·windows·flutter·游戏
2501_944526425 小时前
Flutter for OpenHarmony 万能游戏库App实战 - 设置功能实现
android·javascript·flutter·游戏·harmonyos