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操作Select选择的Text和Value(获取/设置/添加/删除)
Mar 06 Javascript
用jquery写的菜单从左往右滑动出现
Apr 11 Javascript
jquery和css3实现的炫酷时尚的菜单导航
Sep 01 Javascript
JavaScript使用shift方法移除素组第一个元素实例分析
Apr 06 Javascript
jq实现左侧显示图片右侧文字滑动切换效果
Aug 04 Javascript
JS文件上传神器bootstrap fileinput详解
Jan 28 Javascript
Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound的解决方法
Jan 19 Javascript
JavaScript解析机制与闭包原理实例详解
Mar 08 Javascript
Webpack4+Babel7+ES6兼容IE8的实现
Apr 10 Javascript
javascript中的this作用域详解
Jul 15 Javascript
Vue 中可以定义组件模版的几种方式
Aug 06 Javascript
JavaScript中this的学习笔记及用法整理
Feb 17 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
杏林同学录(四)
2006/10/09 PHP
php短网址和数字之间相互转换的方法
2015/03/13 PHP
PHP.ini安全配置检测工具pcc简单介绍
2015/07/02 PHP
php调用自己java程序的方法详解
2016/05/13 PHP
php求今天、昨天、明天时间戳的简单实现方法
2016/07/28 PHP
基于PHP实现短信验证码接口(容联运通讯)
2016/09/06 PHP
PHP超级全局变量【$GLOBALS,$_SERVER,$_REQUEST等】用法实例分析
2019/12/11 PHP
tp5.1 框架数据库-数据集操作实例分析
2020/05/26 PHP
js去除重复字符串两种实现方法
2013/01/09 Javascript
jQuery获得内容和属性示例代码
2014/01/16 Javascript
BootStrap tooltip提示框使用小结
2016/10/26 Javascript
js实现简单的选项卡效果
2017/02/23 Javascript
Js实现中国公民身份证号码有效性验证实例代码
2017/05/03 Javascript
js学习总结之dom2级事件基础知识详解
2017/07/27 Javascript
微信小程序 获取session_key和openid的实例
2017/08/17 Javascript
原生JS实现的简单轮播图功能【适合新手】
2018/08/17 Javascript
vuejs选中当前样式active的实例
2018/08/22 Javascript
JS实现二维数组元素的排列组合运算简单示例
2019/01/28 Javascript
在 Vue 中编写 SVG 图标组件的方法
2020/02/24 Javascript
Vue父组件监听子组件生命周期
2020/09/03 Javascript
[02:56]DOTA2上海特锦赛小组赛解说FreeAgain采访花絮
2016/02/27 DOTA
解决python爬虫中有中文的url问题
2018/05/11 Python
python 插入日期数据到Oracle实例
2020/03/02 Python
python实现小程序推送页面收录脚本
2020/04/20 Python
CPB肌肤之钥美国官网:Clé de Peau Beauté
2017/09/05 全球购物
荷兰皇家航空公司中国官网:KLM中国
2017/12/13 全球购物
Rossignol金鸡美国官网:始于1907年法国百年雪具品牌
2019/03/06 全球购物
日本最佳原创设计品牌:Felissimo(芬理希梦)
2019/03/19 全球购物
简历里的自我评价范文
2014/02/24 职场文书
公司投资建议书
2014/05/16 职场文书
小学综合实践活动总结
2014/07/07 职场文书
教师自查自纠材料
2014/10/14 职场文书
施工员岗位职责
2015/02/10 职场文书
写给老师的保证书
2015/05/09 职场文书
怎样评估创业计划书是否有可行性?
2019/08/07 职场文书
创业计划书之孕婴生活馆
2019/11/11 职场文书