this.method не является функцией, привязка не работает

Question

Вероятно, это действительно простая проблема, но я не могу найти, что здесь происходит, это мой случай:

У меня есть метод класса ProjectBox, который запускается при перетаскивании. Этот метод создает модальное окно и присоединяет прослушиватель событий к кнопке внутри модального окна.

Когда эта кнопка нажата, он отправляет на сервер некоторые данные и выполняет метод класса после выполнения обратного вызова.

У меня проблема с этим вызовом метода класса, я прикрепляю код:

ProjectBox.prototype.handleDrop = function (e) {

// some code to create the modal

// function to attach to the event of button clicked ->
var choose_project_role_event =  ()=> {

        socket.emit( 'addProjectMember', {project_member: dragged_user, project_id: e.target.parentElement.parentElement.id, role: select_typeof_member.value  }, ( reply )=> {

            if ( reply.response ) {
                this.printMember( reply.member_data )
            }
        })
    }
    choose_role_send.addEventListener( 'click', choose_project_role_event)
}

ProjectBox.prototype.printMember = function ( params ) {

app.js:1145 Uncaught TypeError: this.printMember is not a function

Я читал, что стрелочные функции не должны использовать .bind (это) для решения проблем с областью видимости, но я даже изменил код, сделав его анонимными функциями и выполняя привязку, но у меня все еще та же проблема.

Что здесь происходит? Я немного потерял в этом вопросе.

Answer 1

Это проблема области действия функции. Область действия стрелочной функции примет область действия внешней функции, в данном случае это будет window, потому что choose_project_role_event определено в глобальной области, а не внутри области объекта / функции.

Если хотите choose_project_role_event, чтобы иметь доступ к членам экземпляра, в данном случае printMember, вы должны определить функцию внутри прототипа класса ProjectBox.