this

作者: 块垒 | 来源:发表于2016-09-27 11:00 被阅读21次

    apply、call 有什么作用,什么区别

    • 首先要引入this这个概念
      由于运行期绑定的特性,this的含义非常多,既可以是全局对性爱那个,当前对象或任意对象,这取决于函数的调用方式,但总有一个原则,那就是this指的是调用函数的那个对象。
    1. 作为函数调用:在函数直接调用时this绑定到全局对象,在浏览器中,window就是该全局对象。
    2. 内部函数:函数嵌套产生的内部函数的this不是其父函数,仍是全局变量
    3. setTimeout、setinterval:这两个方法执行的函数this也是全局对象
    4. 作为构造函数调用:所谓构造函数,就是通过这个函数生成一个新对象。这时,this就指这个新对象。
      new 运算符接受一个函数 F 及其参数:new F(arguments...)。这一过程分为三步:
      1. 创建类的实例。这步是把一个空的对象的 proto 属性设置为 F.prototype 。
      2. 初始化实例。函数 F 被传入参数并调用,关键字 this 被设定为该实例。
      3. 返回实例。
    5. 作为对象方法调用:在JS中,函数也是对象,因此函数可以作为一个对象的属性,此时该函数被称为该对象的方法,在使用这种调用方法时,this被自然绑定到该对象。
    6. DOM对象绑定事件:在事件处理程序中this代表事件源DOM对象(低版本IE被指向了window
    • apply、call的作用
      apply、call的作用是相同的,都是指定函数的this和参数来调用函数,使用callapply可以使this的指向变得清晰。
    • apply、call的区别
      apply接受的是数组形式的参数,call接受的是多个参数。

    代码

    1. 以下代码输出什么?
    var john = { 
      firstName: "John" 
    }
    function func() { 
      alert(this.firstName + ": hi!")
    }
    john.sayHi = func
    john.sayHi() 
    

    输出john:hi!

    1. 下面代码输出什么,为什么
    func() 
    function func() { 
      alert(this)
    }
    

    输出window,因为函数是全局作用域下调用的

    1. 下面代码输出什么
    function fn0(){
        function fn(){
            console.log(this);
        }
        fn();
    }
    fn0(); //输出window
    document.addEventListener('click', function(e){
        console.log(this); //输出document节点
        setTimeout(function(){
            console.log(this); //输出window
        }, 200); 
    }, false);
    
    1. 下面代码输出什么,why
    var john = { 
      firstName: "John" 
    }
    function func() { 
      alert( this.firstName )
    }
    func.call(john) 
    

    输出John,因为通过call把this指为了john对象

    1. 代码输出?
    var john = { 
      firstName: "John",
      surname: "Smith"
    }
    function func(a, b) { 
      alert( this[a] + ' ' + this[b] )
    }
    func.call(john, 'firstName', 'surname') 
    

    输出John Smith

    1. 以下代码有什么问题,如何修改
    var module= {
        bind: function(){
          var cur=this; //添加
          $btn.on('click', function(){
            console.log(this) //this指什么
            cur.showMsg();//改
          })
        },
        showMsg: function(){
         console.log('饥人谷');
        }
    }
    

    在DOM绑定事件中this被指向了事件源DOM对象,所以this.showMsg()无法正常调用

    相关文章

      网友评论

        本文标题:this

        本文链接:https://www.haomeiwen.com/subject/qeycyttx.html