Why do TSLint and JSLint report empty blocks?

TypescriptJslintTslint

Typescript Problem Overview


From time to time, I get TSLint errors "block is empty". This happens e.g. when I pass a no-op callback to a function:

doSomething(() => {});

From what I read, JSLint apparently does the same, but I didn't verify that.

I find these usages completely valid, so I tried to find a reason why empty blocks are considered bad at all. But the only thing I'm able to find (e.g. in this answer) are instructions to add a return; to avoid the error. This is not what I want to do in every empty callback.

Why does TSLint report above empty block as problem? Is there any reason why I shouldn't disable the check?

Typescript Solutions


Solution 1 - Typescript

> Why does TSLint report above empty block as problem

To prevent mistakes. Perhaps the function was forgotten to be filled out. Recommend () => undefined as a noop.

More

If you want to disable it simply add "no-empty": false, to your tslint.json (globally disable) or disable it inline using a /* tslint:disable:no-empty */ comment.

Solution 2 - Typescript

If you feel you dont want to use callback during certain scenarios you can modify the code

from

doSomething(() => {});

to

doSomething(() => undefined);

Substituting () => {} to this implies you dont care about this callback. and explicit typecasting will avoid implications.

Good luck.

Solution 3 - Typescript

As with all checks, you have the ultimate judgement on whether they are helping you or not. You can switch off this TSLint check using one of the following options.

Disable the rule in tslint.json

//...
"no-empty": false,
//...

Disable the rule in the file:

/* tslint:disable:no-empty */

You can always switch it back on again if sometime in the future you find an empty block that has caused you a problem.

Solution 4 - Typescript

A way to suppress the error and designate that empty block was intentionally is to disable the rule temporary:

// tslint:disable-next-line:no-empty
doSomething(() => {});

Or make it non-empty:

doSomething(() => {/**/});

Solution 5 - Typescript

tslint v5.10.0 introduced "allow-empty-functions" option to "no-empty" just for this case;
also "allow-empty-catch" (introduced in v5.5.0) may be useful:

"no-empty": [true, "allow-empty-functions", "allow-empty-catch"]

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestiontheDmiView Question on Stackoverflow
Solution 1 - TypescriptbasaratView Answer on Stackoverflow
Solution 2 - TypescriptspacedevView Answer on Stackoverflow
Solution 3 - TypescriptFentonView Answer on Stackoverflow
Solution 4 - TypescriptEstus FlaskView Answer on Stackoverflow
Solution 5 - TypescriptTomas VargaView Answer on Stackoverflow