文档章节

JS函数调用的四种方法

文文1
 文文1
发布于 2015/03/25 11:53
字数 549
阅读 25
收藏 0

书上有说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)}); 


© 著作权归作者所有

共有 人打赏支持
文文1
粉丝 22
博文 380
码字总数 119919
作品 0
长沙
程序员
私信 提问
这样剖析JavaScript中的属性和方法,也许你就会更清楚

玩转JavaScript,你得有很扎实的基础,这些基础体现在哪里?其中一个最重要的点就是对JavaScript的属性和方法有足够的了解和认识。这里,我会带大家一起来彻底消灭这些盲点(对JavaScript属性...

Jack088
2018/07/25
0
0
WebAssembly  时代,Rust 也想成为 Web 语言

目前 Mozilla 正在基于 WebAssembly 可移植代码格式研发 JavaScript 和 Rust 之间的桥梁——wasm-bindgen,意义是提高 JavaScript 和 Rust 之间的互操作性。Mozilla 这么做是想让 Rust 成为类...

h4cd
2018/04/10
4.2K
16
WebAssembly 时代,Rust 也想成为 Web 语言

目前 Mozilla 正在基于 WebAssembly 可移植代码格式研发 JavaScript 和 Rust 之间的桥梁——wasm-bindgen,意义是提高 JavaScript 和 Rust 之间的互操作性。Mozilla 这么做是想让 Rust 成为类...

开源中国
2018/04/10
0
0
ASP.NET后台中调用前台Javascript函数的几种方法

做web开发,用的技术是aspx.net,可是由于比较习惯于ASP现在做起来,觉得非常别扭,原因在于有很多功能其实在前台可以处理的,但是因为用到了很多webcontrol,导致不断postback。如果利用aja...

rstaryan
2013/07/18
0
0
和Javascript函数谈一场恋爱(上)

如果Javascript函数是我心中的那个女孩,那么,就让我们谈一场恋爱吧。 1 初见 初见Javascript函数,其实和其它语言的函数也没什么两样。 1.1 函数的声明 function is_true() { return true...

weixin_胖胖熊_0
2018/07/30
0
0

没有更多内容

加载失败,请刷新页面

加载更多

网络编程

第14天 网络编程 今日内容介绍  网络通信协议  UDP通信  TCP通信 今日学习目标  能够辨别UDP和TCP协议特点  能够说出UDP协议下两个常用类名称  能够说出TCP协议下两个常用类名称...

stars永恒
31分钟前
0
0
二进制相关

二进制 众所周知计算机使用的是二进制,数字的二进制是如何表示的呢? 实际就是逢二进一。比如 2 用二进制就是 10。那么根据此可以推算出 5的二进制等于 10*10+1 即为 101。 在计算机中,负数以...

NotFound403
昨天
2
0
day22:

1、写一个getinterface.sh 脚本可以接受选项[i,I],完成下面任务: 1)使用格式:getinterface.sh [-i interface | -I ip] 2)当用户使用-i选项时,显示指定网卡的IP地址;当用户使用-I选项...

芬野de博客
昨天
2
0
Spring Cloud Alibaba基础教程:使用Nacos实现服务注册与发现

自Spring Cloud Alibaba发布第一个Release以来,就备受国内开发者的高度关注。虽然Spring Cloud Alibaba还没能纳入Spring Cloud的主版本管理中,但是凭借阿里中间件团队的背景,还是得到不少...

程序猿DD
昨天
4
0
Java并发编程:深入剖析ThreadLocal

ThreadLocal 的理解 ThreadLocal,很多地方叫线程本地变量,或线程本地存储。ThreadLocal为变量在每个线程中都创建了一个副本,每个线程可以访问自己内部的副本变量。===》解决的问题是线程间...

细节探索者
昨天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部