javascript - 在回调函数中如果使用箭头函数怎么获取相应的this?
高洛峰
高洛峰 2017-04-11 11:33:45
[JavaScript讨论组]

举个例子,用jQuery

$('#test').on('click', ()=>{
    console.log(this) // window
});

那我要怎么获取外部和内部的this?除了将箭头函数换成原来的function就没有其他方法了吗?

高洛峰
高洛峰

拥有18年软件开发和IT教学经验。曾任多家上市公司技术总监、架构师、项目经理、高级软件工程师等职务。 网络人气名人讲师,...

全部回复(2)
黄舟

阮一峰es6中说到,箭头函数中没有自己的this:

this指向的固定化,并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this

官方也有说明:

Arrow functions capture the this value of the enclosing context

所有箭头函数通过call或者apply调用时传this也是没有效果的

迷茫

在我理解来看,箭头函数是在想保留当前this的引用而用的。

简单举例:

document.body.addEventListener('click',function(){
    // 想在1s后改变一下背景色
    
    // 错误示范
    setTimeout(function(){
        // 如果使用匿名函数的话,this就不再指向body元素了
        this.style.backgroundColor = 'red';
    },1000);
    
    // 所以为了保留原来this的引用,我应该用箭头函数

    // 正确写法
    setTimeout(()=>{
        // 这时候this还是指向body
        this.style.backgroundColor = 'red';
    },1000); 
});

所以啊,绑定事件什么的,就用匿名函数吧。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号