ES6-箭头函数this指向

最新推荐文章于 2022-12-30 14:30:27 发布

申申あ

最新推荐文章于 2022-12-30 14:30:27 发布

阅读量347

点赞数

分类专栏： ES6 文章标签： es6 javascript 前端

本文链接：https://blog.csdn.net/qq_43781887/article/details/126042968

版权

箭头函数内部没有this指向，箭头函数内部this指向只能通过查找作用域链来决定，一旦使用箭头函数当前就不存在作用域链。

下面这样写会报错：

<body>
    <script>
        let Page = {
            id: 123,
            init: function() {
                document.addEventListener('click', function(e) {
                    this.todo(e)
                })
            },
            todo: function(type) {
                console.log(`事件类型:${type},当前id:${this.id}`);
            }
        }
        Page.init()
    </script>
</body>

如果改成下面这样：

<body>
    <script>
        let Page = {
            id: 123,
            init: function() {
                document.addEventListener('click', (e) => {
                    this.todo(e)
                })
            },
            todo: function(type) {
                console.log(

最低0.47元/天解锁文章

申申あ

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ES6-箭头函数this指向

因为箭头函数是没有this指向的，所以在click事件里面的回调函数就没有this，它会去上一层init里面去找，init也是一个箭头函数也没有this指向又到Page，然后找定义Page对象的作用域链就是window。因为箭头函数是没有this指向的，所以在click事件里面的回调函数就没有this，它会去上一层init里面去找，init也是一个箭头函数也没有this指向又到Page，然后找定义Page对象的作用域链就是window。...
复制链接

扫一扫