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)});

js函数调用的几种方法的更多相关文章

  1. JS函数调用的四种方法

    js的函数调用会免费奉送两个而外的参数就是 this 和 arguments .arguments是参数组,他并不是一个真实的数组,但是可以使用.length方法获得长度. 书上有说4中调用方式: 方 ...

  2. js去除空格12种方法

    注:本文非本人原著:原文作者: 黄卉  <js去除空格12种方法> //JS去除空格的方法目前共有12种: //实现1 String.prototype.trim = function() ...

  3. 判断数组的方法/判断JS数据类型的四种方法

    参考文: 以下 3 个判断数组的方法,请分别介绍它们之间的区别和优劣Object.prototype.toString.call() . instanceof 以及 Array.isArray() h ...

  4. 动态加载JS脚本的4种方法

    实现OPOA(One Page One Application)时,必须使用动态加载js. 也就是在用户选择某个菜单项后,再动态加载对应的全部js到客户端. 动态加载js的情况很多啊,比如解决ajax ...

  5. OC和JS交互的三种方法

    看简书上说一共有六种OC和JS交互的方法,但是前三种原理都一致,都是通过检测.拦截Url地址实现互相调用的.剩下的react native等第三方框架原理不一样,也没有去研究,下边记录我使用的三种方法 ...

  6. 判断JS数据类型的四种方法

    在 ECMAScript 规范中,共定义了 7 种数据类型,分为 基本类型 和 引用类型 两大类,如下所示: 基本类型:String.Number.Boolean.Symbol.Undefined.N ...

  7. 判断js数据类型的四种方法,以及各自的优缺点(转)

    转载地址:https://blog.csdn.net/lhjuejiang/article/details/79623973 数据类型分为基本类型和引用类型: 基本类型:String.Number.B ...

  8. js数组去重五种方法

    今天来聊一聊JS数组去重的一些方法,包括一些网上看到的和自己总结的,总共5种方法(ES5). 第一种:遍历数组法 这种方法最简单最直观,也最容易理解,代码如下: var arr = [2, 8, 5, ...

  9. 实现JS继承的几种方法

    总的来说,JS的继承大体上分为两种:借用构造函数方式和原型方式 首先,我们来看看借用构造函数方式的几种做法: //方式一function Person(name, sex){ this.name = ...

随机推荐

  1. You Only Look Once Unified, Real-Time Object Detection(你只需要看一次统一的,实时的目标检测)

    我们提出了一种新的目标检测方法YOLO.先前的目标检测工作重新利用分类器来执行检测.相反,我们将目标检测作为一个回归问题来处理空间分离的边界框和相关的类概率.单个神经网络在一次评估中直接从完整图像预测 ...

  2. 苹果CMSv10宝塔全自动定时采集教程

    伙伴们在建立好自己的网站添加自定义资源库后,由于手动采集方式比较耗时间和精力更新也不够及时,是不是特别希望能有一个全自动定时采集方法来帮助网站增加视频资源解放自己的双手,那么现在就教大家如何用宝塔一步 ...

  3. Node.js 几个重启工程的工具

    pm2, forever, nodemon, supervisor 均可在 npm 查找相关资料和用法. 线上工程推荐 pm2 开发推荐 supervisor

  4. 大数据笔记(二十八)——执行Spark任务、开发Spark WordCount程序

    一.执行Spark任务: 客户端 1.Spark Submit工具:提交Spark的任务(jar文件) (*)spark提供的用于提交Spark任务工具 (*)example:/root/traini ...

  5. jQuery-validate插件初级篇

    特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...

  6. Python 使用 PyQt5 开发的关机小工具

    前两天简单认识了一下PyQt5,通过练习开发了一款在Window下自定义关机的小工具,代码如下 import os,sys,time from PyQt5 import QtCore,QtWidget ...

  7. JUnit@Before失效

    在学习Shiro的过程中需要使用到JUnit@Before注解配合测试,但是无论如何,@Before下面的方法都不按照预期的执行,困扰良久,后来各种百度终于找到根源,今分享于诸公,望能解诸公之急: J ...

  8. org.hibernate.AssertionFailure: null id don't flus

    我的是字段编码和数据库不匹配,是爬的微博数据

  9. Delphi XE2 之 FireMonkey 入门(33) - 控件基础: TFmxObject: SaveToStream、LoadFromStream、SaveToBinStream、LoadFromBinStream

    Delphi XE2 之 FireMonkey 入门(33) - 控件基础: TFmxObject: SaveToStream.LoadFromStream.SaveToBinStream.LoadF ...

  10. 编译mysql时CMake Error at cmake/readline.cmake:85 (MESSAGE)

    CMake Error at cmake/readline.cmake:85 (MESSAGE):  Curses library not found.  Please install appropr ...