You can find a lot of questions on programming Q&A sites by people wondering whether it's worth splitting off a single line of code into a new function.

Here are some reasons that might cause you to hesitate:

they make the overall code longer

they slow reading the code down as your eyes need to skip around

extra function calls could slow down the application

This article explains why 95% of the time splitting the code off into new function is a good idea.

Showing meaning through function names

You've probably seen code like this:

if (mealItems.indexOf("cake") !== -1) { getPlate(); }

But this is more readable:

if (listContains(mealItems, "cake")) { getPlate(); } function listContains (list, item) { return list.indexOf(item) !== -1; }

The indexOf function provides a lot more functionality than is necessary to check whether a member exists. Because of that -1 is used as a code number for "not found".

The indexOf function provides a lot more functionality than is necessary to check whether a member exists.

Our listContains function on the other hand provides less functionality, but the name clearly communicates what information is returned.

As checking whether a list contains an item is a very common task listContains can also be reused in other places across the code base. (Most JavaScript libraries already have a helper function that you can use for this, for example, _.contains in Underscore.)

But even when that isn't the case, splitting off the code into a new function makes it easier to understand. Look at this single-line function, which gives a meaningful name to some poorly named third-party function:

function setArrowDirectionToDown () { CrazyLibrary.a("down"); }

Calling a doesn't explain what you are doing, calling setArrowDirection does. Other developers can now understand the code without having to leave their editor to read the CrazyLibrary docs.

When compared to an explanatory comment above the incomprehensible line this has two advantages: it reduces the amount of code in the calling function and isn't less susceptible to comment rot.

Preparing for future changes

Look at this function. All it does is return a string.

function getShape () { return "circle"; }

If the function will always stay that simple it would be best to just place the string in the calling function.

But what if you plan on adding logic in the future that picks a shape at random? Then having a separate function now makes it easier for the next developer to do their work without restructuring the code.

When a one-line function reduces readability

There's one case where you should decide against splitting a line off into a separate single line function: when the code already clearly explains what it does.

function setArrowDirectionToDown() { SaneLibrary.arrowDirection = "down"; }

Here the code inside the one-line function already explains what it does, so you don't need the function name to provide additional understanding. Only if you know you will stop using SaneLibrary in the future it would be worth considering an additional function.

Is making extra function calls slow?

No, it's not.

First of all calling a function isn't that expensive computationally. Second, the JavaScript engine might well optimize the code internally so that the extra function call isn't made anyway.

I've never encountered a case where a large number of function calls has been slowing code down noticeably. Usually, it's what's happening inside the function - especially DOM manipulation - that causes performance problems.