CODEWITHSUNDEEP
javascriptdebuggingerror-handlingeslint
Daniel Barenboim
Daniel Barenboim

Reputation: 41

What's the difference between ESLint and the normal console errors?

I use the normal error logging in the console...
Following the call stack trace and all. Never had much of a problem.

A friend recommended ESLint. After looking at some screenshots, I don't see much of a difference between what ESLint does and normal error logging.

Could anyone please compare the two, perhaps giving pro's and con's.

Bonus Points: include some use-cases in which one would be better than the other.

Upvotes: 0

Views: 697

Answers (2)

Murtaza Hussain
Murtaza Hussain

Reputation: 4285

A linting tool helps me avoid silly mistakes when writing JavaScript. Despite my many years of experience, I still type variable names incorrectly, make syntax errors and forget to handle my errors properly. A good linting tool, or a linter, will tell me about this before I waste my time—or worse, my client’s time. A good linting tool can also help make sure a project adheres to a coding standard.

There are many linters available for JavaScript like JSLint, JSHint, JSCS and ESLint, Let’s take a look at at pros and cons of alternatives:

Pros

  • avoid silly mistakes when writing JavaScript
  • avoid making syntax errors
  • adheres to a coding standard
  • Comes configured and ready to go (if you agree with the rules it enforces)
  • Best ES6 support, and also the only tool to support JSX
  • Resolve error before compiling with good IDE plugin for linting etc..

Cons

  • You can’t add custom rules (not for all cases)
  • Difficult to know which rule is causing which error
  • Some configuration required
  • Slow, but not a hindrance

Examples:

  1. Strict type checking in conditions:

you will get lint error for no strict type checking in below code.

`a == b && foo == null`

with lint error you can resolve to this to avoid

`a === b && foo === null`
  1. variable not defined

you will get lint error for no variable declared in below code.

'foo' is assigned a value but never used. and 'bar' is not defined.

var foo = bar;

Upvotes: 1

ludovico
ludovico

Reputation: 2406

ESLint:

ESLint is a linter -a tool that analyzes your code and flags potential errors. This is very helpful to avoid common mistakes that are made while you're coding (using undefined variables, syntactic errors, etc).

Pros:

  • Helps preventing syntactic mistakes
  • Helps preventing common errors
  • Helps you adhere to coding conventions
  • ...

Cons:

  • Need to setup
  • It can get a bit annoying sometimes...


Browser Console:

On the other side, the console is a tool that you can find in all modern browsers. As opposed to a linter, in the console you'll find runtime errors -ie. errors occurred during the execution of your code.

ESLint vs Console:

You don't have to choose between one or the other. Both cover different needs and both can help you deliver better software.

If you're coding Front-End JavaScript, I'm sure you already use your browser console on a daily basis.

On top of that, you can choose to use a linter or not.

Upvotes: 1

Related Questions