javascript - 何时使用 Object.prototype/JavaScript 实例方法

Question

JavaScript 将 Object.prototype 定义为一种为类对象定义方法或属性的方式。

使用 Object.prototype 时存在的一个大问题是 incorrect 行为，当通过回调调用方法时 this 将具有调用上下文。

function Foo() {}

Foo.prototype.resize() {
  console.log(this);
}

var foo = new Foo();
window.on('resize', foo.resize);

因此，要解决此限制，我们可以执行以下操作。

function Foo2() {
  function resize() {
    console.log(self);
  }

  var self = this;
  this.resize = resize;
}

var foo2 = new Foo2();
window.on('resize', foo2.resize);

鉴于上述情况，在示例 2 中始终定义类对象似乎更好。

因此，我们什么时候应该使用Object.prototype 工具？我的意思是，您无法先验地知道您的方法将如何被调用，而且您肯定希望在调用时有正确的 this 上下文引用。

支持上下文:我想到这个问题是因为您似乎正在使用 Object.prototype 创建实例方法。但是，如图所示，您不是。您只是在创建与其实例没有“真实”连接的方法。因此需要使用闭包来创建实例绑定(bind)方法。另外这个问题是看了this excellent explanation of this才想到的.

Answer 1

您的困惑来自这样一个事实，即您将 JavaScript 对象视为具有 OOP 语言中的方法。因此您认为它们应该具有固定的上下文，因为 OOP 语言中的方法通常使用“早期绑定(bind)”，因此它们被绑定(bind)到正确的上下文。在 JavaScript 中是不同的。这是一种“后期绑定(bind)”，当函数的上下文 - this - 在函数执行时确定。对我来说，将方法视为指向函数的简单对象属性是有益的，它确实可以在不同的上下文中执行。例如，我们可以有这样的东西:

function resize() {
  console.log(this);
}

resize.call(window);
resize.call(custom);

如果您愿意，当然可以使用 bind 实现“早期绑定(bind)”，例如:

   function O() {
      this.resize = function() {}.bind(this);
   }

   var o = new O();

但这限制了对象方法的可重用性。例如，这是不可能的:

Array.prototype.slice.call(arguments)

您可以阅读 here有关为什么即使在 ES6 中也没有绑定(bind)方法的一些建议。

原型(prototype)不是静态方法，它们的创建是为了实现内存高效代码重用。正如 JLRishe 指出的那样，原型(prototype)的最大优势是减少内存使用，因为您可以在原型(prototype)上定义一个函数实例，并且方便将其作为对象属性访问在他们的原型(prototype)链中有原型(prototype)。但原型(prototype)只是为了方便。下面是没有 prototype 的 resize 示例:

// here only one instance of `resize` function is created
function resize() {
  console.log(this);
}

var o1 = {
  resize: resize
}

var o2 = {
  resize: resize
}

You are simply creating methods that have no "real" connection to their instance.

正确，这里是一个带有“方法”的原型(prototype)示例，稍后将用于不同的上下文:

var prototype = {
   resize: function() {
     console.log(this);
   }
}

var o1 = {
  resize: resize
}

Object.setPrototypeOf(o1, prototype);

var o2 = {
  resize: resize
}

Object.setPrototypeOf(o2, prototype);

我认为 JavaScript 的构建理念是函数是一流的对象，而不是对象应该具有正确绑定(bind)上下文的方法。

静态方法通常作为函数构造函数的属性实现，如下所示:

function SomeObjectConstructor() {}
SomeObjectConstructor.someStaticMethod = function() {}