以下示例中上下文的奇怪变化

Question

我尝试了以下示例，但 2 种类型的控制台返回了 2 个不同的结果。我希望我的自定义对象在这两种情况下都能返回，但结果似乎有点奇怪。有人可以解释结果吗？

<html> 
<head> </head> 
<body> 
<script>
var obj1 = {
 printThis: function() {
  console.log(this);
 }
};

obj1.printThis(); //refers to my custom object

var func1 = obj1.printThis;
func1(); //refers to window object
</script>
</body> 
</html>

结果：

第一个控制台 returns 自定义对象，第二个 returns Window 对象 （虽然在 Whosebug 由于他们自己的匿名函数包装它可能引用的一些其他对象）。但是，在 Chrome 中，第二个控制台提供了对 Window 对象的引用。

Answer 1

输出因执行函数 (printThis) 的上下文或环境而不同。在第一种情况下，函数的执行上下文在 obj1 内部。但在第二种情况下，函数是在全局上下文或环境中执行的。

如果要在 obj1 中执行第二个函数调用，则必须像 obj1.printThis.bind(obj1) 那样显式绑定它。

var obj1 = {
 printThis: function() {
  console.log(this);
 }
};

obj1.printThis(); 

var func1 = obj1.printThis.bind(obj1);
func1();

以下示例中上下文的奇怪变化

Strange change of Context in following example

html

javascript

lexical-scope