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 相关文章推荐
解决表单中第一个非隐藏的元素获得焦点的一个方案
Oct 26 Javascript
IE中的File域无法清空使用jQuery重设File域
Apr 24 Javascript
分享一个自己动手写的jQuery分页插件
Aug 28 Javascript
EasyUI实现二级页面的内容勾选的方法
Mar 01 Javascript
JavaScript动态修改背景颜色的方法
Apr 16 Javascript
Backbone.js框架中简单的View视图编写学习笔记
Feb 14 Javascript
JS只能输入正整数的简单实例
Oct 07 Javascript
AngularJS表格样式简单设置方法示例
Mar 03 Javascript
3分钟掌握常用的JS操作JSON方法总结
Apr 25 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
Jul 24 Javascript
JS数组操作之增删改查的简单实现
Aug 21 Javascript
jquery实现图片跟随鼠标的实例
Oct 17 jQuery
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+jQuery 注册模块的改进(一):验证码存入SESSION
2014/10/14 PHP
ThinkPHP中自定义错误页面和提示页面实例
2014/11/22 PHP
php将数组转换成csv格式文件输出的方法
2015/03/14 PHP
php实现阳历阴历互转的方法
2015/10/28 PHP
详解Window7 下开发php扩展
2015/12/31 PHP
基于jQuery实现点击同时更改两个iframe的网址
2010/07/01 Javascript
DLL+ ActiveX控件+WEB页面调用例子
2010/08/07 Javascript
Ajax中解析Json的两种方法对比分析
2015/06/25 Javascript
js编写贪吃蛇的小游戏
2020/08/24 Javascript
javascript中arguments,callee,caller详解
2016/03/16 Javascript
用jmSlip编写移动端顶部日历选择控件
2016/10/24 Javascript
angular或者js怎么确定选中ul中的哪几个li
2017/08/16 Javascript
Vue组件通信之Bus的具体使用
2017/12/28 Javascript
解决Vue 项目打包后favicon无法正常显示的问题
2018/09/01 Javascript
详解在网页上通过JS实现文本的语音朗读
2019/03/28 Javascript
详解小程序退出页面时清除定时器
2019/04/28 Javascript
[52:29]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第三局
2016/03/03 DOTA
java中的控制结构(if,循环)详解
2019/06/26 Python
简单了解python的break、continue、pass
2019/07/08 Python
解决matplotlib.pyplot在Jupyter notebook中不显示图像问题
2020/04/22 Python
如何设置PyCharm中的Python代码模版(推荐)
2020/11/20 Python
canvas实现圆形进度条动画的示例代码
2017/12/26 HTML / CSS
澳大利亚UGG工厂直销:Australian Ugg Boots
2017/10/14 全球购物
办公室员工岗位工作职责
2014/03/10 职场文书
工厂仓管员岗位职责范本
2014/07/17 职场文书
工作粗心大意检讨书
2014/09/18 职场文书
群众路线对照检查材料
2014/09/22 职场文书
学校党委干部个人对照检查材料思想汇报
2014/10/09 职场文书
小班下学期幼儿评语
2014/12/30 职场文书
客房领班岗位职责
2015/02/11 职场文书
小学教研工作总结2015
2015/05/13 职场文书
活动费用申请报告
2015/05/15 职场文书
PyQt5爬取12306车票信息程序的实现
2021/05/14 Python
浅谈pytorch中stack和cat的及to_tensor的坑
2021/05/20 Python
jdbc中自带MySQL 连接池实践示例
2022/07/23 MySQL
LyScript实现绕过反调试保护的示例详解
2022/08/14 Python