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. 【Leetcode】二叉树的层次遍历

    题目: 给定一个二叉树,返回其节点值自底向上的层次遍历. (即按从叶子节点所在层到根节点所在的层,逐层从左向右遍历) 例如: 思路:采用宽度优先搜索. 时间复杂度:O(n).n为节点的数量,遍历所有节 ...

  2. BZOJ 4417 Luogu P3990 [SHOI2013]超级跳马 (DP、矩阵乘法)

    题目链接: (bzoj) https://www.lydsy.com/JudgeOnline/problem.php?id=4417 (luogu)https://www.luogu.org/prob ...

  3. Oracle数据库表空间查看和更改

    set linesize 200  --设置输出一行字符个数为200 1.查看表空间名称和大小(单位MB) SELECT t.tablespace_name, round(SUM(bytes / (1 ...

  4. the path component: '/var' is world-writable

    java.io.IOException: the path component: '/var' is world-writable.  Its permissions are 0666.  Pleas ...

  5. hibernate一对一单项关联映射

    一.主键关联 1.两个实体对象的主键一样,以表明它们之间的一一对应关系: 2.不需要多余的外键字段来维护关系,仅通过主键来关联,即Person的主键要依赖IdCard的主键,他们共用一个主键值. Pe ...

  6. mysql学生成绩排名,分组取前 N 条记录

    转载  https://blog.csdn.net/jslcylcy/article/details/72627762 score表: CREATE TABLE `score` ( `student_ ...

  7. java执行命令行,以及解决卡死问题

    java可以执行本地命令行,但是有一个坑,命令执行后,已经执行完毕,但是卡死不返回,这是因为: 命令会返回两个输出流,正确的返回流,和错误的返回流 一般程序的做法是先循环读正确的返回流,再读错误的返回 ...

  8. Eigen中的矩阵及向量运算

    Eigen中的矩阵及向量运算 ,[+,+=,-,-=] ,[\*,\*=] ,[.transpose()] ,[.dot(),.cross(),.adjoint()] ,针对矩阵元素进行的操作[.su ...

  9. 全局namespace与模块内的namespace

    declare global{ declare namespace xxx } 相当于 在一个js文件的顶级部分 declare namespace xxx 声明的都是全局的namespace, 如果 ...

  10. 测开之路一百二十九:jinja2模板语法

    flask用的是jinja2模板,有自己特定的语法 形参: 在html里面留占位参数: {{ 参数名 }},后端传值时,参数名=参数值 <!DOCTYPE html><html la ...