zoukankan      html  css  js  c++  java
  • JavaScript中call(apply) 的理解

    call 与 apply 是什么:

    call 方法应用于 Function 对象。语法为

    call([thisObj[,arg1[, arg2[,   [,.argN]]]]])  

    call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

    apply和call两者在作用上是相同的,但两者在参数上有区别的。对于第一个参数意义都一样,但对第二个参数:apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二个参数开始)。如 func.call(func1,var1,var2,var3)对应的 apply 写法为:func.apply(func1,[var1,var2,var3])。本文以 `call` 为例。

    在 call 传入对象

    var sayName = function () {  
        alert(this.name);
    }
    
    var hello= {  
        name: "hello,world"
    }
    
    sayName.call(hello); //hello,world

    上面这个例子可以很直观地理解 call 的工作原理。也就是说,当在函数中调用 call 这个方法时,函数内部的 this 对象会自动指向 call 方法中的第一个参数。在上面这个例子中也就是 hello这个对象了。所以在执行 sayName.call(hello) 时,函数内部的 this.name 则会自动指向 hello.name 。故最终结果为 hello,world。这是一个非常好理解的例子。接下来来看较为复杂的情况。

    function Person1 () {  
        this.name = "person1";
        this.sayName = function () {
            alert(this.name);
        }
    }
    
    function Person2 () {  
        this.name = "person2";
    }
    
    var p1= new Person2();
    
    Person1.call(p1);
    
    p1.sayName(); //person1  

    这个列子中,最关键的是 Person1.call(p1) 这一步。我们来看看在里面究竟发生了什么事。当调用 call这个方法时,函数 Person1 内部的 this 指向 p1这个对象。相当于,给 p1这个对象执行这两条语句:

        this.name = "person1";
        this.sayName = function () {
            alert(this.name);
        }
    因此,p1对象修改了name属性,新增了sayName(),所以当调用p1.sayName()的时候,返回为person1

    在 call 中传入函数

    var message = "hi";
    
    function class1 () {  
        this.message = "yeah";
    }
    
    function class2 () {  
        this.message = "hello";
        this.sayMessage = function () {
            alert(this.message);
        }
    }
    
    class2.call(class1);  
    class1.sayMessage();
    // hello class1.message = "msg";

    var s1 = new class1();

    console.log(s1.message) //"yeah"
    class1.sayMessage(); //msg


    这个列子中,最关键的是 class2.call(class1) 这一步。我们来看看在里面究竟发生了什么事。当调用 call这个方法时,函数 class2内部的 this 指向 class1这个函数对象。相当于,给 class1这个对象执行这两条语句:

        this.message = "hello";
        this.sayMessage = function () {
            alert(this.message);
        }

    这时候的class1就变成了:
    class1.message = "hello";
    class1.sayMessage = function(){
       alert(this.message)
    }
    *这里修改的是class1函数对象,并不是通过class1函数构造出来的实例对象
    
    


  • 相关阅读:
    电子邮件的工作原理
    常用邮箱服务器地址端口
    wpf \silverlight 保存控件为图片
    GIS理论(墨卡托投影、地理坐标系、地面分辨率、地图比例尺、Bing Maps Tile System)【转载】
    Visifire图表控件官网地址
    Ado方式导入excel混用数据类型引起数据缺失问题解决方法
    c#日期时间的操作
    获得excel的sheet名字
    正则表达式验证可发短信的号码,如手机号和小灵通号码(106+区号+号码)
    验证多行文本框输入长度的正则表达式
  • 原文地址:https://www.cnblogs.com/garyzhijiang/p/9133983.html
Copyright © 2011-2022 走看看