`
beyondbn
  • 浏览: 71574 次
社区版块
存档分类
最新评论

js函数调用常用方法详解

阅读更多

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函数的4种调用方法详解

    函数有四种调用模式,分别是:函数调用形式、方法调用形式、构造器形式、以及apply形式。这里所有的调用模式中,最主要的区别在于关键字 this 的意义,下面分别介绍这个几种调用形式。 本文主要内容: 1.分析函数的...

    详解微信小程序的不同函数调用的几种方法

    主要介绍了微信小程序的不同函数调用的几种方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    COM组件中调用JavaScript函数详解及实例

    COM组件中调用JavaScript函数详解及实例 要求是很简单的,即有COM组件A在IE中运行,使用JavaScript(JS)调用A的方法longCalc(),该方法是一个耗时的操作,要求通知IE当前的进度。这就要求使用回调函数,设其名称为...

    Javascript中匿名函数的调用与写法实例详解(多种)

    强制运算符使函数调用执行 (function(x,y){ alert(x+y); return x+y; }(3,4)); 方式2,调用函数,得到返回值。强制函数直接量执行再返回一个引用,引用再去调用执行 (function(x,y){ alert(x+y);...

    JavaScript 中调用 Kotlin 方法实例详解

    JavaScript 中调用 Kotlin 方法实例详解 Kotlin 编译器生成正常的 JavaScript 类,可以在 JavaScript 代码中自由地使用的函数和属性 。不过,你应该记住一些微妙的事情。 用独立的 JavaScript 隔离声明 为了防止损坏...

    JavaScript函数定义方法实例详解

    本文实例讲述了JavaScript函数定义方法。分享给大家供大家参考,具体如下: JavaScript 函数定义方法 函数声明 在之前的教程中,你已经了解了函数声明的语法 : function functionName(parameters) { 执行的代码 } ...

    JavaScript链式调用原理与实现方法详解

    一般的函数调用和链式调用的区别:链式调用完方法后,return this返回当前调用方法的对象。 首先,我们先来看看一般函数的调用方式 (1)先创建一个简单的类 //创建一个bird类 function Bird(name) { this.name=...

    nodejs中函数的调用实例详解

    一、调用本js文件中的函数 var http = require('http'); http.createServer(function (request,response){ response.writeHead(200, {'Contet-Type':'text/html;charset=utf-8'}); if(request.url!=='/favicon....

    JavaScript中立即执行函数实例详解

    ( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法,最初我以为是一个括号包裹匿名函数,再在后面加个括号调用函数,最后达到函数定义后立即执行的目的,后来发现加括号的原因...

    在一个页面重复使用一个js函数的方法详解

    2、给类.question绑定点击事件,在触发函数里面先判断当前点击的这个类的id,即可知道你要操作的是哪一个问题,然后调用你的那个伸缩函数即可。 <!DOCTYPE html> <html> <head lang=en> <meta ...

    javascript 回调函数详解

    在JavaScript中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A。我们就说函数A叫做回调函数。如果没有名称(函数表达式),就叫做匿名回调函数。因此callback 不一定...

    详解Javascript函数声明与递归调用

    本篇文章详细的介绍了Javascript函数声明与递归调用,是JS入门学习中的基础知识,需要的朋友可以参考下。

    JavaScript函数内部属性和函数方法实例详解

    函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。 函数是对象,有自己的属性和方法 。首先通过console下输出的函数属性方法来直观的看一下: 函数内部属性只要包括两个特殊的对象:arguments和this。...

    【JavaScript源代码】微信小程序页面与组件之间信息传递与函数调用.docx

     4.2处理小程序不支持异步阻塞微信小程序页面与组件之间信息传递与函数调用  这篇文章我会以我自己开发经验从如下几个角度来讲解相关的内容 最常用,最规范的方式,设置数据监听器observer。 ​ 假设在页面内...

    详解javascript函数的参数

    javascript函数可以用任意多个参数来调用,而不用管函数定义时指定了几个参数。因为函数是弱类型的,没有方法去声明它所期望的参数类型,并且给任何函数传递任何类型的值都是合法的。 1.Js函数可以传入不同的参数,...

Global site tag (gtag.js) - Google Analytics