当前位置：Gxlcms > JavaScript > javascript中的链式调用

javascript中的链式调用

时间：2021-07-01 10:21:17 帮助过：3人阅读

jQuery中形如$("#txtName").addClass("err").css("font-size","12px").select().focus();的方式让人不得不为之着迷。其实现机制就是链式调用。链式调用就是调用对象的方法后返回到该对象，严格来讲它并不属于语法，而只是一种语法技巧，js令人着迷的一点就是这里。
没有返回值的方法属于赋值器方法，显然它很容易实现链式调用，前提是正确理解this指针的用法。
代码如下:


function W(){ 
this.name="Wang Hongjian"; 
this.gender="male"; 
} 
W.prototype.sayHi=function(){ 
alert("Hello,everybody\nMy name is " + this.name); 
return this; 
}; 
W.prototype.doSomething=function(){ 
alert("I'm working"); 
return this; 
} 
W.prototype.sayGoodbye=function(){ 
alert("Goodbye,everybody"); 
return this; 
}; 
var w=new W(); 
w.sayHi().doSomething().sayGoodbye(); 
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>javascript链式调用 //www.gxlcms.com/</title> 
<script type="text/javascript"> 
function W(){ 
    this.name="Wang Hongjian"; 
    this.gender="male"; 
} 
W.prototype.sayHi=function(){ 
alert("Hello,everybody\nMy name is " + this.name); 
return this; 
}; 
W.prototype.doSomething=function(){ 
    alert("I'm working"); 
    return this; 
} 
W.prototype.sayGoodbye=function(){ 
alert("Goodbye,everybody"); 
return this; 
}; 
var w=new W(); 
w.sayHi().doSomething().sayGoodbye(); 
</script> 
</head> 
<body> 
</body> 
</html> 

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

javascript中的链式调用

人气教程排行