Lately I’ve been working with Ember components, which are really pretty cool. For anyone who doesn’t know, in Ember components let you encapsulate layout and functionality neatly together so you can reuse things all over your app without making a huge mess.

Ember components have a lifecycle you should know about and a set of lifecycle hooks you can call. Those hooks are really handy, they let you do all kinds of things at different points in the component’s lifecycle. Be warned, though: you MUST call


at the beginning of your lifecycle hook or your component will break in deeply weird ways. When you implement a lifecycle hook in your code, you’re actually overriding a method in the base Ember component. If you don’t call this.super(), the original function doesn’t get called and shockingly enough, it does a bunch of things that are necessary to make your component work right :)

Because Ember is open source, you can go have a look at what the base lifecycle functions do. Here’s the init function, which calls this.super() itself before it does the rest of its setup. Reading the code yourself totally isn’t necessary, but it’s interesting and might help you remember why it’s so important to call this.super().