深色模式
链式调用
在使用 JQuery 和 Moment , Promise 時常见到链式调用的场景。本文介绍链式调用的技术方案。
常用方案
- 返回
this作用域 - 返回对象本身
- 闭包返回对象
原型对象返回this作用域
函数原型对象中返回对象的 this 作用域
js
function Person() {}
Person.prototype.setName = function (name) {
this.name = name;
// 此时返回 this 作用域
return this;
};
Person.prototype.setAge = function (age) {
this.age = age;
// 此时返回 this 作用域
return this;
};
Person.prototype.getInfo = function () {
return { name: this.name, age: this.age }
};
const person = new Person();
const userInfo = person.setName('得時').setAge(20).getInfo();
console.log({ userInfo });
// { userInfo: { name: '得時', age: 20 } }返回对象本身
js
const person = {
age: undefined,
name: undefined,
setName(name) {
this.name = name;
return this;
},
setAge(age) {
this.age = age;
return this;
},
getInfo() {
return { name: this.name, age: this.age };
},
};
const userInfo = person.setName('得時').setAge(20).getInfo();
console.log({ userInfo });
// { userInfo: 'name: 得時, age: 20' }返回闭包对象
js
function queueChain(target) {
// 此处第一次调用数据处理
const queue = [target];
function queueFn(chainTarget) {
// 链式数据处理
queue.push(chainTarget);
return queueFn;
}
queueFn.get = () => queue;
return queueFn;
}
const queue = queueChain(1)(2)(3).get();
console.log(queue);
// [ 1, 2, 3 ]