Showing 2,141 of 2,141 total issues
Unexpected var, use let or const instead. Open
var _atMaxSize = false;
- Read upRead up
- Exclude checks
require let
or const
instead of var
(no-var)
ECMAScript 6 allows programmers to create variables with block scope instead of function scope using the let
and const
keywords. Block scope is common in many other programming languages and helps programmers avoid mistakes
such as:
var count = people.length;
var enoughFood = count > sandwiches.length;
if (enoughFood) {
var count = sandwiches.length; // accidentally overriding the count variable
console.log("We have " + count + " sandwiches for everyone. Plenty for all!");
}
// our count variable is no longer accurate
console.log("We have " + count + " people and " + sandwiches.length + " sandwiches!");
Rule Details
This rule is aimed at discouraging the use of var
and encouraging the use of const
or let
instead.
Examples
Examples of incorrect code for this rule:
/*eslint no-var: "error"*/
var x = "y";
var CONFIG = {};
Examples of correct code for this rule:
/*eslint no-var: "error"*/
/*eslint-env es6*/
let x = "y";
const CONFIG = {};
When Not To Use It
In addition to non-ES6 environments, existing JavaScript projects that are beginning to introduce ES6 into their
codebase may not want to apply this rule if the cost of migrating from var
to let
is too costly.
Source: http://eslint.org/docs/rules/
'MapDOM' was used before it was defined. Open
return new MapDOM(mapContainerSelector, mapCanvasSelector);
- Read upRead up
- Exclude checks
Disallow Early Use (no-use-before-define)
In JavaScript, prior to ES6, variable and function declarations are hoisted to the top of a scope, so it's possible to use identifiers before their formal declarations in code. This can be confusing and some believe it is best to always declare variables and functions before using them.
In ES6, block-level bindings (let
and const
) introduce a "temporal dead zone" where a ReferenceError
will be thrown with any attempt to access the variable before its declaration.
Rule Details
This rule will warn when it encounters a reference to an identifier that has not yet been declared.
Examples of incorrect code for this rule:
/*eslint no-use-before-define: "error"*/
/*eslint-env es6*/
alert(a);
var a = 10;
f();
function f() {}
function g() {
return b;
}
var b = 1;
// With blockBindings: true
{
alert(c);
let c = 1;
}
Examples of correct code for this rule:
/*eslint no-use-before-define: "error"*/
/*eslint-env es6*/
var a;
a = 10;
alert(a);
function f() {}
f(1);
var b = 1;
function g() {
return b;
}
// With blockBindings: true
{
let C;
c++;
}
Options
{
"no-use-before-define": ["error", { "functions": true, "classes": true }]
}
-
functions
(boolean
) - The flag which shows whether or not this rule checks function declarations. If this istrue
, this rule warns every reference to a function before the function declaration. Otherwise, ignores those references. Function declarations are hoisted, so it's safe. Default istrue
. -
classes
(boolean
) - The flag which shows whether or not this rule checks class declarations of upper scopes. If this istrue
, this rule warns every reference to a class before the class declaration. Otherwise, ignores those references if the declaration is in upper function scopes. Class declarations are not hoisted, so it might be danger. Default istrue
. -
variables
(boolean
) - This flag determines whether or not the rule checks variable declarations in upper scopes. If this istrue
, the rule warns every reference to a variable before the variable declaration. Otherwise, the rule ignores a reference if the declaration is in an upper scope, while still reporting the reference if it's in the same scope as the declaration. Default istrue
.
This rule accepts "nofunc"
string as an option.
"nofunc"
is the same as { "functions": false, "classes": true }
.
functions
Examples of correct code for the { "functions": false }
option:
/*eslint no-use-before-define: ["error", { "functions": false }]*/
f();
function f() {}
classes
Examples of incorrect code for the { "classes": false }
option:
/*eslint no-use-before-define: ["error", { "classes": false }]*/
/*eslint-env es6*/
new A();
class A {
}
Examples of correct code for the { "classes": false }
option:
/*eslint no-use-before-define: ["error", { "classes": false }]*/
/*eslint-env es6*/
function foo() {
return new A();
}
class A {
}
variables
Examples of incorrect code for the { "variables": false }
option:
/*eslint no-use-before-define: ["error", { "variables": false }]*/
console.log(foo);
var foo = 1;
Examples of correct code for the { "variables": false }
option:
/*eslint no-use-before-define: ["error", { "variables": false }]*/
function baz() {
console.log(foo);
}
var foo = 1;
Source: http://eslint.org/docs/rules/
Unexpected var, use let or const instead. Open
var LARGER_MAP_TEXT = "<i class='fa fa-minus-square'></i> Smaller map";
- Read upRead up
- Exclude checks
require let
or const
instead of var
(no-var)
ECMAScript 6 allows programmers to create variables with block scope instead of function scope using the let
and const
keywords. Block scope is common in many other programming languages and helps programmers avoid mistakes
such as:
var count = people.length;
var enoughFood = count > sandwiches.length;
if (enoughFood) {
var count = sandwiches.length; // accidentally overriding the count variable
console.log("We have " + count + " sandwiches for everyone. Plenty for all!");
}
// our count variable is no longer accurate
console.log("We have " + count + " people and " + sandwiches.length + " sandwiches!");
Rule Details
This rule is aimed at discouraging the use of var
and encouraging the use of const
or let
instead.
Examples
Examples of incorrect code for this rule:
/*eslint no-var: "error"*/
var x = "y";
var CONFIG = {};
Examples of correct code for this rule:
/*eslint no-var: "error"*/
/*eslint-env es6*/
let x = "y";
const CONFIG = {};
When Not To Use It
In addition to non-ES6 environments, existing JavaScript projects that are beginning to introduce ES6 into their
codebase may not want to apply this rule if the cost of migrating from var
to let
is too costly.
Source: http://eslint.org/docs/rules/
Unexpected dangling '_' in '_mapContainer'. Open
var _mapContainer = document.querySelector(mapContainerSelector);
- Read upRead up
- Exclude checks
disallow dangling underscores in identifiers (no-underscore-dangle)
As far as naming conventions for identifiers go, dangling underscores may be the most polarizing in JavaScript. Dangling underscores are underscores at either the beginning or end of an identifier, such as:
var _foo;
There is actually a long history of using dangling underscores to indicate "private" members of objects in JavaScript (though JavaScript doesn't have truly private members, this convention served as a warning). This began with SpiderMonkey adding nonstandard methods such as __defineGetter__()
. The intent with the underscores was to make it obvious that this method was special in some way. Since that time, using a single underscore prefix has become popular as a way to indicate "private" members of objects.
Whether or not you choose to allow dangling underscores in identifiers is purely a convention and has no effect on performance, readability, or complexity. It's purely a preference.
Rule Details
This rule disallows dangling underscores in identifiers.
Examples of incorrect code for this rule:
/*eslint no-underscore-dangle: "error"*/
var foo_;
var __proto__ = {};
foo._bar();
Examples of correct code for this rule:
/*eslint no-underscore-dangle: "error"*/
var _ = require('underscore');
var obj = _.contains(items, item);
obj.__proto__ = {};
var file = __filename;
Options
This rule has an object option:
-
"allow"
allows specified identifiers to have dangling underscores -
"allowAfterThis": false
(default) disallows dangling underscores in members of thethis
object -
"allowAfterSuper": false
(default) disallows dangling underscores in members of thesuper
object
allow
Examples of additional correct code for this rule with the { "allow": ["foo_", "_bar"] }
option:
/*eslint no-underscore-dangle: ["error", { "allow": ["foo_", "_bar"] }]*/
var foo_;
foo._bar();
allowAfterThis
Examples of correct code for this rule with the { "allowAfterThis": true }
option:
/*eslint no-underscore-dangle: ["error", { "allowAfterThis": true }]*/
var a = this.foo_;
this._bar();
allowAfterSuper
Examples of correct code for this rule with the { "allowAfterSuper": true }
option:
/*eslint no-underscore-dangle: ["error", { "allowAfterSuper": true }]*/
var a = super.foo_;
super._bar();
When Not To Use It
If you want to allow dangling underscores in identifiers, then you can safely turn this rule off. Source: http://eslint.org/docs/rules/
'_buttonElmClicked' was used before it was defined. Open
_buttonElm.addEventListener('click', _buttonElmClicked, false);
- Read upRead up
- Exclude checks
Disallow Early Use (no-use-before-define)
In JavaScript, prior to ES6, variable and function declarations are hoisted to the top of a scope, so it's possible to use identifiers before their formal declarations in code. This can be confusing and some believe it is best to always declare variables and functions before using them.
In ES6, block-level bindings (let
and const
) introduce a "temporal dead zone" where a ReferenceError
will be thrown with any attempt to access the variable before its declaration.
Rule Details
This rule will warn when it encounters a reference to an identifier that has not yet been declared.
Examples of incorrect code for this rule:
/*eslint no-use-before-define: "error"*/
/*eslint-env es6*/
alert(a);
var a = 10;
f();
function f() {}
function g() {
return b;
}
var b = 1;
// With blockBindings: true
{
alert(c);
let c = 1;
}
Examples of correct code for this rule:
/*eslint no-use-before-define: "error"*/
/*eslint-env es6*/
var a;
a = 10;
alert(a);
function f() {}
f(1);
var b = 1;
function g() {
return b;
}
// With blockBindings: true
{
let C;
c++;
}
Options
{
"no-use-before-define": ["error", { "functions": true, "classes": true }]
}
-
functions
(boolean
) - The flag which shows whether or not this rule checks function declarations. If this istrue
, this rule warns every reference to a function before the function declaration. Otherwise, ignores those references. Function declarations are hoisted, so it's safe. Default istrue
. -
classes
(boolean
) - The flag which shows whether or not this rule checks class declarations of upper scopes. If this istrue
, this rule warns every reference to a class before the class declaration. Otherwise, ignores those references if the declaration is in upper function scopes. Class declarations are not hoisted, so it might be danger. Default istrue
. -
variables
(boolean
) - This flag determines whether or not the rule checks variable declarations in upper scopes. If this istrue
, the rule warns every reference to a variable before the variable declaration. Otherwise, the rule ignores a reference if the declaration is in an upper scope, while still reporting the reference if it's in the same scope as the declaration. Default istrue
.
This rule accepts "nofunc"
string as an option.
"nofunc"
is the same as { "functions": false, "classes": true }
.
functions
Examples of correct code for the { "functions": false }
option:
/*eslint no-use-before-define: ["error", { "functions": false }]*/
f();
function f() {}
classes
Examples of incorrect code for the { "classes": false }
option:
/*eslint no-use-before-define: ["error", { "classes": false }]*/
/*eslint-env es6*/
new A();
class A {
}
Examples of correct code for the { "classes": false }
option:
/*eslint no-use-before-define: ["error", { "classes": false }]*/
/*eslint-env es6*/
function foo() {
return new A();
}
class A {
}
variables
Examples of incorrect code for the { "variables": false }
option:
/*eslint no-use-before-define: ["error", { "variables": false }]*/
console.log(foo);
var foo = 1;
Examples of correct code for the { "variables": false }
option:
/*eslint no-use-before-define: ["error", { "variables": false }]*/
function baz() {
console.log(foo);
}
var foo = 1;
Source: http://eslint.org/docs/rules/
Unexpected var, use let or const instead. Open
var _callback;
- Read upRead up
- Exclude checks
require let
or const
instead of var
(no-var)
ECMAScript 6 allows programmers to create variables with block scope instead of function scope using the let
and const
keywords. Block scope is common in many other programming languages and helps programmers avoid mistakes
such as:
var count = people.length;
var enoughFood = count > sandwiches.length;
if (enoughFood) {
var count = sandwiches.length; // accidentally overriding the count variable
console.log("We have " + count + " sandwiches for everyone. Plenty for all!");
}
// our count variable is no longer accurate
console.log("We have " + count + " people and " + sandwiches.length + " sandwiches!");
Rule Details
This rule is aimed at discouraging the use of var
and encouraging the use of const
or let
instead.
Examples
Examples of incorrect code for this rule:
/*eslint no-var: "error"*/
var x = "y";
var CONFIG = {};
Examples of correct code for this rule:
/*eslint no-var: "error"*/
/*eslint-env es6*/
let x = "y";
const CONFIG = {};
When Not To Use It
In addition to non-ES6 environments, existing JavaScript projects that are beginning to introduce ES6 into their
codebase may not want to apply this rule if the cost of migrating from var
to let
is too costly.
Source: http://eslint.org/docs/rules/
A space is required after '{'. Open
_instance.dispatchEvent(_events.CLICK, {target:_instance});
- Read upRead up
- Exclude checks
enforce consistent spacing inside braces (object-curly-spacing)
While formatting preferences are very personal, a number of style guides require or disallow spaces between curly braces in the following situations:
// simple object literals
var obj = { foo: "bar" };
// nested object literals
var obj = { foo: { zoo: "bar" } };
// destructuring assignment (EcmaScript 6)
var { x, y } = y;
// import/export declarations (EcmaScript 6)
import { foo } from "bar";
export { foo };
Rule Details
This rule enforce consistent spacing inside braces of object literals, destructuring assignments, and import/export specifiers.
Options
This rule has two options, a string option and an object option.
String option:
-
"never"
(default) disallows spacing inside of braces -
"always"
requires spacing inside of braces (except{}
)
Object option:
-
"arraysInObjects": true
requires spacing inside of braces of objects beginning and/or ending with an array element (applies when the first option is set tonever
) -
"arraysInObjects": false
disallows spacing inside of braces of objects beginning and/or ending with an array element (applies when the first option is set toalways
) -
"objectsInObjects": true
requires spacing inside of braces of objects beginning and/or ending with an object element (applies when the first option is set tonever
) -
"objectsInObjects": false
disallows spacing inside of braces of objects beginning and/or ending with an object element (applies when the first option is set toalways
)
never
Examples of incorrect code for this rule with the default "never"
option:
/*eslint object-curly-spacing: ["error", "never"]*/
var obj = { 'foo': 'bar' };
var obj = {'foo': 'bar' };
var obj = { baz: {'foo': 'qux'}, bar};
var obj = {baz: { 'foo': 'qux'}, bar};
var {x } = y;
import { foo } from 'bar';
Examples of correct code for this rule with the default "never"
option:
/*eslint object-curly-spacing: ["error", "never"]*/
var obj = {'foo': 'bar'};
var obj = {'foo': {'bar': 'baz'}, 'qux': 'quxx'};
var obj = {
'foo': 'bar'
};
var obj = {'foo': 'bar'
};
var obj = {
'foo':'bar'};
var obj = {};
var {x} = y;
import {foo} from 'bar';
always
Examples of incorrect code for this rule with the "always"
option:
/*eslint object-curly-spacing: ["error", "always"]*/
var obj = {'foo': 'bar'};
var obj = {'foo': 'bar' };
var obj = { baz: {'foo': 'qux'}, bar};
var obj = {baz: { 'foo': 'qux' }, bar};
var obj = {'foo': 'bar'
};
var obj = {
'foo':'bar'};
var {x} = y;
import {foo } from 'bar';
Examples of correct code for this rule with the "always"
option:
/*eslint object-curly-spacing: ["error", "always"]*/
var obj = {};
var obj = { 'foo': 'bar' };
var obj = { 'foo': { 'bar': 'baz' }, 'qux': 'quxx' };
var obj = {
'foo': 'bar'
};
var { x } = y;
import { foo } from 'bar';
arraysInObjects
Examples of additional correct code for this rule with the "never", { "arraysInObjects": true }
options:
/*eslint object-curly-spacing: ["error", "never", { "arraysInObjects": true }]*/
var obj = {"foo": [ 1, 2 ] };
var obj = {"foo": [ "baz", "bar" ] };
Examples of additional correct code for this rule with the "always", { "arraysInObjects": false }
options:
/*eslint object-curly-spacing: ["error", "always", { "arraysInObjects": false }]*/
var obj = { "foo": [ 1, 2 ]};
var obj = { "foo": [ "baz", "bar" ]};
objectsInObjects
Examples of additional correct code for this rule with the "never", { "objectsInObjects": true }
options:
/*eslint object-curly-spacing: ["error", "never", { "objectsInObjects": true }]*/
var obj = {"foo": {"baz": 1, "bar": 2} };
Examples of additional correct code for this rule with the "always", { "objectsInObjects": false }
options:
/*eslint object-curly-spacing: ["error", "always", { "objectsInObjects": false }]*/
var obj = { "foo": { "baz": 1, "bar": 2 }};
When Not To Use It
You can turn this rule off if you are not concerned with the consistency of spacing between curly braces.
Related Rules
- [comma-spacing](comma-spacing.md)
- [space-in-parens](space-in-parens.md) Source: http://eslint.org/docs/rules/
Unexpected dangling '_' in '_buttonElm'. Open
var _buttonElm = document.querySelector(selector);
- Read upRead up
- Exclude checks
disallow dangling underscores in identifiers (no-underscore-dangle)
As far as naming conventions for identifiers go, dangling underscores may be the most polarizing in JavaScript. Dangling underscores are underscores at either the beginning or end of an identifier, such as:
var _foo;
There is actually a long history of using dangling underscores to indicate "private" members of objects in JavaScript (though JavaScript doesn't have truly private members, this convention served as a warning). This began with SpiderMonkey adding nonstandard methods such as __defineGetter__()
. The intent with the underscores was to make it obvious that this method was special in some way. Since that time, using a single underscore prefix has become popular as a way to indicate "private" members of objects.
Whether or not you choose to allow dangling underscores in identifiers is purely a convention and has no effect on performance, readability, or complexity. It's purely a preference.
Rule Details
This rule disallows dangling underscores in identifiers.
Examples of incorrect code for this rule:
/*eslint no-underscore-dangle: "error"*/
var foo_;
var __proto__ = {};
foo._bar();
Examples of correct code for this rule:
/*eslint no-underscore-dangle: "error"*/
var _ = require('underscore');
var obj = _.contains(items, item);
obj.__proto__ = {};
var file = __filename;
Options
This rule has an object option:
-
"allow"
allows specified identifiers to have dangling underscores -
"allowAfterThis": false
(default) disallows dangling underscores in members of thethis
object -
"allowAfterSuper": false
(default) disallows dangling underscores in members of thesuper
object
allow
Examples of additional correct code for this rule with the { "allow": ["foo_", "_bar"] }
option:
/*eslint no-underscore-dangle: ["error", { "allow": ["foo_", "_bar"] }]*/
var foo_;
foo._bar();
allowAfterThis
Examples of correct code for this rule with the { "allowAfterThis": true }
option:
/*eslint no-underscore-dangle: ["error", { "allowAfterThis": true }]*/
var a = this.foo_;
this._bar();
allowAfterSuper
Examples of correct code for this rule with the { "allowAfterSuper": true }
option:
/*eslint no-underscore-dangle: ["error", { "allowAfterSuper": true }]*/
var a = super.foo_;
super._bar();
When Not To Use It
If you want to allow dangling underscores in identifiers, then you can safely turn this rule off. Source: http://eslint.org/docs/rules/
Unnecessarily quoted property 'change' found. Open
'change': 'input',
- Read upRead up
- Exclude checks
require quotes around object literal property names (quote-props)
Object literal property names can be defined in two ways: using literals or using strings. For example, these two objects are equivalent:
var object1 = {
property: true
};
var object2 = {
"property": true
};
In many cases, it doesn't matter if you choose to use an identifier instead of a string or vice-versa. Even so, you might decide to enforce a consistent style in your code.
There are, however, some occasions when you must use quotes:
- If you are using an ECMAScript 3 JavaScript engine (such as IE8) and you want to use a keyword (such as
if
) as a property name. This restriction was removed in ECMAScript 5. - You want to use a non-identifier character in your property name, such as having a property with a space like
"one two"
.
Another example where quotes do matter is when using numeric literals as property keys:
var object = {
1e2: 1,
100: 2
};
This may look alright at first sight, but this code in fact throws a syntax error in ECMAScript 5 strict mode. This happens because 1e2
and 100
are coerced into strings before getting used as the property name. Both String(1e2)
and String(100)
happen to be equal to "100"
, which causes the "Duplicate data property in object literal not allowed in strict mode" error. Issues like that can be tricky to debug, so some prefer to require quotes around all property names.
Rule Details
This rule requires quotes around object literal property names.
Options
This rule has two options, a string option and an object option.
String option:
-
"always"
(default) requires quotes around all object literal property names -
"as-needed"
disallows quotes around object literal property names that are not strictly required -
"consistent"
enforces a consistent quote style requires quotes around object literal property names -
"consistent-as-needed"
requires quotes around all object literal property names if any name strictly requires quotes, otherwise disallows quotes around object property names
Object option:
-
"keywords": true
requires quotes around language keywords used as object property names (only applies when usingas-needed
orconsistent-as-needed
) -
"unnecessary": true
(default) disallows quotes around object literal property names that are not strictly required (only applies when usingas-needed
) -
"unnecessary": false
allows quotes around object literal property names that are not strictly required (only applies when usingas-needed
) -
"numbers": true
requires quotes around numbers used as object property names (only applies when usingas-needed
)
always
Examples of incorrect code for this rule with the default "always"
option:
/*eslint quote-props: ["error", "always"]*/
var object = {
foo: "bar",
baz: 42,
"qux-lorem": true
};
Examples of correct code for this rule with the default "always"
option:
/*eslint quote-props: ["error", "always"]*/
/*eslint-env es6*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42,
'qux-lorem': true
};
var object3 = {
foo() {
return;
}
};
as-needed
Examples of incorrect code for this rule with the "as-needed"
option:
/*eslint quote-props: ["error", "as-needed"]*/
var object = {
"a": 0,
"0": 0,
"true": 0,
"null": 0
};
Examples of correct code for this rule with the "as-needed"
option:
/*eslint quote-props: ["error", "as-needed"]*/
/*eslint-env es6*/
var object1 = {
"a-b": 0,
"0x0": 0,
"1e2": 0
};
var object2 = {
foo: 'bar',
baz: 42,
true: 0,
0: 0,
'qux-lorem': true
};
var object3 = {
foo() {
return;
}
};
consistent
Examples of incorrect code for this rule with the "consistent"
option:
/*eslint quote-props: ["error", "consistent"]*/
var object1 = {
foo: "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
baz: 42
};
Examples of correct code for this rule with the "consistent"
option:
/*eslint quote-props: ["error", "consistent"]*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42
};
var object3 = {
foo: 'bar',
baz: 42
};
consistent-as-needed
Examples of incorrect code for this rule with the "consistent-as-needed"
option:
/*eslint quote-props: ["error", "consistent-as-needed"]*/
var object1 = {
foo: "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42
};
Examples of correct code for this rule with the "consistent-as-needed"
option:
/*eslint quote-props: ["error", "consistent-as-needed"]*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
foo: 'bar',
baz: 42
};
keywords
Examples of additional incorrect code for this rule with the "as-needed", { "keywords": true }
options:
/*eslint quote-props: ["error", "as-needed", { "keywords": true }]*/
var x = {
while: 1,
volatile: "foo"
};
Examples of additional incorrect code for this rule with the "consistent-as-needed", { "keywords": true }
options:
/*eslint quote-props: ["error", "consistent-as-needed", { "keywords": true }]*/
var x = {
"prop": 1,
"bar": "foo"
};
unnecessary
Examples of additional correct code for this rule with the "as-needed", { "unnecessary": false }
options:
/*eslint quote-props: ["error", "as-needed", { "keywords": true, "unnecessary": false }]*/
var x = {
"while": 1,
"foo": "bar" // Would normally have caused a warning
};
numbers
Examples of additional incorrect code for this rule with the "as-needed", { "numbers": true }
options:
/*eslint quote-props: ["error", "as-needed", { "numbers": true }]*/
var x = {
100: 1
}
When Not To Use It
If you don't care if property names are consistently wrapped in quotes or not, and you don't target legacy ES3 environments, turn this rule off.
Further Reading
Unexpected dangling '_' in '_atMaxSize'. Open
var _atMaxSize = false;
- Read upRead up
- Exclude checks
disallow dangling underscores in identifiers (no-underscore-dangle)
As far as naming conventions for identifiers go, dangling underscores may be the most polarizing in JavaScript. Dangling underscores are underscores at either the beginning or end of an identifier, such as:
var _foo;
There is actually a long history of using dangling underscores to indicate "private" members of objects in JavaScript (though JavaScript doesn't have truly private members, this convention served as a warning). This began with SpiderMonkey adding nonstandard methods such as __defineGetter__()
. The intent with the underscores was to make it obvious that this method was special in some way. Since that time, using a single underscore prefix has become popular as a way to indicate "private" members of objects.
Whether or not you choose to allow dangling underscores in identifiers is purely a convention and has no effect on performance, readability, or complexity. It's purely a preference.
Rule Details
This rule disallows dangling underscores in identifiers.
Examples of incorrect code for this rule:
/*eslint no-underscore-dangle: "error"*/
var foo_;
var __proto__ = {};
foo._bar();
Examples of correct code for this rule:
/*eslint no-underscore-dangle: "error"*/
var _ = require('underscore');
var obj = _.contains(items, item);
obj.__proto__ = {};
var file = __filename;
Options
This rule has an object option:
-
"allow"
allows specified identifiers to have dangling underscores -
"allowAfterThis": false
(default) disallows dangling underscores in members of thethis
object -
"allowAfterSuper": false
(default) disallows dangling underscores in members of thesuper
object
allow
Examples of additional correct code for this rule with the { "allow": ["foo_", "_bar"] }
option:
/*eslint no-underscore-dangle: ["error", { "allow": ["foo_", "_bar"] }]*/
var foo_;
foo._bar();
allowAfterThis
Examples of correct code for this rule with the { "allowAfterThis": true }
option:
/*eslint no-underscore-dangle: ["error", { "allowAfterThis": true }]*/
var a = this.foo_;
this._bar();
allowAfterSuper
Examples of correct code for this rule with the { "allowAfterSuper": true }
option:
/*eslint no-underscore-dangle: ["error", { "allowAfterSuper": true }]*/
var a = super.foo_;
super._bar();
When Not To Use It
If you want to allow dangling underscores in identifiers, then you can safely turn this rule off. Source: http://eslint.org/docs/rules/
Unnecessarily quoted property 'width' found. Open
'width':myWidth,
- Read upRead up
- Exclude checks
require quotes around object literal property names (quote-props)
Object literal property names can be defined in two ways: using literals or using strings. For example, these two objects are equivalent:
var object1 = {
property: true
};
var object2 = {
"property": true
};
In many cases, it doesn't matter if you choose to use an identifier instead of a string or vice-versa. Even so, you might decide to enforce a consistent style in your code.
There are, however, some occasions when you must use quotes:
- If you are using an ECMAScript 3 JavaScript engine (such as IE8) and you want to use a keyword (such as
if
) as a property name. This restriction was removed in ECMAScript 5. - You want to use a non-identifier character in your property name, such as having a property with a space like
"one two"
.
Another example where quotes do matter is when using numeric literals as property keys:
var object = {
1e2: 1,
100: 2
};
This may look alright at first sight, but this code in fact throws a syntax error in ECMAScript 5 strict mode. This happens because 1e2
and 100
are coerced into strings before getting used as the property name. Both String(1e2)
and String(100)
happen to be equal to "100"
, which causes the "Duplicate data property in object literal not allowed in strict mode" error. Issues like that can be tricky to debug, so some prefer to require quotes around all property names.
Rule Details
This rule requires quotes around object literal property names.
Options
This rule has two options, a string option and an object option.
String option:
-
"always"
(default) requires quotes around all object literal property names -
"as-needed"
disallows quotes around object literal property names that are not strictly required -
"consistent"
enforces a consistent quote style requires quotes around object literal property names -
"consistent-as-needed"
requires quotes around all object literal property names if any name strictly requires quotes, otherwise disallows quotes around object property names
Object option:
-
"keywords": true
requires quotes around language keywords used as object property names (only applies when usingas-needed
orconsistent-as-needed
) -
"unnecessary": true
(default) disallows quotes around object literal property names that are not strictly required (only applies when usingas-needed
) -
"unnecessary": false
allows quotes around object literal property names that are not strictly required (only applies when usingas-needed
) -
"numbers": true
requires quotes around numbers used as object property names (only applies when usingas-needed
)
always
Examples of incorrect code for this rule with the default "always"
option:
/*eslint quote-props: ["error", "always"]*/
var object = {
foo: "bar",
baz: 42,
"qux-lorem": true
};
Examples of correct code for this rule with the default "always"
option:
/*eslint quote-props: ["error", "always"]*/
/*eslint-env es6*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42,
'qux-lorem': true
};
var object3 = {
foo() {
return;
}
};
as-needed
Examples of incorrect code for this rule with the "as-needed"
option:
/*eslint quote-props: ["error", "as-needed"]*/
var object = {
"a": 0,
"0": 0,
"true": 0,
"null": 0
};
Examples of correct code for this rule with the "as-needed"
option:
/*eslint quote-props: ["error", "as-needed"]*/
/*eslint-env es6*/
var object1 = {
"a-b": 0,
"0x0": 0,
"1e2": 0
};
var object2 = {
foo: 'bar',
baz: 42,
true: 0,
0: 0,
'qux-lorem': true
};
var object3 = {
foo() {
return;
}
};
consistent
Examples of incorrect code for this rule with the "consistent"
option:
/*eslint quote-props: ["error", "consistent"]*/
var object1 = {
foo: "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
baz: 42
};
Examples of correct code for this rule with the "consistent"
option:
/*eslint quote-props: ["error", "consistent"]*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42
};
var object3 = {
foo: 'bar',
baz: 42
};
consistent-as-needed
Examples of incorrect code for this rule with the "consistent-as-needed"
option:
/*eslint quote-props: ["error", "consistent-as-needed"]*/
var object1 = {
foo: "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
'foo': 'bar',
'baz': 42
};
Examples of correct code for this rule with the "consistent-as-needed"
option:
/*eslint quote-props: ["error", "consistent-as-needed"]*/
var object1 = {
"foo": "bar",
"baz": 42,
"qux-lorem": true
};
var object2 = {
foo: 'bar',
baz: 42
};
keywords
Examples of additional incorrect code for this rule with the "as-needed", { "keywords": true }
options:
/*eslint quote-props: ["error", "as-needed", { "keywords": true }]*/
var x = {
while: 1,
volatile: "foo"
};
Examples of additional incorrect code for this rule with the "consistent-as-needed", { "keywords": true }
options:
/*eslint quote-props: ["error", "consistent-as-needed", { "keywords": true }]*/
var x = {
"prop": 1,
"bar": "foo"
};
unnecessary
Examples of additional correct code for this rule with the "as-needed", { "unnecessary": false }
options:
/*eslint quote-props: ["error", "as-needed", { "keywords": true, "unnecessary": false }]*/
var x = {
"while": 1,
"foo": "bar" // Would normally have caused a warning
};
numbers
Examples of additional incorrect code for this rule with the "as-needed", { "numbers": true }
options:
/*eslint quote-props: ["error", "as-needed", { "numbers": true }]*/
var x = {
100: 1
}
When Not To Use It
If you don't care if property names are consistently wrapped in quotes or not, and you don't target legacy ES3 environments, turn this rule off.
Further Reading
'_refresh' was used before it was defined. Open
_refresh();
- Read upRead up
- Exclude checks
Disallow Early Use (no-use-before-define)
In JavaScript, prior to ES6, variable and function declarations are hoisted to the top of a scope, so it's possible to use identifiers before their formal declarations in code. This can be confusing and some believe it is best to always declare variables and functions before using them.
In ES6, block-level bindings (let
and const
) introduce a "temporal dead zone" where a ReferenceError
will be thrown with any attempt to access the variable before its declaration.
Rule Details
This rule will warn when it encounters a reference to an identifier that has not yet been declared.
Examples of incorrect code for this rule:
/*eslint no-use-before-define: "error"*/
/*eslint-env es6*/
alert(a);
var a = 10;
f();
function f() {}
function g() {
return b;
}
var b = 1;
// With blockBindings: true
{
alert(c);
let c = 1;
}
Examples of correct code for this rule:
/*eslint no-use-before-define: "error"*/
/*eslint-env es6*/
var a;
a = 10;
alert(a);
function f() {}
f(1);
var b = 1;
function g() {
return b;
}
// With blockBindings: true
{
let C;
c++;
}
Options
{
"no-use-before-define": ["error", { "functions": true, "classes": true }]
}
-
functions
(boolean
) - The flag which shows whether or not this rule checks function declarations. If this istrue
, this rule warns every reference to a function before the function declaration. Otherwise, ignores those references. Function declarations are hoisted, so it's safe. Default istrue
. -
classes
(boolean
) - The flag which shows whether or not this rule checks class declarations of upper scopes. If this istrue
, this rule warns every reference to a class before the class declaration. Otherwise, ignores those references if the declaration is in upper function scopes. Class declarations are not hoisted, so it might be danger. Default istrue
. -
variables
(boolean
) - This flag determines whether or not the rule checks variable declarations in upper scopes. If this istrue
, the rule warns every reference to a variable before the variable declaration. Otherwise, the rule ignores a reference if the declaration is in an upper scope, while still reporting the reference if it's in the same scope as the declaration. Default istrue
.
This rule accepts "nofunc"
string as an option.
"nofunc"
is the same as { "functions": false, "classes": true }
.
functions
Examples of correct code for the { "functions": false }
option:
/*eslint no-use-before-define: ["error", { "functions": false }]*/
f();
function f() {}
classes
Examples of incorrect code for the { "classes": false }
option:
/*eslint no-use-before-define: ["error", { "classes": false }]*/
/*eslint-env es6*/
new A();
class A {
}
Examples of correct code for the { "classes": false }
option:
/*eslint no-use-before-define: ["error", { "classes": false }]*/
/*eslint-env es6*/
function foo() {
return new A();
}
class A {
}
variables
Examples of incorrect code for the { "variables": false }
option:
/*eslint no-use-before-define: ["error", { "variables": false }]*/
console.log(foo);
var foo = 1;
Examples of correct code for the { "variables": false }
option:
/*eslint no-use-before-define: ["error", { "variables": false }]*/
function baz() {
console.log(foo);
}
var foo = 1;
Source: http://eslint.org/docs/rules/
Unexpected var, use let or const instead. Open
var clientTop = docElem.clientTop || body.clientTop || 0,
- Read upRead up
- Exclude checks
require let
or const
instead of var
(no-var)
ECMAScript 6 allows programmers to create variables with block scope instead of function scope using the let
and const
keywords. Block scope is common in many other programming languages and helps programmers avoid mistakes
such as:
var count = people.length;
var enoughFood = count > sandwiches.length;
if (enoughFood) {
var count = sandwiches.length; // accidentally overriding the count variable
console.log("We have " + count + " sandwiches for everyone. Plenty for all!");
}
// our count variable is no longer accurate
console.log("We have " + count + " people and " + sandwiches.length + " sandwiches!");
Rule Details
This rule is aimed at discouraging the use of var
and encouraging the use of const
or let
instead.
Examples
Examples of incorrect code for this rule:
/*eslint no-var: "error"*/
var x = "y";
var CONFIG = {};
Examples of correct code for this rule:
/*eslint no-var: "error"*/
/*eslint-env es6*/
let x = "y";
const CONFIG = {};
When Not To Use It
In addition to non-ES6 environments, existing JavaScript projects that are beginning to introduce ES6 into their
codebase may not want to apply this rule if the cost of migrating from var
to let
is too costly.
Source: http://eslint.org/docs/rules/
Unexpected mix of '||' and '&&'. Open
isBoxModel && docElem.scrollLeft ||
- Read upRead up
- Exclude checks
Disallow mixes of different operators (no-mixed-operators)
Enclosing complex expressions by parentheses clarifies the developer's intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.
var foo = a && b || c || d; /*BAD: Unexpected mix of '&&' and '||'.*/
var foo = (a && b) || c || d; /*GOOD*/
var foo = a && (b || c || d); /*GOOD*/
Rule Details
This rule checks BinaryExpression
and LogicalExpression
.
This rule may conflict with [no-extra-parens](no-extra-parens.md) rule.
If you use both this and [no-extra-parens](no-extra-parens.md) rule together, you need to use the nestedBinaryExpressions
option of [no-extra-parens](no-extra-parens.md) rule.
Examples of incorrect code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a + b * c;
Examples of correct code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a || b || c;
var foo = a && b && c;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = a + (b * c);
var foo = (a + b) * c;
Options
{
"no-mixed-operators": [
"error",
{
"groups": [
["+", "-", "*", "/", "%", "**"],
["&", "|", "^", "~", "<<", ">>", ">>>"],
["==", "!=", "===", "!==", ">", ">=", "<", "<="],
["&&", "||"],
["in", "instanceof"]
],
"allowSamePrecedence": true
}
]
}
This rule has 2 options.
-
groups
(string[][]
) - specifies groups to compare operators. When this rule compares two operators, if both operators are included in a same group, this rule checks it. Otherwise, this rule ignores it. This value is a list of groups. The group is a list of binary operators. Default is the groups for each kind of operators. -
allowSamePrecedence
(boolean
) - specifies to allow mix of 2 operators if those have the same precedence. Default istrue
.
groups
The following operators can be used in groups
option:
- Arithmetic Operators:
"+"
,"-"
,"*"
,"/"
,"%"
,"**"
- Bitwise Operators:
"&"
,"|"
,"^"
,"~"
,"<<"
,">>"
,">>>"
- Comparison Operators:
"=="
,"!="
,"==="
,"!=="
,">"
,">="
,"<"
,"<="
- Logical Operators:
"&&"
,"||"
- Relational Operators:
"in"
,"instanceof"
Now, considers about {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
configure.
This configure has 2 groups: bitwise operators and logical operators.
This rule checks only if both operators are included in a same group.
So, in this case, this rule comes to check between bitwise operators and between logical operators.
This rule ignores other operators.
Examples of incorrect code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a & b | c;
Examples of correct code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a || b > 0 || c + 1 === 0;
var foo = a && b > 0 && c + 1 === 0;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = (a & b) | c;
var foo = a & (b | c);
var foo = a + b * c;
var foo = a + (b * c);
var foo = (a + b) * c;
allowSamePrecedence
Examples of correct code for this rule with {"allowSamePrecedence": true}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/
// + and - have the same precedence.
var foo = a + b - c;
Examples of incorrect code for this rule with {"allowSamePrecedence": false}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/
// + and - have the same precedence.
var foo = a + b - c;
When Not To Use It
If you don't want to be notified about mixed operators, then it's safe to disable this rule.
Related Rules
- [no-extra-parens](no-extra-parens.md) Source: http://eslint.org/docs/rules/
Unexpected mix of '+' and '-'. Open
left: box.left + scrollLeft - clientLeft
- Read upRead up
- Exclude checks
Disallow mixes of different operators (no-mixed-operators)
Enclosing complex expressions by parentheses clarifies the developer's intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.
var foo = a && b || c || d; /*BAD: Unexpected mix of '&&' and '||'.*/
var foo = (a && b) || c || d; /*GOOD*/
var foo = a && (b || c || d); /*GOOD*/
Rule Details
This rule checks BinaryExpression
and LogicalExpression
.
This rule may conflict with [no-extra-parens](no-extra-parens.md) rule.
If you use both this and [no-extra-parens](no-extra-parens.md) rule together, you need to use the nestedBinaryExpressions
option of [no-extra-parens](no-extra-parens.md) rule.
Examples of incorrect code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a + b * c;
Examples of correct code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a || b || c;
var foo = a && b && c;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = a + (b * c);
var foo = (a + b) * c;
Options
{
"no-mixed-operators": [
"error",
{
"groups": [
["+", "-", "*", "/", "%", "**"],
["&", "|", "^", "~", "<<", ">>", ">>>"],
["==", "!=", "===", "!==", ">", ">=", "<", "<="],
["&&", "||"],
["in", "instanceof"]
],
"allowSamePrecedence": true
}
]
}
This rule has 2 options.
-
groups
(string[][]
) - specifies groups to compare operators. When this rule compares two operators, if both operators are included in a same group, this rule checks it. Otherwise, this rule ignores it. This value is a list of groups. The group is a list of binary operators. Default is the groups for each kind of operators. -
allowSamePrecedence
(boolean
) - specifies to allow mix of 2 operators if those have the same precedence. Default istrue
.
groups
The following operators can be used in groups
option:
- Arithmetic Operators:
"+"
,"-"
,"*"
,"/"
,"%"
,"**"
- Bitwise Operators:
"&"
,"|"
,"^"
,"~"
,"<<"
,">>"
,">>>"
- Comparison Operators:
"=="
,"!="
,"==="
,"!=="
,">"
,">="
,"<"
,"<="
- Logical Operators:
"&&"
,"||"
- Relational Operators:
"in"
,"instanceof"
Now, considers about {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
configure.
This configure has 2 groups: bitwise operators and logical operators.
This rule checks only if both operators are included in a same group.
So, in this case, this rule comes to check between bitwise operators and between logical operators.
This rule ignores other operators.
Examples of incorrect code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a & b | c;
Examples of correct code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a || b > 0 || c + 1 === 0;
var foo = a && b > 0 && c + 1 === 0;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = (a & b) | c;
var foo = a & (b | c);
var foo = a + b * c;
var foo = a + (b * c);
var foo = (a + b) * c;
allowSamePrecedence
Examples of correct code for this rule with {"allowSamePrecedence": true}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/
// + and - have the same precedence.
var foo = a + b - c;
Examples of incorrect code for this rule with {"allowSamePrecedence": false}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/
// + and - have the same precedence.
var foo = a + b - c;
When Not To Use It
If you don't want to be notified about mixed operators, then it's safe to disable this rule.
Related Rules
- [no-extra-parens](no-extra-parens.md) Source: http://eslint.org/docs/rules/
Missing space before value for key 'getWindowRect'. Open
getWindowRect:getWindowRect,
- Read upRead up
- Exclude checks
enforce consistent spacing between keys and values in object literal properties (key-spacing)
This rule enforces spacing around the colon in object literal properties. It can verify each property individually, or it can ensure horizontal alignment of adjacent properties in an object literal.
Rule Details
This rule enforces consistent spacing between keys and values in object literal properties. In the case of long lines, it is acceptable to add a new line wherever whitespace is allowed.
Options
This rule has an object option:
-
"beforeColon": false
(default) disallows spaces between the key and the colon in object literals. -
"beforeColon": true
requires at least one space between the key and the colon in object literals. -
"afterColon": true
(default) requires at least one space between the colon and the value in object literals. -
"afterColon": false
disallows spaces between the colon and the value in object literals. -
"mode": "strict"
(default) enforces exactly one space before or after colons in object literals. -
"mode": "minimum"
enforces one or more spaces before or after colons in object literals. -
"align": "value"
enforces horizontal alignment of values in object literals. -
"align": "colon"
enforces horizontal alignment of both colons and values in object literals. -
"align"
with an object value allows for fine-grained spacing when values are being aligned in object literals. -
"singleLine"
specifies a spacing style for single-line object literals. -
"multiLine"
specifies a spacing style for multi-line object literals.
Please note that you can either use the top-level options or the grouped options (singleLine
and multiLine
) but not both.
beforeColon
Examples of incorrect code for this rule with the default { "beforeColon": false }
option:
/*eslint key-spacing: ["error", { "beforeColon": false }]*/
var obj = { "foo" : 42 };
Examples of correct code for this rule with the default { "beforeColon": false }
option:
/*eslint key-spacing: ["error", { "beforeColon": false }]*/
var obj = { "foo": 42 };
Examples of incorrect code for this rule with the { "beforeColon": true }
option:
/*eslint key-spacing: ["error", { "beforeColon": true }]*/
var obj = { "foo": 42 };
Examples of correct code for this rule with the { "beforeColon": true }
option:
/*eslint key-spacing: ["error", { "beforeColon": true }]*/
var obj = { "foo" : 42 };
afterColon
Examples of incorrect code for this rule with the default { "afterColon": true }
option:
/*eslint key-spacing: ["error", { "afterColon": true }]*/
var obj = { "foo":42 };
Examples of correct code for this rule with the default { "afterColon": true }
option:
/*eslint key-spacing: ["error", { "afterColon": true }]*/
var obj = { "foo": 42 };
Examples of incorrect code for this rule with the { "afterColon": false }
option:
/*eslint key-spacing: ["error", { "afterColon": false }]*/
var obj = { "foo": 42 };
Examples of correct code for this rule with the { "afterColon": false }
option:
/*eslint key-spacing: ["error", { "afterColon": false }]*/
var obj = { "foo":42 };
mode
Examples of incorrect code for this rule with the default { "mode": "strict" }
option:
/*eslint key-spacing: ["error", { "mode": "strict" }]*/
call({
foobar: 42,
bat: 2 * 2
});
Examples of correct code for this rule with the default { "mode": "strict" }
option:
/*eslint key-spacing: ["error", { "mode": "strict" }]*/
call({
foobar: 42,
bat: 2 * 2
});
Examples of correct code for this rule with the { "mode": "minimum" }
option:
/*eslint key-spacing: ["error", { "mode": "minimum" }]*/
call({
foobar: 42,
bat: 2 * 2
});
align
Examples of incorrect code for this rule with the { "align": "value" }
option:
/*eslint key-spacing: ["error", { "align": "value" }]*/
var obj = {
a: value,
bcde: 42,
fg : foo()
};
Examples of correct code for this rule with the { "align": "value" }
option:
/*eslint key-spacing: ["error", { "align": "value" }]*/
var obj = {
a: value,
bcde: 42,
fg: foo(),
h: function() {
return this.a;
},
ijkl: 'Non-consecutive lines form a new group'
};
var obj = { a: "foo", longPropertyName: "bar" };
Examples of incorrect code for this rule with the { "align": "colon" }
option:
/*eslint key-spacing: ["error", { "align": "colon" }]*/
call({
foobar: 42,
bat: 2 * 2
});
Examples of correct code for this rule with the { "align": "colon" }
option:
/*eslint key-spacing: ["error", { "align": "colon" }]*/
call({
foobar: 42,
bat : 2 * 2
});
align
The align
option can take additional configuration through the beforeColon
, afterColon
, mode
, and on
options.
If align
is defined as an object, but not all of the parameters are provided, undefined parameters will default to the following:
// Defaults
align: {
"beforeColon": false,
"afterColon": true,
"on": "colon",
"mode": "strict"
}
Examples of correct code for this rule with sample { "align": { } }
options:
/*eslint key-spacing: ["error", {
"align": {
"beforeColon": true,
"afterColon": true,
"on": "colon"
}
}]*/
var obj = {
"one" : 1,
"seven" : 7
}
/*eslint key-spacing: ["error", {
"align": {
"beforeColon": false,
"afterColon": false,
"on": "value"
}
}]*/
var obj = {
"one": 1,
"seven":7
}
align and multiLine
The multiLine
and align
options can differ, which allows for fine-tuned control over the key-spacing
of your files. align
will not inherit from multiLine
if align
is configured as an object.
multiLine
is used any time an object literal spans multiple lines. The align
configuration is used when there is a group of properties in the same object. For example:
var myObj = {
key1: 1, // uses multiLine
key2: 2, // uses align (when defined)
key3: 3, // uses align (when defined)
key4: 4 // uses multiLine
}
Examples of incorrect code for this rule with sample { "align": { }, "multiLine": { } }
options:
/*eslint key-spacing: ["error", {
"multiLine": {
"beforeColon": false,
"afterColon":true
},
"align": {
"beforeColon": true,
"afterColon": true,
"on": "colon"
}
}]*/
var obj = {
"myObjectFunction": function() {
// Do something
},
"one" : 1,
"seven" : 7
}
Examples of correct code for this rule with sample { "align": { }, "multiLine": { } }
options:
/*eslint key-spacing: ["error", {
"multiLine": {
"beforeColon": false,
"afterColon": true
},
"align": {
"beforeColon": true,
"afterColon": true,
"on": "colon"
}
}]*/
var obj = {
"myObjectFunction": function() {
// Do something
//
}, // These are two separate groups, so no alignment between `myObjectFuction` and `one`
"one" : 1,
"seven" : 7 // `one` and `seven` are in their own group, and therefore aligned
}
singleLine and multiLine
Examples of correct code for this rule with sample { "singleLine": { }, "multiLine": { } }
options:
/*eslint "key-spacing": [2, {
"singleLine": {
"beforeColon": false,
"afterColon": true
},
"multiLine": {
"beforeColon": true,
"afterColon": true,
"align": "colon"
}
}]*/
var obj = { one: 1, "two": 2, three: 3 };
var obj2 = {
"two" : 2,
three : 3
};
When Not To Use It
If you have another convention for property spacing that might not be consistent with the available options, or if you want to permit multiple styles concurrently you can safely disable this rule. Source: http://eslint.org/docs/rules/
'google' is not defined. Open
google.maps.event.addListener(_mapDOM.map, 'click', _mapClick);
- Read upRead up
- Exclude checks
Disallow Undeclared Variables (no-undef)
This rule can help you locate potential ReferenceErrors resulting from misspellings of variable and parameter names, or accidental implicit globals (for example, from forgetting the var
keyword in a for
loop initializer).
Rule Details
Any reference to an undeclared variable causes a warning, unless the variable is explicitly mentioned in a /*global ...*/
comment.
Examples of incorrect code for this rule:
/*eslint no-undef: "error"*/
var a = someFunction();
b = 10;
Examples of correct code for this rule with global
declaration:
/*global someFunction b:true*/
/*eslint no-undef: "error"*/
var a = someFunction();
b = 10;
The b:true
syntax in /*global */
indicates that assignment to b
is correct.
Examples of incorrect code for this rule with global
declaration:
/*global b*/
/*eslint no-undef: "error"*/
b = 10;
By default, variables declared in /*global */
are read-only, therefore assignment is incorrect.
Options
-
typeof
set to true will warn for variables used inside typeof check (Default false).
typeof
Examples of correct code for the default { "typeof": false }
option:
/*eslint no-undef: "error"*/
if (typeof UndefinedIdentifier === "undefined") {
// do something ...
}
You can use this option if you want to prevent typeof
check on a variable which has not been declared.
Examples of incorrect code for the { "typeof": true }
option:
/*eslint no-undef: ["error", { "typeof": true }] */
if(typeof a === "string"){}
Examples of correct code for the { "typeof": true }
option with global
declaration:
/*global a*/
/*eslint no-undef: ["error", { "typeof": true }] */
if(typeof a === "string"){}
Environments
For convenience, ESLint provides shortcuts that pre-define global variables exposed by popular libraries and runtime environments. This rule supports these environments, as listed in Specifying Environments. A few examples are given below.
browser
Examples of correct code for this rule with browser
environment:
/*eslint no-undef: "error"*/
/*eslint-env browser*/
setTimeout(function() {
alert("Hello");
});
node
Examples of correct code for this rule with node
environment:
/*eslint no-undef: "error"*/
/*eslint-env node*/
var fs = require("fs");
module.exports = function() {
console.log(fs);
};
When Not To Use It
If explicit declaration of global variables is not to your taste.
Compatibility
This rule provides compatibility with treatment of global variables in JSHint and JSLint. Source: http://eslint.org/docs/rules/
Expected indentation of 28 spaces but found 35. Open
unspiderfied) {
- Read upRead up
- Exclude checks
enforce consistent indentation (indent)
There are several common guidelines which require specific indentation of nested blocks and statements, like:
function hello(indentSize, type) {
if (indentSize === 4 && type !== 'tab') {
console.log('Each next indentation will increase on 4 spaces');
}
}
These are the most common scenarios recommended in different style guides:
- Two spaces, not longer and no tabs: Google, npm, Node.js, Idiomatic, Felix
- Tabs: jQuery
- Four spaces: Crockford
Rule Details
This rule enforces a consistent indentation style. The default style is 4 spaces
.
Options
This rule has a mixed option:
For example, for 2-space indentation:
{
"indent": ["error", 2]
}
Or for tabbed indentation:
{
"indent": ["error", "tab"]
}
Examples of incorrect code for this rule with the default options:
/*eslint indent: "error"*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
Examples of correct code for this rule with the default options:
/*eslint indent: "error"*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
This rule has an object option:
-
"SwitchCase"
(default: 0) enforces indentation level forcase
clauses inswitch
statements -
"VariableDeclarator"
(default: 1) enforces indentation level forvar
declarators; can also take an object to define separate rules forvar
,let
andconst
declarations. -
"outerIIFEBody"
(default: 1) enforces indentation level for file-level IIFEs. -
"MemberExpression"
(off by default) enforces indentation level for multi-line property chains (except in variable declarations and assignments) -
"FunctionDeclaration"
takes an object to define rules for function declarations.-
parameters
(off by default) enforces indentation level for parameters in a function declaration. This can either be a number indicating indentation level, or the string"first"
indicating that all parameters of the declaration must be aligned with the first parameter. -
body
(default: 1) enforces indentation level for the body of a function declaration.
-
-
"FunctionExpression"
takes an object to define rules for function expressions.-
parameters
(off by default) enforces indentation level for parameters in a function expression. This can either be a number indicating indentation level, or the string"first"
indicating that all parameters of the expression must be aligned with the first parameter. -
body
(default: 1) enforces indentation level for the body of a function expression.
-
-
"CallExpression"
takes an object to define rules for function call expressions.-
arguments
(off by default) enforces indentation level for arguments in a call expression. This can either be a number indicating indentation level, or the string"first"
indicating that all arguments of the expression must be aligned with the first argument.
-
-
"ArrayExpression"
(default: 1) enforces indentation level for elements in arrays. It can also be set to the string"first"
, indicating that all the elements in the array should be aligned with the first element. -
"ObjectExpression"
(default: 1) enforces indentation level for properties in objects. It can be set to the string"first"
, indicating that all properties in the object should be aligned with the first property.
Level of indentation denotes the multiple of the indent specified. Example:
- Indent of 4 spaces with
VariableDeclarator
set to2
will indent the multi-line variable declarations with 8 spaces. - Indent of 2 spaces with
VariableDeclarator
set to2
will indent the multi-line variable declarations with 4 spaces. - Indent of 2 spaces with
VariableDeclarator
set to{"var": 2, "let": 2, "const": 3}
will indent the multi-line variable declarations with 4 spaces forvar
andlet
, 6 spaces forconst
statements. - Indent of tab with
VariableDeclarator
set to2
will indent the multi-line variable declarations with 2 tabs. - Indent of 2 spaces with
SwitchCase
set to0
will not indentcase
clauses with respect toswitch
statements. - Indent of 2 spaces with
SwitchCase
set to1
will indentcase
clauses with 2 spaces with respect toswitch
statements. - Indent of 2 spaces with
SwitchCase
set to2
will indentcase
clauses with 4 spaces with respect toswitch
statements. - Indent of tab with
SwitchCase
set to2
will indentcase
clauses with 2 tabs with respect toswitch
statements. - Indent of 2 spaces with
MemberExpression
set to0
will indent the multi-line property chains with 0 spaces. - Indent of 2 spaces with
MemberExpression
set to1
will indent the multi-line property chains with 2 spaces. - Indent of 2 spaces with
MemberExpression
set to2
will indent the multi-line property chains with 4 spaces. - Indent of 4 spaces with
MemberExpression
set to0
will indent the multi-line property chains with 0 spaces. - Indent of 4 spaces with
MemberExpression
set to1
will indent the multi-line property chains with 4 spaces. - Indent of 4 spaces with
MemberExpression
set to2
will indent the multi-line property chains with 8 spaces.
tab
Examples of incorrect code for this rule with the "tab"
option:
/*eslint indent: ["error", "tab"]*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
Examples of correct code for this rule with the "tab"
option:
/*eslint indent: ["error", "tab"]*/
if (a) {
/*tab*/b=c;
/*tab*/function foo(d) {
/*tab*//*tab*/e=f;
/*tab*/}
}
SwitchCase
Examples of incorrect code for this rule with the 2, { "SwitchCase": 1 }
options:
/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/
switch(a){
case "a":
break;
case "b":
break;
}
Examples of correct code for this rule with the 2, { "SwitchCase": 1 }
option:
/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/
switch(a){
case "a":
break;
case "b":
break;
}
VariableDeclarator
Examples of incorrect code for this rule with the 2, { "VariableDeclarator": 1 }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
Examples of correct code for this rule with the 2, { "VariableDeclarator": 1 }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
Examples of correct code for this rule with the 2, { "VariableDeclarator": 2 }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": 2 }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
Examples of correct code for this rule with the 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
outerIIFEBody
Examples of incorrect code for this rule with the options 2, { "outerIIFEBody": 0 }
:
/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
if(y) {
console.log('foo');
}
Examples of correct code for this rule with the options 2, {"outerIIFEBody": 0}
:
/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
if(y) {
console.log('foo');
}
MemberExpression
Examples of incorrect code for this rule with the 2, { "MemberExpression": 1 }
options:
/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/
foo
.bar
.baz()
Examples of correct code for this rule with the 2, { "MemberExpression": 1 }
option:
/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/
foo
.bar
.baz();
// Any indentation is permitted in variable declarations and assignments.
var bip = aardvark.badger
.coyote;
FunctionDeclaration
Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/
function foo(bar,
baz,
qux) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/
function foo(bar,
baz,
qux) {
qux();
}
Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/
function foo(bar, baz,
qux, boop) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/
function foo(bar, baz,
qux, boop) {
qux();
}
FunctionExpression
Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/
var foo = function(bar,
baz,
qux) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/
var foo = function(bar,
baz,
qux) {
qux();
}
Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/
var foo = function(bar, baz,
qux, boop) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/
var foo = function(bar, baz,
qux, boop) {
qux();
}
CallExpression
Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": 1} }
option:
/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/
foo(bar,
baz,
qux
);
Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": 1} }
option:
/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/
foo(bar,
baz,
qux
);
Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": "first"} }
option:
/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/
foo(bar, baz,
baz, boop, beep);
Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": "first"} }
option:
/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/
foo(bar, baz,
baz, boop, beep);
ArrayExpression
Examples of incorrect code for this rule with the 2, { "ArrayExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/
var foo = [
bar,
baz,
qux
];
Examples of correct code for this rule with the 2, { "ArrayExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/
var foo = [
bar,
baz,
qux
];
Examples of incorrect code for this rule with the 2, { "ArrayExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/
var foo = [bar,
baz,
qux
];
Examples of correct code for this rule with the 2, { "ArrayExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/
var foo = [bar,
baz,
qux
];
ObjectExpression
Examples of incorrect code for this rule with the 2, { "ObjectExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/
var foo = {
bar: 1,
baz: 2,
qux: 3
};
Examples of correct code for this rule with the 2, { "ObjectExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/
var foo = {
bar: 1,
baz: 2,
qux: 3
};
Examples of incorrect code for this rule with the 2, { "ObjectExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/
var foo = { bar: 1,
baz: 2 };
Examples of correct code for this rule with the 2, { "ObjectExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/
var foo = { bar: 1,
baz: 2 };
Compatibility
-
JSHint:
indent
- JSCS: validateIndentation Source: http://eslint.org/docs/rules/
Expected indentation of 28 spaces but found 4. Open
infoBoxManager.turnOn(infoBoxManager.STATE.HAS_SPIDERFIED);
- Read upRead up
- Exclude checks
enforce consistent indentation (indent)
There are several common guidelines which require specific indentation of nested blocks and statements, like:
function hello(indentSize, type) {
if (indentSize === 4 && type !== 'tab') {
console.log('Each next indentation will increase on 4 spaces');
}
}
These are the most common scenarios recommended in different style guides:
- Two spaces, not longer and no tabs: Google, npm, Node.js, Idiomatic, Felix
- Tabs: jQuery
- Four spaces: Crockford
Rule Details
This rule enforces a consistent indentation style. The default style is 4 spaces
.
Options
This rule has a mixed option:
For example, for 2-space indentation:
{
"indent": ["error", 2]
}
Or for tabbed indentation:
{
"indent": ["error", "tab"]
}
Examples of incorrect code for this rule with the default options:
/*eslint indent: "error"*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
Examples of correct code for this rule with the default options:
/*eslint indent: "error"*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
This rule has an object option:
-
"SwitchCase"
(default: 0) enforces indentation level forcase
clauses inswitch
statements -
"VariableDeclarator"
(default: 1) enforces indentation level forvar
declarators; can also take an object to define separate rules forvar
,let
andconst
declarations. -
"outerIIFEBody"
(default: 1) enforces indentation level for file-level IIFEs. -
"MemberExpression"
(off by default) enforces indentation level for multi-line property chains (except in variable declarations and assignments) -
"FunctionDeclaration"
takes an object to define rules for function declarations.-
parameters
(off by default) enforces indentation level for parameters in a function declaration. This can either be a number indicating indentation level, or the string"first"
indicating that all parameters of the declaration must be aligned with the first parameter. -
body
(default: 1) enforces indentation level for the body of a function declaration.
-
-
"FunctionExpression"
takes an object to define rules for function expressions.-
parameters
(off by default) enforces indentation level for parameters in a function expression. This can either be a number indicating indentation level, or the string"first"
indicating that all parameters of the expression must be aligned with the first parameter. -
body
(default: 1) enforces indentation level for the body of a function expression.
-
-
"CallExpression"
takes an object to define rules for function call expressions.-
arguments
(off by default) enforces indentation level for arguments in a call expression. This can either be a number indicating indentation level, or the string"first"
indicating that all arguments of the expression must be aligned with the first argument.
-
-
"ArrayExpression"
(default: 1) enforces indentation level for elements in arrays. It can also be set to the string"first"
, indicating that all the elements in the array should be aligned with the first element. -
"ObjectExpression"
(default: 1) enforces indentation level for properties in objects. It can be set to the string"first"
, indicating that all properties in the object should be aligned with the first property.
Level of indentation denotes the multiple of the indent specified. Example:
- Indent of 4 spaces with
VariableDeclarator
set to2
will indent the multi-line variable declarations with 8 spaces. - Indent of 2 spaces with
VariableDeclarator
set to2
will indent the multi-line variable declarations with 4 spaces. - Indent of 2 spaces with
VariableDeclarator
set to{"var": 2, "let": 2, "const": 3}
will indent the multi-line variable declarations with 4 spaces forvar
andlet
, 6 spaces forconst
statements. - Indent of tab with
VariableDeclarator
set to2
will indent the multi-line variable declarations with 2 tabs. - Indent of 2 spaces with
SwitchCase
set to0
will not indentcase
clauses with respect toswitch
statements. - Indent of 2 spaces with
SwitchCase
set to1
will indentcase
clauses with 2 spaces with respect toswitch
statements. - Indent of 2 spaces with
SwitchCase
set to2
will indentcase
clauses with 4 spaces with respect toswitch
statements. - Indent of tab with
SwitchCase
set to2
will indentcase
clauses with 2 tabs with respect toswitch
statements. - Indent of 2 spaces with
MemberExpression
set to0
will indent the multi-line property chains with 0 spaces. - Indent of 2 spaces with
MemberExpression
set to1
will indent the multi-line property chains with 2 spaces. - Indent of 2 spaces with
MemberExpression
set to2
will indent the multi-line property chains with 4 spaces. - Indent of 4 spaces with
MemberExpression
set to0
will indent the multi-line property chains with 0 spaces. - Indent of 4 spaces with
MemberExpression
set to1
will indent the multi-line property chains with 4 spaces. - Indent of 4 spaces with
MemberExpression
set to2
will indent the multi-line property chains with 8 spaces.
tab
Examples of incorrect code for this rule with the "tab"
option:
/*eslint indent: ["error", "tab"]*/
if (a) {
b=c;
function foo(d) {
e=f;
}
}
Examples of correct code for this rule with the "tab"
option:
/*eslint indent: ["error", "tab"]*/
if (a) {
/*tab*/b=c;
/*tab*/function foo(d) {
/*tab*//*tab*/e=f;
/*tab*/}
}
SwitchCase
Examples of incorrect code for this rule with the 2, { "SwitchCase": 1 }
options:
/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/
switch(a){
case "a":
break;
case "b":
break;
}
Examples of correct code for this rule with the 2, { "SwitchCase": 1 }
option:
/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/
switch(a){
case "a":
break;
case "b":
break;
}
VariableDeclarator
Examples of incorrect code for this rule with the 2, { "VariableDeclarator": 1 }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
Examples of correct code for this rule with the 2, { "VariableDeclarator": 1 }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
Examples of correct code for this rule with the 2, { "VariableDeclarator": 2 }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": 2 }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
Examples of correct code for this rule with the 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }
options:
/*eslint indent: ["error", 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }]*/
/*eslint-env es6*/
var a,
b,
c;
let a,
b,
c;
const a = 1,
b = 2,
c = 3;
outerIIFEBody
Examples of incorrect code for this rule with the options 2, { "outerIIFEBody": 0 }
:
/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
if(y) {
console.log('foo');
}
Examples of correct code for this rule with the options 2, {"outerIIFEBody": 0}
:
/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/
(function() {
function foo(x) {
return x + 1;
}
})();
if(y) {
console.log('foo');
}
MemberExpression
Examples of incorrect code for this rule with the 2, { "MemberExpression": 1 }
options:
/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/
foo
.bar
.baz()
Examples of correct code for this rule with the 2, { "MemberExpression": 1 }
option:
/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/
foo
.bar
.baz();
// Any indentation is permitted in variable declarations and assignments.
var bip = aardvark.badger
.coyote;
FunctionDeclaration
Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/
function foo(bar,
baz,
qux) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/
function foo(bar,
baz,
qux) {
qux();
}
Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/
function foo(bar, baz,
qux, boop) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/
function foo(bar, baz,
qux, boop) {
qux();
}
FunctionExpression
Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/
var foo = function(bar,
baz,
qux) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} }
option:
/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/
var foo = function(bar,
baz,
qux) {
qux();
}
Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/
var foo = function(bar, baz,
qux, boop) {
qux();
}
Examples of correct code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} }
option:
/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/
var foo = function(bar, baz,
qux, boop) {
qux();
}
CallExpression
Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": 1} }
option:
/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/
foo(bar,
baz,
qux
);
Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": 1} }
option:
/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/
foo(bar,
baz,
qux
);
Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": "first"} }
option:
/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/
foo(bar, baz,
baz, boop, beep);
Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": "first"} }
option:
/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/
foo(bar, baz,
baz, boop, beep);
ArrayExpression
Examples of incorrect code for this rule with the 2, { "ArrayExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/
var foo = [
bar,
baz,
qux
];
Examples of correct code for this rule with the 2, { "ArrayExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/
var foo = [
bar,
baz,
qux
];
Examples of incorrect code for this rule with the 2, { "ArrayExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/
var foo = [bar,
baz,
qux
];
Examples of correct code for this rule with the 2, { "ArrayExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/
var foo = [bar,
baz,
qux
];
ObjectExpression
Examples of incorrect code for this rule with the 2, { "ObjectExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/
var foo = {
bar: 1,
baz: 2,
qux: 3
};
Examples of correct code for this rule with the 2, { "ObjectExpression": 1 }
option:
/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/
var foo = {
bar: 1,
baz: 2,
qux: 3
};
Examples of incorrect code for this rule with the 2, { "ObjectExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/
var foo = { bar: 1,
baz: 2 };
Examples of correct code for this rule with the 2, { "ObjectExpression": "first" }
option:
/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/
var foo = { bar: 1,
baz: 2 };
Compatibility
-
JSHint:
indent
- JSCS: validateIndentation Source: http://eslint.org/docs/rules/
'_callback' is assigned a value but never used. Open
var _callback;
- Read upRead up
- Exclude checks
Disallow Unused Variables (no-unused-vars)
Variables that are declared and not used anywhere in the code are most likely an error due to incomplete refactoring. Such variables take up space in the code and can lead to confusion by readers.
Rule Details
This rule is aimed at eliminating unused variables, functions, and parameters of functions.
A variable is considered to be used if any of the following are true:
- It represents a function that is called (
doSomething()
) - It is read (
var y = x
) - It is passed into a function as an argument (
doSomething(x)
) - It is read inside of a function that is passed to another function (
doSomething(function() { foo(); })
)
A variable is not considered to be used if it is only ever assigned to (var x = 5
) or declared.
Examples of incorrect code for this rule:
/*eslint no-unused-vars: "error"*/
/*global some_unused_var*/
// It checks variables you have defined as global
some_unused_var = 42;
var x;
// Write-only variables are not considered as used.
var y = 10;
y = 5;
// A read for a modification of itself is not considered as used.
var z = 0;
z = z + 1;
// By default, unused arguments cause warnings.
(function(foo) {
return 5;
})();
// Unused recursive functions also cause warnings.
function fact(n) {
if (n < 2) return 1;
return n * fact(n - 1);
}
// When a function definition destructures an array, unused entries from the array also cause warnings.
function getY([x, y]) {
return y;
}
Examples of correct code for this rule:
/*eslint no-unused-vars: "error"*/
var x = 10;
alert(x);
// foo is considered used here
myFunc(function foo() {
// ...
}.bind(this));
(function(foo) {
return foo;
})();
var myFunc;
myFunc = setTimeout(function() {
// myFunc is considered used
myFunc();
}, 50);
// Only the second argument from the descructured array is used.
function getY([, y]) {
return y;
}
exported
In environments outside of CommonJS or ECMAScript modules, you may use var
to create a global variable that may be used by other scripts. You can use the /* exported variableName */
comment block to indicate that this variable is being exported and therefore should not be considered unused.
Note that /* exported */
has no effect for any of the following:
- when the environment is
node
orcommonjs
- when
parserOptions.sourceType
ismodule
- when
ecmaFeatures.globalReturn
istrue
The line comment // exported variableName
will not work as exported
is not line-specific.
Examples of correct code for /* exported variableName */
operation:
/* exported global_var */
var global_var = 42;
Options
This rule takes one argument which can be a string or an object. The string settings are the same as those of the vars
property (explained below).
By default this rule is enabled with all
option for variables and after-used
for arguments.
{
"rules": {
"no-unused-vars": ["error", { "vars": "all", "args": "after-used", "ignoreRestSiblings": false }]
}
}
vars
The vars
option has two settings:
-
all
checks all variables for usage, including those in the global scope. This is the default setting. -
local
checks only that locally-declared variables are used but will allow global variables to be unused.
vars: local
Examples of correct code for the { "vars": "local" }
option:
/*eslint no-unused-vars: ["error", { "vars": "local" }]*/
/*global some_unused_var */
some_unused_var = 42;
varsIgnorePattern
The varsIgnorePattern
option specifies exceptions not to check for usage: variables whose names match a regexp pattern. For example, variables whose names contain ignored
or Ignored
.
Examples of correct code for the { "varsIgnorePattern": "[iI]gnored" }
option:
/*eslint no-unused-vars: ["error", { "varsIgnorePattern": "[iI]gnored" }]*/
var firstVarIgnored = 1;
var secondVar = 2;
console.log(secondVar);
args
The args
option has three settings:
-
after-used
- only the last argument must be used. This allows you, for instance, to have two named parameters to a function and as long as you use the second argument, ESLint will not warn you about the first. This is the default setting. -
all
- all named arguments must be used. -
none
- do not check arguments.
args: after-used
Examples of incorrect code for the default { "args": "after-used" }
option:
/*eslint no-unused-vars: ["error", { "args": "after-used" }]*/
// 1 error
// "baz" is defined but never used
(function(foo, bar, baz) {
return bar;
})();
Examples of correct code for the default { "args": "after-used" }
option:
/*eslint no-unused-vars: ["error", {"args": "after-used"}]*/
(function(foo, bar, baz) {
return baz;
})();
args: all
Examples of incorrect code for the { "args": "all" }
option:
/*eslint no-unused-vars: ["error", { "args": "all" }]*/
// 2 errors
// "foo" is defined but never used
// "baz" is defined but never used
(function(foo, bar, baz) {
return bar;
})();
args: none
Examples of correct code for the { "args": "none" }
option:
/*eslint no-unused-vars: ["error", { "args": "none" }]*/
(function(foo, bar, baz) {
return bar;
})();
ignoreRestSiblings
The ignoreRestSiblings
option is a boolean (default: false
). Using a Rest Property it is possible to "omit" properties from an object, but by default the sibling properties are marked as "unused". With this option enabled the rest property's siblings are ignored.
Examples of correct code for the { "ignoreRestSiblings": true }
option:
/*eslint no-unused-vars: ["error", { "ignoreRestSiblings": true }]*/
// 'type' is ignored because it has a rest property sibling.
var { type, ...coords } = data;
argsIgnorePattern
The argsIgnorePattern
option specifies exceptions not to check for usage: arguments whose names match a regexp pattern. For example, variables whose names begin with an underscore.
Examples of correct code for the { "argsIgnorePattern": "^_" }
option:
/*eslint no-unused-vars: ["error", { "argsIgnorePattern": "^_" }]*/
function foo(x, _y) {
return x + 1;
}
foo();
caughtErrors
The caughtErrors
option is used for catch
block arguments validation.
It has two settings:
-
none
- do not check error objects. This is the default setting. -
all
- all named arguments must be used.
caughtErrors: none
Not specifying this rule is equivalent of assigning it to none
.
Examples of correct code for the { "caughtErrors": "none" }
option:
/*eslint no-unused-vars: ["error", { "caughtErrors": "none" }]*/
try {
//...
} catch (err) {
console.error("errors");
}
caughtErrors: all
Examples of incorrect code for the { "caughtErrors": "all" }
option:
/*eslint no-unused-vars: ["error", { "caughtErrors": "all" }]*/
// 1 error
// "err" is defined but never used
try {
//...
} catch (err) {
console.error("errors");
}
caughtErrorsIgnorePattern
The caughtErrorsIgnorePattern
option specifies exceptions not to check for usage: catch arguments whose names match a regexp pattern. For example, variables whose names begin with a string 'ignore'.
Examples of correct code for the { "caughtErrorsIgnorePattern": "^ignore" }
option:
/*eslint no-unused-vars: ["error", { "caughtErrorsIgnorePattern": "^ignore" }]*/
try {
//...
} catch (ignoreErr) {
console.error("errors");
}
When Not To Use It
If you don't want to be notified about unused variables or function arguments, you can safely turn this rule off. Source: http://eslint.org/docs/rules/