首页 > 代码库 > 面向对象的链式调用
面向对象的链式调用
1、 对象的链式调用
function Chain(){
this.n=0;//属性不一定一开始的时候全部都要初始化
this.fn1=function(_obj){//this指向 new Chain()实例化的对象
alert(this.n++);//注意：alert(this.n++)与this.fn1中的this 不一定指向的对象是一样的
return this;
}
this.fn2=function(){//同上
alert(this.n++);//注意：alert(this.n++)与this.fn1中的this 不一定指向的对象是一样的
return this;
}
}
var _chain1 = new Chain();
var _chain2 = new Chain();
_chain1.fn1().fn2();//依次弹出 0 ， 1
_chain2.fn2().fn1();//依次弹出0 ， 1
_chain1.fn1();//弹出 0
_chain2.fn2().fn1().fn2();//依次弹出 2 ， 3 ， 4（注意：由于前面的_chain2.fn2().fn1()）
2、此代码能解决链式调用，但不能解决顺序执行
function Asynchronous(){
var _self=this;
//由于ajax的回调函数（callBack），this的指向指向window对象下，要想this指向new Asychronous()实例化对象，需要用_self=this,指向实例化对象
this.visitJson1=function(){
ajaxRequest("post","json1.json",true,null,function(data){
alert(data);
});
}
this.visitJson2=function(){
ajaxRequest("post","json2.json",true,null,function(data){
alert(data);
});
}
this.visitJson3=function(){
ajaxRequest("post","json3.json",true,null,function(data){
alert(data);
});
}
}
var _async=new Asynchronous();
_async.visitJson1().visitJson2().visitJson3();//弹出的结果也不一定按照json1,json2,json3输出,由于ajax异步,不能同步输出（即顺序输出）
//正确的如下 （封装的ECMAScript 6中的promise函数）
function Asynchronous(fn){
this.list = [fn];//把promise当中所有的then内回调函数添加到数组中;之所以用数组，因为ajax是一个不确定什么时候执行完的机制,是异步的,
//要想要每个函数同步输出（顺序输出）,需要把函数它们放进一个数组里面,依次执行
this.state = 0;//默认为回调函数未完执行成状态
this.n = 0;//作用：标记应该执行第几个回调函数
/**
* then作用：只是把回调函数存到数组当中，然后等待被调用。
*/
this.then = function(fx){
this.list.push(fx);
return this;
}
/**
* 等待被resolve方法按顺序调用，调用后执行数组中的特定的方法
*/
this.exec = function(n){
if(this.state == 1){
this.state == 0;//由于以后有出错 的属性 ，故需要state状态
this.fm = this.list[n];//注意：只将function赋值给this.fm,由于this.list[n]数组也是一个对象，this指向数组的某一项,达不到this指向实例化对象
this.fm();
}
}
/**
* 由回调函数来调用，实例化对象时也自动调用一次;
*/
this.resolve = function(){//表示执行该回调函数执行完成
this.state = 1;
if(this.n < this.list.length){
this.exec(this.n++);
}
}
this.resolve();
}
new Asynchronous(function(){
var _self = this;
ajaxRequest("post","json/json0.json",true,null,function(data){
alert(data);
_self.resolve();//由于这是ajax回调函数里面，this的指向的对象是window下，需要改变this的指向，故用_self
});
}).then(function(){
var _self = this;
ajaxRequest("post","json/json1.json",true,null,function(data){
alert(data);
_self.resolve();//由于这是ajax回调函数里面，this的指向的对象是window下，需要改变this的指向，故用_self
});
}).then(function(){
var _self = this;
ajaxRequest("post","json/json2.json",true,null,function(data){
alert(data);
_self.resolve();//由于这是ajax回调函数里面，this的指向的对象是window下，需要改变this的指向，故用_self
});
}).then(function(){
var _self = this;
ajaxRequest("post","json/json3.json",true,null,function(data){
alert(data);
_self.resolve();//由于这是ajax回调函数里面，this的指向的对象是window下，需要改变this的指向，故用_self
});
});
3、面向对象的继承
function Sign(){
this.account="";
this.password="";
this.sign=function(){
if(this.account=="abcde" && this.password=="123456"){
alert("登录成功");
}else{
alert("登录失败");
}
}
}
function Register(){
this.abc=0;
this.register=function(){
this.account="abcde";
this.password="123456";
}
}
function Exit(){
this.exit=function() {
this.account = null;
this.password = null;
}
}
Register.prototype=new Exit();//Register对象拥有Exit对象的实例属性和方法以及原型属性和方法
Sign.prototype=new Register();//Sign对象拥有Register对象的实例属性和方法以及原型属性和方法
var _user=new Sign();
_user.register();
_user.sign();//输出登录成功
_user.exit();
_user.sign();//输出登录失败
function main(){
alert(_user.hasOwnProperty("abc"));//输出false 对象.hasOwnProperty("属性名"); (boolean属性,检测"abc"是不是_user这个对象的实例属性
alert(Register.prototype.isPrototypeOf(_user));//输出true 对象属性.isPrototypeOf(对象); (boolean属性，检测“Register.prototypeOf”是不是"_user"这个对象的原型属性)
if("abc" in _user){//无论“abc”是_user这个对象的实例属性还是原型属性,都输出 true，除非“abc”既不是实例属性也不是原型属性（boolean值）
if(_user.hasOwnProperty("abc")){
alert("该属性是实例属性");
}else{
alert("该属性是原型属性");
}
}
}
main();
面向对象的链式调用