Ember.js how does reopenClass work?

Question

I don't really get the function of ember.js' reopenClass. I thought it added extra code to the Object's prototype, so all instances of that Object would get the functionality that was added in a non static way. It does not do this however. It looks like it only adds code that can be statically executed. For instance. I have this code:

Logger = Ember.Object.extend({    log: function(thing) {       console.log(thing + ' wassup');      } });  var logger = Logger.create(); logger.log("1, yo")  logger.reopen({    log: function(name) {        console.log(name + 'ghurt')     } }); logger.log("2, yo")  Logger.reopenClass({    log: function(name) {        console.log(name + 'fresh')     } }); logger.log("3, yo") Logger.log("4, yo") 

It outputs this:

1, yo wassup 2, yoghurt 3, yoghurt 4, yofresh 

What I expected was this:

1, yo wassup 2, yoghurt 3, yofresh 4, undefined (I think) 

So my question is: What does reopenClass do and when do I use it?

Answer 1

In general, reopen adds methods and properties to instances whereas reopenClass adds methods and properties to classes.

The corresponding tests are ember-runtime/tests/system/object/reopen_test.js and packages/ember-runtime/tests/system/object/reopenClass_test.js.

I've updated your code and added some comments, see http://jsfiddle.net/pangratz666/yWKBF/:

Logger = Ember.Object.extend({     log: function(thing) {         console.log(thing + ' wassup');     } });  var logger1 = Logger.create(); var logger2 = Logger.create();  // instances of Logger have a 'wassup' method try { Logger.log("1, yo"); } catch (e) {} // Object (subclass of Ember.Object) has no method 'log' logger1.log("1, yo"); // 1, yo wassup logger2.log("1, yo"); // 1, yo wassup  console.log('----');  // overwrite log of concrete logger instance logger1 logger1.reopen({     log: function(name) {         console.log(name + ' ghurt');     } });  try { Logger.log("1, yo"); } catch (e) {} // Object (subclass of Ember.Object) has no method 'log' logger1.log("2, yo"); // 2, yo ghurt logger2.log("2, yo"); // 2, yo wassup  console.log('----');  // classes of Logger have a 'fresh' method Logger.reopenClass({     log: function(name) {         console.log(name + ' fresh');     } });  Logger.log("3, yo"); // 3, yo fresh logger1.log("3, yo"); // 3, yo ghurt logger2.log("3, yo"); // 3, yo wassup  console.log('----');  // new* instances of Logger have from now on a 'dawg' method // * this will likely change in the future so already existing instances will reopened too Logger.reopen({     log: function(name) {         console.log(name + ' dawg');     } });  Logger.log("4, yo"); // 4, yo fresh logger1.log("4, yo"); // 4, yo ghurt logger2.log("4, yo"); // 4, yo wassup Logger.create().log("4, yo"); // 4, yo dawg  console.log('----'); 

​