JavaScript箭头函数返回箭头函数

最新推荐文章于 2023-01-13 13:11:29 发布

追风筝的程序员

最新推荐文章于 2023-01-13 13:11:29 发布

阅读量2k

点赞数 1

分类专栏：前端文章标签： JavaScript

本文链接：https://blog.csdn.net/hai1124948893/article/details/123648501

版权

前端专栏收录该内容

8 篇文章 0 订阅

订阅专栏

以下代码中，执行后输出什么结果呢？

<html>
<body>
</body>
<script>
    var a = 123
    const foo = () => a => console.log(this.a) // 结果？

    var obj1 = {
        a: 'obj1'
    }

    var obj2 = {
        a: 'obj2'
    }

    var bar = foo.call(obj1)
    bar.call(obj2)
</script>
</html>

答案是 123

原因：

<html>
<body>
</body>
<script>
    var a = 123
    const foo = () => {
        console.log(this);
        return a => {
            console.log(this);
            console.log(this.a)
        }
    }

    var obj1 = {
        a: 'obj1'
    }

    var obj2 = {
        a: 'obj2'
    }

    var bar = foo.call(obj1)
    bar.call(obj2)
</script>
</html>

结果都是 this，因为箭头函数 foo 创建时已经绑定全局的 this 对象了也就是 window，foo.call 也无法改变 this 的指向，因此箭头函数的 this 均指向 window。而 var a = 123 就是 window.a = 123。

<html>
<body>
</body>
<script>
    const a = 123 // 此处改为 const
    const foo = () => a => console.log(this.a)

    var obj1 = {
        a: 'obj1'
    }

    var obj2 = {
        a: 'obj2'
    }

    var bar = foo.call(obj1)
    bar.call(obj2)
</script>
</html>

此时结果为 undefined，因为 const 定义的变量不会在全局作用域中创建。

let a = 123 同理。

参考《前端开发核心知识进阶》

追风筝的程序员

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JavaScript箭头函数返回箭头函数

以下代码中，执行后输出什么结果呢？<html><body></body><script> var a = 123 const foo = () => a => console.log(this.a) // 结果？ var obj1 = { a: 'obj1' } var obj2 = { a: 'obj2' } var bar = foo.c.
复制链接

扫一扫