JS："this" 在严格模式下的函数上下文中，MDN 规范与 chrome 67 实现不匹配

Question

来自 MDN：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this，它说：

然而，在严格模式下，this 的值保持在进入执行上下文时设置的值，因此，在以下情况下，this 将默认为 undefined：

function f2() {   
  'use strict'; // see strict mode   
  return this; 
}

f2() === undefined; // true

这表明如果我 (1) 'use strict'; (2) 在调用 f2 的另一个函数中定义 f2 会为 f2 绑定外部函数的 this。但是！

没用...

'use strict';

function AlarmClock(clockName) {
  this.clockName=clockName;
}

console.log("hello, let's see some weird stuff");

console.log("THIS in global", this);

AlarmClock.prototype.start = function(seconds) {
  console.log('outer', this);
  var testInside = function() {
    console.log('inner', this);
  }
  testInside();
}

var clock = new AlarmClock("Horizons")
clock.start(1);


// WITHOUT CONSTRUCTORS

function withoutOut() {
  console.log("withoutOut", this)
  this.howard="notSoBad";
  console.log("modifiedTheThis, should have Howard", this)
  function withoutIn1() {
   console.log("withoutIn1", this);
   console.log("Strict should set to the defining object's this");
  }
  var withoutIn2 = function() {
    console.log("withoutIn2", this);
    console.log("Strict should set to the defining object's this");
  }
  withoutIn1();
  withoutIn2();
}

withoutOut.bind({Moose: "genius"})();

console.log("DONE");

给出此输出：

hello, let's see some weird stuff
THIS in global {}
outer AlarmClock { clockName: 'Horizons' }
inner undefined
withoutOut { Moose: 'genius' }
modifiedTheThis, should have Howard { Moose: 'genius', howard: 'notSoBad' }
withoutIn1 undefined
Strict should set to the defining object's this
withoutIn2 undefined
Strict should set to the defining object's this
DONE

注意：我运行使用节点 v10.5.0，来自 mac osx 命令行。

注意 2：如果你运行在 devtools 中，你必须 follow these steps for use strict.

注意 3：基本上，我想找到一些方法来获得内部，withoutIn1 或 withoutIn2 不被定义。而且，我知道您可以使用显式绑定来执行此操作，但我想专门获取 MDN 文档中指定的行为。

如果你同意我的观点，MDN 应该将 "this" 文档更改为只是说，在 "use strict" 的函数上下文中，这始终设置为未定义。（作者喜欢）

或者，Chrome 应该更改实现。（作者不喜欢）

Answer 1

调用函数时 this 的值与函数的定义方式或位置完全无关。它只与函数的调用方式有关。调用你的内部函数：

AlarmClock.prototype.start = function(seconds) {
  console.log('outer', this);
  var testInside = function() {
    console.log('inner', this);
  }
  testInside();
}

like testInside() 没有任何对象引用意味着没有任何东西可以绑定到 this，而在严格模式下这意味着 this 是 undefined。但是，如果您改写

  testInside.call(this);

然后会有一个上下文值。一个函数是 "inside" 另一个函数的事实同样对 this 的绑定方式没有任何影响。或者：

  this.testInside = testInside;
  this.testInside();

它也会起作用，因为再次有上下文。

哦，还有，新的（大概）箭头函数机制确实让你创建的函数可以有效地"inherit" this 值词汇环境。所以：

AlarmClock.prototype.start = function(seconds) {
  console.log('outer', this);
  var testInside = () => {
    console.log('inner', this);
  }
  testInside();
}

会工作，因为调用箭头函数不涉及任何this绑定； this 本质上就像闭包中的变量。

JS："this" 在严格模式下的函数上下文中，MDN 规范与 chrome 67 实现不匹配

JS: "this" in function context in strict mode, MDN spec doesn't match chrome 67 implementation

javascript

function

this

executioncontext