Question

初始问题

下面的代码应返回1，3，因为x: 1仅出现在return语句的上方-但是，它返回的是3，{{1} }。为什么是这样？当我们使用1和/或let时会得到相同的结果。

如果你们能解释的话，那太好了，这样我就可以改善我的基础知识。下面是我的代码：

const

更新1：

在第一种情况下，var x = 3; var foo = { x: 2, baz: { x: 1, bar: function() { console.log("this--->", this); return this.x; } } } var go = foo.baz.bar; alert(go()); alert(foo.baz.bar());被认为是一个闭包，它可以访问外部变量并显示bar：

3

Answer 1

当您将foo.baz.bar分配给var go时，分配go后仅保留对内部函数的引用。如果然后从外部范围调用它，则x = 3。实际上，函数中的this取决于调用该函数的范围。

在第二种情况下，当您调用bar()时，它属于从内部调用的对象的范围（即foo.baz），因此这一次函数bar（）中的this引用了baz，给予等等x = 1。

有关范围和JavaScript here中的this的更多信息

Answer 2

'this'关键字表示两个函数调用的两个不同对象。您可以通过添加“ console.log（this）;”来看到它在return语句之前。尝试改用箭头功能！

Answer 3

在这里您可以阅读Function.prototype.bind。此方法应该可以帮助您解决问题。

检查下面的代码示例：

var x = 3;

const foo = {
  x: 2,
  baz: {
    x: 1,
    bar: function() {
      return this.x;
    }
  }
}

//You're assigning a function definition to a variable, but this will not maintain scope:
const fn = foo.baz.bar;

//When called like this, bar() can be thought of as a method of foo.baz
console.log(foo.baz.bar()); //so we expect x = 1;

//You must properly bind your function reference to the desired "this" object:
const globalBound = fn; //which would be equivalent of: fn.bind(this);
const fooBound = fn.bind(foo);
const bazBound = fn.bind(foo.baz);

console.log(globalBound()); //x = 3
console.log(fooBound());    //x = 2
console.log(bazBound());    //x = 1

x = 'Now globalBound() will return a string';
foo.x = 'and so will fooBound(), but bazBound() will remain unchanged';

console.log(globalBound());
console.log(fooBound());
console.log(bazBound());

我建议您将var x = 3更改为let x = 3并查看结果。

函数在2个单独的警报中返回不同的值

3 个答案: