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 相关文章推荐
读jQuery之十三 添加事件和删除事件的核心方法
Aug 23 Javascript
基于jquery的放大镜效果
May 30 Javascript
一些老手都不一定知道的JavaScript技巧
May 06 Javascript
基于jquery实现省市联动特效
Dec 17 Javascript
js实现页面跳转的五种方法推荐
Mar 10 Javascript
jquery选择器中的空格与大于号>、加号+与波浪号~的区别介绍
Jun 24 Javascript
vue.js通过自定义指令实现数据拉取更新的实现方法
Oct 18 Javascript
JS简单封装的图片无缝滚动效果示例【测试可用】
Mar 22 Javascript
js canvas实现放大镜查看图片功能
Jun 08 Javascript
深入理解React高阶组件
Sep 28 Javascript
简单明了区分escape、encodeURI和encodeURIComponent
May 26 Javascript
jQuery 选择器用法实例分析【prev + next】
May 22 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调用三种数据库的方法(2)
2006/10/09 PHP
php入门小知识
2008/03/24 PHP
php+curl 发送图片处理代码分享
2015/07/09 PHP
PHP数组实例详解
2016/06/26 PHP
PHP7新增运算符用法实例分析
2016/09/26 PHP
Laravel基础-关于引入公共文件的两种方式
2019/10/18 PHP
JavaScript入门教程(7) History历史对象
2009/01/31 Javascript
Javascript解决常见浏览器兼容问题的12种方法
2010/01/04 Javascript
jquery实现盒子下拉效果示例代码
2013/09/12 Javascript
js确认删除对话框效果的示例代码
2014/02/20 Javascript
nodejs事件的监听与触发的理解分析
2015/02/12 NodeJs
简单分析javascript中的函数
2016/09/10 Javascript
D3.js实现直方图的方法详解
2016/09/25 Javascript
Vue使用axios出现options请求方法
2019/05/30 Javascript
Vue 设置axios请求格式为form-data的操作步骤
2019/10/29 Javascript
js实现有趣的倒计时效果
2021/01/19 Javascript
[42:27]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第三局
2016/03/05 DOTA
Python中模块string.py详解
2017/03/12 Python
Python 多线程实例详解
2017/03/25 Python
Python学习思维导图(必看篇)
2017/06/26 Python
详解利用django中间件django.middleware.csrf.CsrfViewMiddleware防止csrf攻击
2018/10/09 Python
python list格式数据excel导出方法
2018/10/31 Python
python实现归并排序算法
2018/11/22 Python
Django框架模板注入操作示例【变量传递到模板】
2018/12/19 Python
python3发送邮件需要经过代理服务器的示例代码
2019/07/25 Python
使用Django搭建web服务器的例子(最最正确的方式)
2019/08/29 Python
bareMinerals官网:矿物质化妆品和护肤品
2018/02/04 全球购物
英国大码女性时装零售商:Evans
2018/08/29 全球购物
印尼极简主义和实惠的在线家具店:Fabelio
2019/03/27 全球购物
行政经理的岗位职责
2013/11/23 职场文书
群众路线个人剖析材料
2014/10/07 职场文书
公司地址变更通知
2015/04/25 职场文书
职场:企业印章管理制度(模板)
2019/10/18 职场文书
手把手教你导入Go语言第三方库
2021/08/04 Golang
python中redis包操作数据库的教程
2022/04/19 Python
Go中使用gjson来操作JSON数据的实现
2022/08/14 Golang