帮忙理解下这段JS闭包相关程序

发布于 2022-09-04 03:33:32 字数 1486 浏览 36 评论 0

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
        var context = "全局";
        var testObj = {
            context: "初始",
            callback: function (str) {
                //回调函数
                alert("callback:我所处的上下文中,context=" + this.context + ",我被回调的方式:" + str);
            }
        };
        //创建一个对象,作为测试回调函数的上下文
        testObj.context = "已设置";
        function testCall() {
            callMethod(testObj.callback);
            callWithClosure(function (param) {
                testObj.callback(param);
            });
            callObjMethod(testObj, testObj.callback);
        }

        function callMethod(method) {
            method("通过默认上下文回调");
        }

        function callWithClosure(method) {
            method("通过Closure保持上下文回调");
        }

        function callObjMethod(obj, method) {
            method.call(obj, "指定显式对象上下文回调");
        }
    </script>
</head>
<body><a href="javascript:void(0)" mce_href="javascript:void(0)" onclick="testCall()">调用测试</a></body>

在网上偶然浏览到的,有点混乱,为什么通过callWithClosure()调用那段中的this指向是testObj对象?还有callWithClosure()里新建的回调函数的闭包不是function testCall(){...}吗,"通过Closure保持上下文回调"是什么意思?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

野心澎湃 2022-09-11 03:33:33

事先声明我也是学生,说的内容可能有误,欢迎拍砖讨论。


  1. 上下文 === 执行上下文 === 执行环境 === (Execution Context),阅读英文文档发现只是翻译的问题,我觉得翻译成执行环境好理解多了。

  2. js闭包网上的解释很多,我觉得很多是错的,我只引用尼古拉斯红宝书上的原文(闭包:指有权访问另一个函数作用域中的变量的函数。)

  3. this对象是超级延时绑定,也就是函数加上小括号调用运行的时候它才会绑定执行环境,除非通过call、apply、bind给它指定。(原文:在全局函数 中,this等于window;当函数作为某个对象的方法调用时,this等于那个对象。不过,匿名函数的执行环境具有全局性)。所以遇到闭包嵌套的时候最里层的this一般都是指向window。


我的理解,第一个callMethod(testObj.callback)相当于window.callMethod(testObj.callback),将testObj内的callback函数作为参数传入callMethod,testObj.callback只是一个指向callback函数的引用,指针,并不在乎testObj.callback还是xxx.callback,真正的执行环境还是window。

第二个与第一个不同之处在于...(还没想好怎么说= =)

调用的时候相当于:

callWithClosure(function ("通过Closure保持上下文回调") {
                testObj.callback("通过Closure保持上下文回调");
            });
        

可见此时callback是作为testObj的方法调用的,所以this指向testObj对象。

第三个比较好理解,call()或apply()绑定this之后就没跑了。


第一次这么认真地回答问题,写了一个多小时,给个赞吧~(>﹏<)

我ぃ本無心為│何有愛 2022-09-11 03:33:33

闭包是指测试对象里的回调函数,所以导致this指向测试对象

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文