javascriptのコールバック関数でローカル変数が未定義になる

Question

JavaScriptを書き込もうとしているJavaプログラマーは、コールバックが呼び出されたときのスコープの変化を把握しているようです。

以下のbot.sendmessageは実行に失敗します。エラーログは、私はテームが正しいことを言う必要がある "undefined.bot.sendMessage（フォームID、RESP）"

"use strict"; 
 

 
function Handlers() { 
 
    this.bot = undefined; 
 

 
    this.registerHandler = (bot)=>{ 
 
     this.bot = bot; 
 
     bot.on('message', this._messageCallback); 
 
     bot.on('inline_query', this._inlineCallback) 
 
    } 
 
} 
 

 
Handlers.prototype = { 
 

 
    _messageCallback: (msg) => { 
 
     console.log("New Outline Request from: chat=" + msg.chat.id + ", uid=" + msg.from.id); 
 
     
 
     var fromId = msg.from.id; 
 
     var resp = "Hello there"; 
 
     this.bot.sendMessage(fromId, resp); 
 
    }, 
 
    _inlineCallback: (msg) => { 
 
     console.log("New Inline Request from: uid=" + msg.from.id); 
 
     /* 
 
     TODO:: 
 
     check if user is in data base if not log new entry; 
 
     */ 
 
    } 
 
}; 
 

 
module.exports = Handlers;

Answer 1

まず言います。これは私自身がよく知らないArrow Functionsの問題です。 Arrow Functionsを使用せずに同じことを練習する別の方法を見たい場合は、以下のスニペットをご覧ください。

このコードは後でImmediately-Invoked Function Expression (IIFE)に変更されますが、それは私の個人的なプログラミングの習慣です。あなたの正確なユースケースはここではわかりません。

"use strict"; 
 

 
/** 
 
* I'm assuming you have this elsewhere? 
 
* If not I have added it to show how to do it 
 
*/ 
 
function bot(){ 
 
    /* ... */ 
 
} 
 

 
bot.prototype = { 
 
    sendMessage: function(formId,resp){ 
 
     console.log("Form: "+formId+" | Message: "+resp); 
 
    } 
 
}; 
 
/** 
 
* End of my addition 
 
*/ 
 

 
function Handlers() { 
 
    this.bot = new bot(); 
 
    
 
    /* ... */ 
 
} 
 

 
Handlers.prototype = { 
 

 
    _messageCallback: function(msg){ 
 
     /* ... */ 
 
     var fromId = "fakeid123"; 
 
     var resp = msg; 
 
     this.bot.sendMessage(fromId, resp); 
 
    }, 
 
    _inlineCallback: function(msg){ 
 
     /* ... */ 
 
    } 
 
}; 
 

 
var myModule= new Handlers(); 
 
myModule._messageCallback("Here is my test msg.");