Fix Common ESLint Warnings in Existing JavaScript Code (Part 1)

ESLint is the most popular JavaScript linting tool; it enforces coding style and catches potential errors. While some rules can be auto‑fixed, others require manual intervention, and this series explains how to address those manually.

eqeqeq

This rule requires replacing loose equality with strict equality.

Using == triggers implicit type conversion (e.g., 2 == '2' evaluates to true), which can cause subtle bugs. A common pattern is:

if (response.errorCode == 0) {
    // do something...
}

Because the coercion rules are complex (e.g., null == 0 is false), many teams forbid == and !=. The article recommends explicit type conversion before comparison, such as:

if (parseInt(response.errorCode, 10) === 0) {
    // do something...
}

or

if (String(response.errorCode) === '0') {
    // do something...
}

no-bitwise

This rule disables all bitwise operators.

Bitwise operators are rarely needed in typical web development; when they appear, they are often accidental or used for clever tricks, such as an IIFE written with the tilde operator:

~function () {
    // do something...
}();

Although terse, this style harms readability. The article suggests using the conventional IIFE syntax, either with a trailing semicolon:

(function () {
    // do something...
})();

or, when omitting semicolons, using the void operator:

void function () {
    // do something...
}();

no-implicit-coercion

This rule forbids implicit type coercion, including the use of the ~ operator for index checks.

A common “trick” uses ~str.indexOf(substr) to test whether a substring exists:

if (~str.indexOf(substr)) {
    // do something...
}

This pattern is hard to read and also triggers no-implicit-coercion (and no-bitwise) warnings. Clear alternatives are recommended, such as:

if (str.indexOf(substr) !== -1) {
    // do something...
}

or using modern ES6+ methods:

if (str.includes(substr)) {
    // do something...
}

Third‑party libraries provide similar helpers, e.g., jQuery’s $.inArray, Lodash’s _.includes, or Gearbox’s gearbox.str.includes:

// jQuery / Zepto
if ($.inArray(member, array)) {
    // do something...
}
// Lodash / Underscore
if (_.includes(array, member)) {
    // do something...
}
// Gearbox
if (gearbox.str.includes(str, substr)) {
    // do something...
}

These alternatives are far more readable than the mysterious tilde trick.

To be continued…