DEV Community

Adam Crockett 🌀
Adam Crockett 🌀

Posted on

Acceptable Magic 🧙

I wrote a class which when instantiated, resulted in a callable object with a valueOf string.

The result was a very slick and intuitive interface for a library with 0 boilerplate.

The thing that bugs me is that I'm totally fine with this in the context of it's usage, that the CSS equivalent of what I was making had similar ergonomics. Is it okay to use magic JavaScript that would otherwise be strange if your mirroring an existing interface from another language?

What is the line between complexity and innovation?

Top comments (1)

Collapse
 
ahferroin7 profile image
Austin S. Hemmelgarn

IMO, it's dependent on whether or not you can rationalize the design choice beyond the trivial arguments of aesthetics or style. If so, it then just becomes a regular cost-benefit analysis to determine whether to use it or not.

A simple example from some of my own JS code would be the using a combination of IIFE syntax and the ES6 class expression syntax to construct objects with methods bound to them, along the lines of:

let foo = new (class {
    ...
})();

As insane as this sounds (and looks at first glance), it actually works remarkably intuitively once you understand it (an ES6 class expression evaluates to the constructor function for the class it defines, so they can be used anywhere you would use a function expression, and thus can be combined with an IIFE (and the new keyword) to define and create a single instance of an anonymous class as a single expression).

In the cases where I used this, it actually made the code both more compact and significantly more readable, both of which were big enough benefits compared to the downside of the slightly confusing and unexpected syntax for me to decide it was worth doing things this way.