Javascript - 从另一个静态方法访问静态方法抛出 ReferenceError

Question

我定义了一个辅助类来创建一些对象。由于对象 A 包含 B，我试图从 createA 调用 createB，但我收到“Uncaught ReferenceError: createB is not defined”。JS 不是我的主要语言，所以如果有明显的地方请原谅我；)

这是我的代码:

define([
  "model/A",
  "model/B",
  "model/C"
], function (A, B, C) {
  return {
    addTo: function (params, key, target, source) {
      if (params[key] !== undefined && params[key] !== null) {
        target.set(key, params[key], source);
      }
    },
    createA: function (params, source) {
      var result = new A();

      ...
      bDefs.forEach(function(bDef) {
        result.get("bs").push(this.createB(params,source));
      });
      return result;
    },
    createB: function (params, source) {

      var result = new B();
      ...

      result.get("cs").push(createC(params,source));
      return result;
    },
    createMediaType: function (params, source) {

      var result = new C();
      ...

      return result;
    }
  };
});

编辑:再次阅读问题我注意到我遗漏了一些可能导致问题的重要内容:我从 forEach 中调用 createB()。我想匿名函数对类的其余部分没有可见性。如何将对 this 的引用传递给 forEach？

Answer 1

这一行

result.get("bs").push(createB(params,source));

期望将有一个名为createB 的范围内标识符。你的代码中没有。对象初始值设定项中的属性键不会成为独立的标识符(谢天谢地)。

假设 createA 将通过 this 调用，引用您使用初始化程序创建的对象，您可以使用 this.createB相反。但它需要关于 this 的假设，这需要在使用您的对象的代码中强制执行。我在下面给你一个替代方案。

I'm calling createB() from within a forEach. I suppose that anonymous function does not have visibility of the rest of the class.

是的，确实如此。 (那不是一个类。)

How can I pass a reference to this to the forEach?

forEach 的第二个参数是在回调期间用作 this 的值，因此:

bDefs.forEach(function(bDef) {
    result.get("bs").push(this.createB(params,source));
}, this);
// ^^^^

或者您可以使用 Function#bind，但我不会在这里。

如果您使用的是 ES2015(也称为“ES6”)，则可以使用箭头函数，因为箭头函数关闭了创建它们的上下文的 this 值:

// Requires ES2015 ("ES6")
bDefs.forEach(bDef => {
    result.get("bs").push(this.createB(params,source));
});

---

您有第二个选项，它不依赖调用代码来调用正确的 this 值，也不需要您在 forEach 中保留该值>:您可以在私有(private)范围内使这些函数成为独立的标识符，并将它们作为对象的属性返回:

define([
  "model/A",
  "model/B",
  "model/C"
], function (A, B, C) {
  // Note how each of these is a function declaration; that defines
  // their names as in-scope identifiers within this anonymous function
  // and the functions created within it (which close over the context of
  // the call to this anonymous function where these are created).
  function addTo(params, key, target, source) {
    if (params[key] !== undefined && params[key] !== null) {
      target.set(key, params[key], source);
    }
  }

  function createA(params, source) {
    var result = new A();

    ...
    result.get("bs").push(createB(params,source));

    return result;
  }

  function createB(params, source) {

    var result = new B();
    ...

    result.get("cs").push(createC(params,source));
    return result;
  }

  function createMediaType(params, source) {

    var result = new C();
    ...

    return result;
  }

  // Now we return the object
  return {
      addTo: addTo,
      createA: createA,
      createB: createB,
      createMediaType: createMediaType
  };
});

---

旁注:在 ES2015(又名“ES6”)中，末尾的对象初始化器可以更简洁一些:

// Requires ES2015 (aka "ES6")
return {
    addTo,
    createA,
    createB,
    createMediaType
};