JS 高级

最新推荐文章于 2024-09-21 11:34:18 发布

诗人不写诗

最新推荐文章于 2024-09-21 11:34:18 发布

阅读量112

点赞数

分类专栏： # HTML&CSS&JS 文章标签： javascript

本文链接：https://blog.csdn.net/tales522/article/details/124783611

版权

HTML&CSS&JS 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文介绍了JavaScript中的闭包概念，它使得函数内部的变量在函数执行后仍能保持状态。闭包在函数返回内部函数时产生，允许外部访问内部数据。示例展示了闭包在变量持久化和作用域链的应用，以及在异步操作如`setTimeout`中的使用。此外，还通过两个练习解释了`this`关键字在闭包和对象方法中的行为差异。

摘要由CSDN通过智能技术生成

1、闭包

闭包是函数内部的函数且引用了外部函数的数据产生的数据区域。执行函数定义就会产生闭包，而不是调用函数。
闭包的作用：
1、使函数内部的变量在函数执行完后，仍然存活
2、让函数外部可以访问函数内部的数据

<!DOCTYPE html>
<html lang="zh-cN">

<head>
    <meta charset="UTF-8">
    <title>闭包</title>
</head>

<body>
    <script>
        function fn1() {
            // 闭包这里就产生，因为函数定义提升
            var a = 2
            function fn2() {
                a++
                console.log(a)
            }
            // 返回了内部函数fn2，而fn2访问了局部变量，导致将局部变量暴露出去了。
            return fn2
        }
        var f = fn1()
        f()
        f()
        f = null // 闭包销毁

        function showDelay(msg, time) {
            setTimeout(function () {
                console.log(msg)
            }, time)
        }
        showDelay('闭包', 1000)

        // 练习
        var name = "window"
        var obj = {
            name: "my obj",
            getNameFun: function () {
                return function () {
                    return this.name;
                }
            }

        }
        console.log(obj.getNameFun()()) // window

        // 练习2
        var name2 = "window"
        var obj2 = {
            name2: "my obj",
            getNameFun: function () {
                var that = this;
                return function () {
                    return that.name2;
                }
            }
        }
        console.log(obj2.getNameFun()()) // my obj
    </script>
</body>

</html>