javascript - 从静态方法调用 ES5 类方法

Question

我想从一个没有实例调用的静态函数中调用一个内部函数，如下所示:

Foo.Bar = function (options) {

    Autodesk.Viewing.Extension.call(this, options);

    ...

    this.innerFunc = function innerFunc(){
      ...
    }
};

Foo.Bar.prototype.constructor =
    Foo.Bar;

Foo.Bar.SomeStaticFunc = function () {
    innerFunc();
}

使用:Foo.Bar.SomeStaticFunc();。

但我得到 SomeStaticFunc is not a function。

例子here为类使用变量，例如 var Foo.Bar = function (options) {... 但这与像这样创建类的实例并调用内部函数不一样吗？

let x= new Foo.Bar(options);
x.innerFunc();

还有其他方法吗？

PS:我知道 ES6 类，但我暂时不想将此类迁移到 ES6，因为它并不完全直接。

Answer 1

嗯……看来你还不知道 JavaScript 内部是如何工作的，所以这里简单回顾一下。 :)

• JavaScript 是一种面向对象的语言。对象字面量是对象，数组是对象，函数是对象等等。

• JavaScript 不是一种基于类的语言。你可以说:“嘿，我见过 ES6 中的 class 和 extends 关键字!”。是的，但这只是语法糖。 JavaScript 不像 Java 那样基于类，它基于原型(prototype)。

使用 ES5 语法，有两种方法可以创建所谓的“类”:

• 一个对象字面量
• 构造函数

当你使用对象字面量时，你的类看起来像这样:

var myClass = {
  myAttribute: "foo",
  myMethod: function () {
    return "bar";
  }
};

当你使用构造函数时，你的类看起来像这样:

function MyClass() {
  this.myAttribute = "foo";
  this.myMethod = function () {
    return "bar";
  };
}

这两种方法之间当然存在差异。使用对象文字，你有一种单例，其中属性在某种程度上都是静态的。使用构造函数，您可以生成实例，其属性将由 this 关键字引入。示例:

var myInstance = new MyClass();
console.log(myInstance);

此实例将在其自己的属性 中包含“myAttribute”和“myMethod”。这意味着这些属性与实例相关联。如果你想调用这个方法，你必须这样做:

myInstance.myMethod();

到目前为止一切顺利...但是我们之前所做的有一些问题。 this.myMethod 将为 MyClass 的每个实例一次又一次地创建，并且它始终相同。处理这个问题的更好方法是将它放在 prototype 中，以便它可以被所有实例共享:

function MyClass() {
  this.myAttribute = "foo";
}

MyClass.prototype.myMethod = function () {
  return "bar";
};

这好多了，但是 myMethod 仍然绑定(bind)到 MyClass 实例...

现在我想创建一个静态方法。根据定义，我们的静态方法将绑定(bind)到类，而不是它的实例:

MyClass.myStaticMethod = function () {
  return "baz";
};

不错。在这里，为了实验，我想做这样的事情:

MyClass.myStaticMethod = function () {
  myMethod();
};

这是行不通的。为什么？事实上，myMethod 既不存在于给定范围内，也不存在于外部范围内。 myMethod 已在另一个函数(构造函数)内声明并且未返回，因此从外部看不到。而且，这个函数已经放在了MyClass的原型(prototype)中。这意味着它不是全局可用的，而是仅在 MyClass 的实例上可用。仔细想想，这是很合乎逻辑的。例如，当你想调用数组方法(Array.prototype 中的方法)时，这样做是没有意义的:

push('test');
reverse();
includes('a');

您必须在数组(Array 的实例)上调用这些方法。

[].push('test');
['foo', 'bar', 'baz'].reverse();
['a', 'b'].includes('a');