js 回调函数中 this对象的执行环境(上下文)

最新推荐文章于 2023-07-20 09:19:03 发布

赶路人儿

最新推荐文章于 2023-07-20 09:19:03 发布

阅读量4.3k

点赞数 2

分类专栏： web前端

本文链接：https://blog.csdn.net/liuxiao723846/article/details/42474849

版权

web前端专栏收录该内容

294 篇文章 13 订阅

订阅专栏

<html> 
<head> 
<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); 
        callObjMethod(testObj,testObj.callback); 
    } 
    function callMethod(method){ 
        method("通过默认上下文回调"); 
    } 
    function callObjMethod(obj,method){ 
        method.call(obj,"指定显式对象上下文回调"); 
    } 
	function testCall1(){
		testObj.callback('直接执行');
	}
// --></script> 
</head> 
<body> <a href="javascript:void(0)" οnclick="testCall()">调用测试</a> 

<a href="javascript:void(0)" οnclick="testCall1()">调用测试1</a></body> 
</html>

执行上面的代码，点击第一个链接，结果是：callback:我所处的上下文中，context=全局，我被回调的方式：通过默认上下文回调、callback:我所处的上下文中，context=已设置，我被回调的方式：指定显式对象上下文回调

点击第二个链接，结果是callback:我所处的上下文中，context=已设置，我被回调的方式：直接执行

结论：

1、在回调函数中的this，其上下文环境是调用者所在的执行环境；本例中，点击第一个链接时，执行的环境是callMethod>testCall>window

2、本例中，作为对象testObj中的方法调用，this值得是testObj对象本身。(例如点击第二个链接的记过)

赶路人儿

关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
js 回调函数中 this对象的执行环境(上下文)

<!-- var context="全局"; var testObj={ context:"初始", callback:function (str){ //回调函数 alert("callback:我所处的上下文中，context="+this.context+"，我被回调的方式："+str
复制链接

扫一扫