js函数调用常用方法详解


Posted in Javascript onDecember 03, 2012

来源 javascript语言精粹。这不是书上的源代码。
js的函数调用会免费奉送两个而外的参数就是 this 和 arguments 。arguments是参数组,他并不是一个真实的数组,但是可以使用.length方法获得长度。
书上有说4中调用方式:
方法调用模式
函数调用模式
构造器调用模式
apply调用模式

下面我们来看看一些实例更好理解。
1:方法调用模式
请注意this此时指向myobject。

/*方法调用模式*/ 
var myobject={ 
value:0, 
inc:function(){ 
alert(this.value) 
} 
} 
myobject.inc()

2:函数调用模式
请注意this此时指向window。
/*函数调用模式*/ 
var add=function(a,b){ 
alert(this)//this被绑顶到window 
return a+b; 
} 
var sum=add(3,4); 
alert(sum)

3:构造器调用模式
javascript语言精粹一书建议摒弃这中方式。因为有更好的方式。这里先不介绍。下次发表博文的时候贴出来。
会在这里加一个连接。
/*构造器调用模式 摒弃*/ 
var quo=function(string){ 
this.status=string; 
} 
quo.prototype.get_status=function(){ 
return this.status; 
} 
var qq=new quo("aaa"); 
alert(qq.get_status());

4:apply调用模式
==我们可以来看一个更有用的apply实例。看最下面的代码。
/*apply*/ 
//注意使用了上面的sum函数 
//与myobject 
//这中调用方式的优点在于可以指向this指向的对象。 
//apply的第一个参数就是this指针要指向的对象 
var arr=[10,20]; 
var sum=add.apply(myobject,arr); 
alert(sum);

看这个apply真正应用。bind这是一个绑定时间的函数。
var bind=function(object,type,fn){ 
if(object.attachEvent){//IE浏览器 
object.attachEvent("on"+type,(function(){ 
return function(event){ 
window.event.cancelBubble=true;//停止时间冒泡 
object.attachEvent=[fn.apply(object)];//----这里我要讲的是这里 
//在IE里用attachEvent添加一个时间绑定以后。 
//this的指向不是到object对象本身所以。我们绑定的function里的this.id是无法正常工作的。 
//但是如果我们用fn.apply(object) 
//这里可以看出我们是把apply的第一个对象也就是this的指向变更给了object所以this.id就变成了 
//object.id 可以正常工作了。 
} 
})(object),false); 
}else if(object.addEventListener){//其他浏览器 
object.addEventListener(type,function(event){ 
event.stopPropagation();//停止时间冒泡 
fn.apply(this) 
}); 
} 
} 
bind(document.getElementById("aaa"),"click",function(){alert(this.id)});
Javascript 相关文章推荐
利用JS重写Cognos右键菜单的实现代码
Apr 11 Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 Javascript
JavaScript 基础篇之运算符、语句(二)
Apr 07 Javascript
Extjs3.0 checkboxGroup 动态添加item实现思路
Aug 14 Javascript
Javascript中arguments用法实例分析
Jun 13 Javascript
Bootstrap中的fileinput 多图片上传及编辑功能
Sep 05 Javascript
微信小程序实战之运维小项目
Jan 17 Javascript
JS数组操作中的经典算法实例讲解
Jul 26 Javascript
详解如何去除vue项目中的#——History模式
Oct 13 Javascript
js+canvas实现图片格式webp/png/jpeg在线转换
Aug 22 Javascript
js实现购物车商品数量加减
Sep 21 Javascript
如何用JS实现网页瀑布流布局
Apr 24 Javascript
JS随即打乱数组实现代码
Dec 03 #Javascript
JS图片预加载 JS实现图片预加载应用
Dec 03 #Javascript
输入密码检测大写是否锁定js实现代码
Dec 03 #Javascript
js操作textarea 常用方法总结
Dec 03 #Javascript
javascript object array方法使用详解
Dec 03 #Javascript
让AJAX不依赖后端接口实现方案
Dec 03 #Javascript
Javascript在IE和FireFox中的不同表现简析
Dec 03 #Javascript
You might like
坏狼的PHP学习教程之第2天
2008/06/15 PHP
批量修改RAR文件注释的php代码
2010/11/20 PHP
ThinkPHP模板自定义标签使用方法
2014/06/26 PHP
phpmyadmin中禁止外网使用的方法
2014/11/04 PHP
PHP连接SQL Server的方法分析【基于thinkPHP5.1框架】
2019/05/06 PHP
Yii框架小部件(Widgets)用法实例详解
2020/05/15 PHP
php与阿里云短信接口接入操作案例分析
2020/05/27 PHP
学习ExtJS table布局
2009/10/08 Javascript
javaScript中两个等于号和三个等于号之间的区别介绍
2014/06/27 Javascript
javascript继承机制实例详解
2014/11/20 Javascript
js实现select选择框效果及美化
2016/08/19 Javascript
JS解决position:sticky的兼容性问题的方法
2017/10/17 Javascript
JS实现关闭小广告特效
2021/01/29 Javascript
jquery实现吸顶导航效果
2020/01/08 jQuery
[01:00:53]2018DOTA2亚洲邀请赛3月29日 小组赛B组 iG VS Secret
2018/03/30 DOTA
Python help()函数用法详解
2014/03/11 Python
Python实现以时间换空间的缓存替换算法
2016/02/19 Python
Python中垃圾回收和del语句详解
2018/11/15 Python
python+selenium select下拉选择框定位处理方法
2019/08/24 Python
Pytorch 解决自定义子Module .cuda() tensor失败的问题
2020/06/23 Python
jupyter notebook 写代码自动补全的实现
2020/11/02 Python
HTML5添加鼠标悬浮音响效果不使用FLASH
2014/04/23 HTML / CSS
SQL Server提供的3种恢复模型都是什么? 有什么区别?
2012/05/13 面试题
企划经理的岗位职责
2013/11/17 职场文书
理货员的岗位职责
2013/11/23 职场文书
优秀员工自荐书
2013/12/19 职场文书
机械制造专业毕业生求职信
2014/03/02 职场文书
写自荐信的注意事项
2014/03/09 职场文书
先进事迹报告会主持词
2014/04/02 职场文书
国际贸易求职信
2014/07/05 职场文书
2016年六一文艺汇演开幕词
2016/03/04 职场文书
导游词之云南丽江古城
2019/09/17 职场文书
MySQL系列之十二 备份与恢复
2021/07/02 MySQL
Node-Red实现MySQL数据库连接的方法
2021/08/07 MySQL
Python可变集合和不可变集合的构造方法大全
2021/12/06 Python
忘记Grafana不要紧2种Grafana重置admin密码方法详细步骤
2022/04/07 Servers