This is actually a perfect example for why classes are insufficient. You've forgotten the teardown logic. If the user navigates from & to this component often.

This is actually a perfect example for why classes are insufficient. You've forgotten the teardown logic. If the user navigates from & to this component often. You'll add more and more listeners. over time. The solution would be to store the teardown logic somewhere in a class field and then call it from a destructor. Now this unit of logic is in three different places of the class. If you need to integrate multiple units, they interleave and the class becomes convoluted. Also it's easy to forget about the teardown. Hooks can achieve this lifecycle awareness by default. They aren't the only solution though: Vues' refs and Sveltes' stores achieve similar results.