"Uncaught TypeError: This._isDateType Is Not A Function" Within Arrow Function

I've got every time a type error that a function definition could not be found. The code looks as follow: return BaseController.extend('ch.micarna.weightprotocol.controller.Calenda

Solution 1:

Replace the arrow function

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

with the normal function expression:

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

By this, the _getLastDayOfMonth can freely access other methods within the Controller instance.

Why it didn't work with arrow function

• First of all, it's important to know that arrow functions bind their context lexically.

  An arrow function expression has a shorter syntax than a function expression and does not have its own this.

  For example, it's not possible to call .bind on arrow functions. They get their this from the closure when evaluated.

• Since this was not an instance of the Controller but rather the window object when BaseController.extend was called, calling this._isDateType inside the arrow function was equivalent to window._isDateType.

Solution 2:

The element this can be used inside a function to get the temporary value of the element. To use the _isDateType method you should create an attribute inside the method and fill it with the 'this' value.

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]";
}