Есть следующий, очень простой, на первый взгляд, код:
"use strict";
let TaskModule = (function () {
return {
msg: function () {
return "Hello World!";
},
showMsg: function () {
alert(this.msg());
},
doTask: function () {
this.showMsg(); //Строка №11
}
}
})();
(function() {
let addButtonElement = document.getElementById("add-task-btn");
addButtonElement.addEventListener("click", TaskModule.doTask, true);
})();
Но, когда происходит событие нажатия кнопки, в консоли разработчика выводится следующее сообщение:
Uncaught TypeError: this.showMsg is not a function
at HTMLInputElement.doTask (main.js:11)
Однако, если мы вызываем функцию модуля через функцию "обертку" и именно имя функции "враппера" передаем в обработчик события, то все работает как надо:
"use strict";
let TaskModule = (function () {
return {
msg: function () {
return "Hello World!";
},
showMsg: function () {
alert(this.msg());
},
doTask: function () {
this.showMsg();
}
}
})();
(function() {
let addButtonElement = document.getElementById("add-task-btn");
let doTaskFn = function() {
TaskModule.doTask();
}
addButtonElement.addEventListener("click", doTaskFn, true);
})();
Вопрос: почему и что нужно почитать, чтобы понять смысл?