I'm working on a JavaScript user script to assist my team in making assembling support tickets on a web interface more efficient. In doing so, I'm finding myself making a lot of calls to DOM API to gather data, e.g., with event listeners and user-triggered calls.

In an attempt to make my script more concise, I have made a few "alias" functions, such as below.

I am wondering if doing something like this would make the code more difficult to maintain, in the case of some other person (or myself in 6 months) having to add to or change the code later on, or if it would be beneficial, in cutting out unneeded repetition of code like document.getElementById("foo").addEventListener("change", doBar).


While this may be somewhat opinion-based, I want to inquire: Is aliasing [well-known, standard] repetitive function calls likely to be an obstacle to keeping the code clear and relatively easy to maintain?

For a bit more background, this will eventually be a template helper to automate repetitive tasks in the browser and assist someone who is assembling an IT ticket over the phone or email.

Alias function to shorten `document.getElementById` calls 
const getElemById = function(elemId) {
    return document.getElementById(elemId);

Alias function to shorten `addEventListener("change", refreshCallerValues)` calls 
const addRefreshListener = function(elemId) {
    getElemById(elemId).addEventListener("change", refreshCallerValues);
  • What is refreshCallerValues? Is that supposed to be a parameter to addRefreshListerner? Or is it a separate function declared elsewhere? Mar 4, 2018 at 11:49
  • That's a separate function which updates certain values.
    – Phrancis
    Mar 4, 2018 at 16:20

1 Answer 1


Abstractions don't just have a value – simpler code –, but also a cost: more levels of abstraction make it more difficult to figure out what is going on. So there needs a balance between the value and the cost of an abstraction.

Abstractions tend to be more valuable when they aren't just an alias for some other operations (that's a terribly leaky abstraction), but when they have some independent meaning in your problem domain.

Aliasing a well-known, standard function generally won't provide much meaning of its own. If it doesn't make the code significantly easier, it's not worth it. Just saving you from a document. before the getElementByID() isn't really very much. So it may be unwise to obscure this from a casual reader who isn't familiar with your getElemByID() shortcut (aka. you in a few months).

Your other example addRefreshListener() is better because we abstract over multiple arguments. But much more importantly this function has an independent meaning in your problem domain (DOM manipulation). It satisfies some goal, without the caller having to know how it is satisfied. I would therefore strike this implementation detail from your docs.

  • Thank you, this seems like a very good way to think about it, much appreciated =)
    – Phrancis
    Mar 4, 2018 at 0:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.