账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    匿名回调函数中的this指向
    22
    0

    在平时对setTimeout addEventListener这种函数的使用,都会传入一个匿名的callback函数

    如:

    1.
    window.setTimeout(function() {
        console.log(this)
    }, 1000) 
    
    或者
    2.
    var el = document.getElementById('wrapper')
    el.addEventListener('click', function() {
        console.log(this)
    }, false)

    上述情况1中this会指向setTimeout函数的caller -> window对象
    而情况2中this也会指向addEventListener函数的caller -> wrapper这个对象

    但是我自己类似于window.setTimeout这样创建了一个对象

    var a = {
        b: 'b in a',
        c: function (callback) {
            callback()
        }
    }
    
    //调用a对象的c函数,传入匿名函数作为参数
    a.c(function() {
        //本以为this是指向a的,会输出字符串'b in a',实际此时this指向window
        console.log(this.b) 
    })

    我原本以为会类似于window.setTimeout el.addEventListener那样,this会指向.(点号)之前的对象。

    然后我改了一下对象a

    var a = {
        b: 'b in a',
        c: function (callback) {
            callback.bind(this)()
        }
    }

    这个时候this才指向a。

    那么问题来了:
    1.像这种匿名函数传参的用法,为什么使用我自己定义的对象和浏览器提供的api产生的效果不一样呢?这种类型的this的指向应该如何更好的理解
    2.是不是像setTimeoutaddEventListener这种系统api,它的内部实现就帮我们去把this bind给了调用这个方法的对象,如setTimeout中就有callback.bind(window)addEventListener就有callback.bind(el)?

    有没有各路大神可以解答一下,小弟感激不尽。

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 放ジ荡〆 普通会员 1楼
      502 Bad Gateway

      502 Bad Gateway


      nginx
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部