Today I Learned - Rocky Kev

TIL ways to organize eventListeners

POSTED ON:

TAGS: cleancode naming

Some code spaghetti I made recently was creating a lot of eventListeners for multiple buttons, and then forgot what they all connected to.

How do I write cleaner code to avoid that?

IDEA 1 - Prefixing

To help prevent naming collisions, it’s a good idea to prefix custom events with your library or project name.

// Namespaced to the Calculator library
emit('calculator-add');

IDEA 2 - Colon

The one I really like is this:

Another convention is to put a colon (:) between the library name and the event type. I’m personally quite fond of this approach, as I think it makes events more readable.

I call this style prefix-kebab.

// prefix-kebab naming
emit('calculator:add');

Via Custom event naming conventions

Related TILs

Tagged: cleancode

TIL not obsessively trying to be DRY

Quite often, DRY is applied to any duplication, rather than specifically to the duplication of business rules and knowledge. This is often made worse by automated code analysis tools, which will often highlight any duplication as a code smell.

TIL ways to organize eventListeners

Some code spaghetti I made recently was creating a lot of eventListeners for multiple buttons, and then forgot what they all connected to.

TIL Very Efficient Code

This is a great solution. Easy to understand. Executes really fast. No real-time string concatenation. No over-engineering. String appearance is easily customized.