在 JS 对象中绑定“this”答案

【问题标题】：Binding "this" in JS object在 JS 对象中绑定“this”
【发布时间】：2020-07-02 12:19:48
【问题描述】：

我正在尝试对我最喜欢的一款网页游戏的 JS 代码进行“逆向工程”。我不是 web 开发的初学者，但 JS 不是我的强项（英语也不是，对不起），我更像是后端程序员。

代码中充满了这样的“对象”：

var Foo = {
  prop: {...},
  prop2: [...],
  bar: function(val) {
    this.prop.k = val;
    Foo.doSomething();
  },
  doSomething: function() {
    var my = Foo.prop;
    ...
    return this.prop2;
  },
};

...somehere on the page...
<input type="text" name="in" value="Pretty text" onclick="Foo.bar(this.value)" />

据我了解，它是由匿名类制成的对象 Foo，使其有些静态。但是我很困惑使用 this 和 Foo 作为对象名称。在我看来，一个或另一个随机使用。它与属性或功能无关，两者都可以使用。即使在相同的方法中使用两者。我认为，在这种情况下 this 和 Foo 相同。当我尝试制作这样的对象并将它们转储到控制台时，this 和 Foo 返回相同。

谁能给我解释一下，请问哪里有区别？或者它可能只是在翻译中丢失了一些东西，因为原始代码被缩小了？

谢谢。

【问题讨论】：

标签： javascript oop static this

【解决方案1】：

var x = {
  something: 'something',
  log: function() {
    return this.something
  },
  log2: function() {
    return x.something
  }
}

如果你运行上面的代码，你可以看到 log() 方法和 log2() 方法都返回相同的结果。得出的结论是this 和x 在这种情况下指的是同一个对象。如果我没记错的话，你的情况可能是一样的。

【讨论】：

真的说不出来。 Idk 谁会使用对象名称而不是 this。但是，现在你至少可以继续你正在做的事情了 :) 如果有帮助，请不要忘记勾选答案。

【解决方案2】：

在某些情况下，this 和对象的名称不是指同一个对象。

let Foo = {
    prop: 'a',
    log() {
      console.log(
        'this.prop is', this.prop, ', Foo.prop is', Foo.prop
      );
    }
  },
  Bar = {
    prop: 'b',
    mock: Foo.log
  },
  Baz = Object.create(Foo, {
    prop: {
      value: 'c'
    }
  });

Foo.log();
Bar.mock();
Baz.log();

// You can also bind the this reference when calling
Bar.mock.call(Baz);
Baz.log.apply(Bar);

在Baz 情况下，原始Foo.prop 保留其值，因为在实例中设置同名属性使其成为该实例自己的属性，原型中的属性值不会被覆盖。

所有这些方案都可以帮助您重用已编写的代码，从而减少代码。仅在阅读简短示例时，不知道这是否是您最喜欢的网页游戏中的目标。使用给定的代码，没有区别。

【讨论】：