链式结构方式:
1.最简单方式通过返回this:
class Text {
constructor() {
}
init() {
console.log('init');
return this;
}
init1() {
console.log('init1');
return this;
}
}
var text = new Text();
text.init().init1();
缺点:主要是对DOM元素的操作,只需要改变DOM元素的表现或者不需要返回值,所以适合链式操作。
优点:编程的流程更加清晰,不会像回调函数一样相互耦合,难以分辨函数的执行顺序且维护困难
为兼容需要返回值的时候则修改为:
class Text {
constructor() {
this.name = ''
}
init() {
console.log('init');
return this;
}
init1() {
this.name='init1';
return this;
}
result(res) {
return this[res]
}
}
var text = new Text();
console.log(text.init1().result('name'));
通过添加一个result函数实现兼容需返回值操作,但这个会多加一个函数,通过result传参来调用所需要的返回值;
但这样如果返回值为多个情况反而无法满足
最终完善版:
class Text {
constructor() {
this.name = '';
this.age= 18;
}
init1() {
this.name='init1';
return this;
}
result(res) {
if(Object.prototype.toString.call(res)==="[object Array]") {
let obj = {};
for ( let i of res) {
obj[i] = this[i];
}
return obj;
} else {
return '传入参数类型错误';
}
}
}
var text = new Text();
console.log(text.init1().result(['name', 'age']));