Fix for “Cannot read property apply of undefined” using Reflux

January 22, 2015

At Vaki we are in the process of creating a new site and are using React and Reflux (a library implementation of Flux among other things. I had been struggling with a cryptic JavaScript error originating from Reflux for some hours:

Uncaught TypeError: Cannot read property 'apply' of undefined

I guess this error message can arise in many situations but I just wanted to document what it was in my case. Turns out it was a pretty silly mistake. I had a data store looking a bit like this:

var Reflux = require("reflux");
var LeetActions = require("LeetActions.js");

var LeetStore = Reflux.createStore({
   init: function() {
       // Listen to myEvent the wrong way
       this.listenTo(LeetActions.myEvent, this.onMyEvent());
   },

   onMyEvent: function() {
       console.log("Super important event just happened!");
   }
});

This error would occur every time myEvent triggered. The fault is that when hooking up the callback function onMyEvent I accidentally called the function by including the two parentheses (); this.onMyEvent(). Instead I should of course have passed the function itself as a parameter like so:

// Listen to myEvent the correct way
this.listenTo(LeetActions.myEvent, this.onMyEvent);

History & source