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打开新窗口方法整理
Feb 17 Javascript
javasctipt如何显示几分钟前、几天前等
Apr 30 Javascript
JavaScript常用脚本汇总(一)
Mar 04 Javascript
jquery ui resize 中border-box的bug修正
Apr 26 Javascript
javascript自定义右键弹出菜单实现方法
May 25 Javascript
JS排序方法(sort,bubble,select,insert)代码汇总
Jan 30 Javascript
JavaScript设置名字输入不合法的实现方法
May 23 Javascript
浅谈express 中间件机制及实现原理
Aug 31 Javascript
jQuery EasyUI开发技巧总结
Sep 26 jQuery
vue-router路由与页面间导航实例解析
Nov 07 Javascript
vue项目base64字符串转图片的实现代码
Jul 13 Javascript
vue之组件内监控$store中定义变量的变化详解
Nov 08 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系统流量分析的程序
2006/10/09 PHP
用PHP实现小型站点广告管理
2006/10/09 PHP
Android AsyncTack 异步任务实例详解
2016/11/02 PHP
php实现文件与16进制相互转换的方法示例
2017/02/16 PHP
利用PHPExcel读取Excel的数据和导出数据到Excel
2017/05/12 PHP
javascript 简单高效判断数据类型 系列函数 By shawl.qiu
2007/03/06 Javascript
jquery1.4 教程二 ajax方法的改进
2010/02/25 Javascript
JavaScript自动设置IFrame高度的小例子
2013/06/08 Javascript
js实现屏蔽默认快捷键调用自定义事件示例
2013/06/18 Javascript
jquery滚动到顶部底部代码
2015/04/20 Javascript
javascript实现的闭包简单实例
2015/07/17 Javascript
Css3制作变形与动画效果
2015/07/24 Javascript
jquery+json实现数据二级联动的方法
2015/11/28 Javascript
jQuery AjaxUpload 上传图片代码
2016/02/02 Javascript
nodeJs爬虫获取数据简单实现代码
2016/03/29 NodeJs
Angular2 (RC5) 路由与导航详解
2016/09/21 Javascript
jQuery实现页面顶部下拉广告
2016/12/30 Javascript
Angular4实现图片上传预览路径不安全的问题解决
2017/12/25 Javascript
vue项目中公用footer组件底部位置的适配问题
2018/05/10 Javascript
vue实现日历表格(element-ui)
2020/09/24 Javascript
[01:21]DOTA2新纪元-7.0新版本即将开启!
2016/12/11 DOTA
python使用Pycharm创建一个Django项目
2018/03/05 Python
Python实现合并同一个文件夹下所有txt文件的方法示例
2018/04/26 Python
Python中判断输入是否为数字的实现代码
2018/05/26 Python
python数字类型math库原理解析
2020/03/02 Python
Python+MySQL随机试卷及答案生成程序的示例代码
2021/02/01 Python
有原因的手表:Flex Watches
2019/03/23 全球购物
英国折扣高尔夫商店:Discount Golf Store
2019/11/19 全球购物
公益活动策划方案
2014/01/09 职场文书
2015年乡镇环保工作总结
2015/04/22 职场文书
欠款证明
2015/06/24 职场文书
元素水平垂直居中的方式
2021/03/31 HTML / CSS
python Tkinter的简单入门教程
2021/04/11 Python
JS ES6异步解决方案
2021/04/29 Javascript
Python中X[:,0]和X[:,1]的用法
2021/05/10 Python
奥特曼十大神器:奥特手镯在榜,第一是贝利亚的神器
2022/03/18 日漫