箭头函数中的“未捕获的TypeError：this._isDateType不是函数”

Question

我每次都遇到类型错误，无法找到函数定义。代码如下：

return BaseController.extend("ch.micarna.weightprotocol.controller.Calendar", {
  onInit: function () {
    console.log(this._isDateType(new Date()));
    let oHbox = this.byId("calendar-container");
    let oTodayDate = new Date();
    let oEndDate = this._getLastDayOfMonth(oTodayDate);
  },

  _getLastDayOfMonth: (oBegin) => {
    if (this._isDateType(oBegin)) {
      throw new TypeError("The given parameter is not type of date.");
    }
    return new Date(oBegin.getFullYear(), oBegin.getMonth() + 1, 0);
  },

  _isDateType: (oDate) => {
    return Object.prototype.toString.call(oDate) === "[object Date]";
  },

});

问题是在_isDateType函数内调用时无法找到的_getLastDayOfMonth函数。 我设定了断点：

正如您所看到的，该函数未定义，我不知道为什么。

在onInit函数的开头，我调用了_isDateType函数：

console.log(this._isDateType(new Date()));

并按预期提供结果。

我做错了什么？

Answer 1

替换箭头功能

_getLastDayOfMonth: (oBegin) => {
  // this....
},

正常function expression：

_getLastDayOfMonth: function(oBegin) {
  // this...
},

这样，_getLastDayOfMonth可以自由访问Controller实例中的其他方法。

为什么它没有使用箭头功能

• 首先，知道箭头函数词法绑定它们的上下文非常重要。

    

  箭头函数表达式的语法短于函数表达式，不具有自己的this。 ^[source]

  例如，无法在箭头功能上调用.bind。在评估时，他们从关闭中获得this。

• 由于this 不是Controller的实例，而是调用window时的BaseController.extend对象，因此在箭头内调用this._isDateType功能相当于window._isDateType。

Answer 2

您不能做的是从对象文字语法中的其他地方引用“正在构建”对象的属性。如果您想这样做，您需要一个或多个单独的赋值语句。

例如，按如下方式移动代码：

var temp = BaseController.extend("ch.micarna.weightprotocol.controller.Calendar", {

onInit: function () {

  console.log(this._isDateType(new Date()));

  let oHbox = this.byId("calendar-container");

  let oTodayDate = new Date();
  let oEndDate = this._getLastDayOfMonth(oTodayDate);

}

});

temp._isDateType = (oDate) => {
  return Object.prototype.toString.call(oDate) === "[object Date]";
};

temp._getLastDayOfMonth = (oBegin) => {

  if (this._isDateType(oBegin)) {
    throw new TypeError("The given parameter is not type of date.");
  }
  return new Date(oBegin.getFullYear(), oBegin.getMonth() + 1, 0);
}

return temp;

这个想法是将功能分配分成几个陈述;

Answer 3

可以在函数内部使用此元素来获取元素的临时值。要使用_isDateType方法，您应该在方法内创建一个属性，并使用'this'值填充它。

return BaseController.extend("ch.micarna.weightprotocol.controller.Calendar", {
var temp= null;
onInit: function () {
  temp = this;
  console.log(temp._isDateType(new Date()));

  let oHbox = temp.byId("calendar-container");

  let oTodayDate = new Date();
  let oEndDate = temp._getLastDayOfMonth(oTodayDate);

},

_getLastDayOfMonth: (oBegin) => {

  if (temp._isDateType(oBegin)) {
    throw new TypeError("The given parameter is not type of date.");
  }
  return new Date(oBegin.getFullYear(), oBegin.getMonth() + 1, 0);
},

_isDateType: (oDate) => {
  return Object.prototype.toString.call(oDate) === "[object Date]";
}