Code Inspections in JavaScript and TypeScript
This topic lists all PhpStorm code inspections available in JavaScript and TypeScript.
You can toggle specific inspections or change their severity level on the Editor | Inspections page of the IDE settings Ctrl+Alt+S.
DOM issues
Inspection | Description | Default Severity |
---|---|---|
Reports a method call to | ||
Reports a common JavaScript pattern for detecting the browser or operating system in which the script is run. In addition to pointing out non-portable constructs, these platform detection patterns are often incomplete and easily fooled. For most cases, detection of individual environment features is preferable to attempting to detect the entire platform.
| ||
Reports common JavaScript DOM patterns which may present problems with XHTML documents. In particular, the patterns detected will behave completely differently depending on whether the document is loaded as XML or HTML. This can result in subtle bugs where script behaviour is dependent on the MIME-type of the document, rather than its content. Patterns detected include document.body, document.images, document.applets, document.links, document.forms, and document.anchors. | ||
Reports a JavaScript access to DOM nodes as text using the |
Imports and dependencies
Inspection | Description | Default Severity |
---|---|---|
Reports a dependency from package.json that is not installed or doesn't match the specified version range. | Warning | |
Reports a usage of a JSX construction without importing React namespace. Having React namespace in the file scope ensures proper code compilation. | Weak warning | |
Reports a module from a | Weak warning | |
Reports a redundant | Warning |
Code quality tools
Inspection | Description | Default Severity |
---|---|---|
Reports a discrepancy detected by the ESLint linter. | ||
Reports a problem detected by the JSHint linter. | ||
Reports a discrepancy detected by the JavaScript Standard Style linter. | ||
Reports a discrepancy detected by the TSLint linter. |
Assignment issues
Inspection | Description | Default Severity |
---|---|---|
Reports an assignment operation that can be replaced by an operator assignment to make your code shorter and probably clearer. x = x + 3; x = x / 3; After the quick fix is applied the result looks like: x += 3; x /= 3; | ||
Reports an assignment to a variable declared as a | ||
Reports an assignment to a function parameter, including increment and decrement operations. Although occasionally intended, this construct can be extremely confusing, and is often a result of an error. | ||
Reports an assignment that is used as the condition of an | Warning | |
Reports an assignment expression nested inside another expression, for example, | ||
Reports an assignment expression where the result of the assignment is used in the containing expression. Such assignments often indicate coding errors, for example, | ||
Reports an assignment in the form | Warning |
Potentially confusing code constructs
Inspection | Description | Default Severity |
---|---|---|
Reports any floating point number that does not have a decimal point, or any numbers before the decimal point, or and numbers after the decimal point. Such literals may be confusing, and violate several coding standards. | ||
Reports a suspicious combination of | ||
Reports a call of the | ||
Reports a "magic number" that is a numeric literal used without being named by a constant declaration. Magic numbers can result in code whose intention is unclear, and may result in errors if a magic number is changed in one code location but remains uncahnged in another. The numbers 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1000, 0.0 and 1.0 are ignored. | ||
Reports if statements which have an else branch and a negated condition. Flipping the order of the if and else branches will usually increase the clarity of such statements. | ||
Reports a conditional expression whose condition is negated. Suggests flipping the order of branches in the conditional expression to increase the clarity of the statement. Example: | ||
Reports a ternary conditional expression within another ternary condition. Such nested conditionals may be extremely confusing, and best replaced by more explicit conditional logic. | ||
Reports a function nested inside another function. Although JavaScript allows functions to be nested, such constructs may be confusing. | ||
Reports an arithmetic expression with too many terms. Such expressions may be confusing and bug-prone. | ||
Reports a boolean expression with too many terms. Such expressions may be confusing and bug-prone. | ||
Reports an arithmetic expression that include adding or subtracting zero, multiplying by zero or one, division by one, and shift by zero. Such expressions may result from not fully completed automated refactoring. | Warning | |
Reports an increment ( | ||
Reports an | Warning | |
Reports a block statement that is not used as the body of | ||
Reports a usage of the | Warning |
Node.js
Inspection | Description | Default Severity |
---|---|---|
Suggests configuring coding assistance for Node.js, for example, | Warning |
Unit testing
Inspection | Description | Default Severity |
---|---|---|
Reports a failed method call or an assertion in a test. | Warning |
Async code and promises
Inspection | Description | Default Severity |
---|---|---|
Reports a usage of | Weak warning | |
Reports an
async function bar() { /* ... */ }
async function foo() {
bar(); // bad
}
After the quick-fix is applied, the await prefix is added:
async function bar() { /* ... */ }
async function foo() {
await bar(); // good
}
When the 'Report for promises in return statements' checkbox is selected, also suggests adding await in return statements. While this is generally not necessary, it gives two main benefits.
| Weak warning | |
Reports a redundant usage of
| Weak warning | |
Reports a function call that returns a | Weak warning | |
Reports a usage of a top-level |
Validity issues
Inspection | Description | Default Severity |
---|---|---|
Reports a | Warning | |
Reports reassigning a value to a constant or a readonly variable. | Error | |
Reports an expression statement that is neither an assignment nor a call. Such statements usually indicate an error. | Weak warning | |
Reports a function that returns a value in some cases while in other cases no value is returned. This usually indicates an error.
function foo() {
if (true)
return 3;
return;
}
| ||
Reports a deprecated octal integer literal prefixed with | Error | |
Reports a JavaScript reserved word used as a name. The JavaScript specification reserves a number of words which are currently not used as keywords. Using those words as identifiers may result in broken code if later versions of JavaScript start using them as keywords. | Warning | |
Reports a string literal that contains a |
Data flow
Inspection | Description | Default Severity |
---|---|---|
Reports am unnecessary local variable that does not make a function more comprehensible:
Use the checkbox below to have this inspection ignore variables that are immediately returned or thrown. Some coding styles suggest using such variables for clarity and ease of debugging. | Warning | |
Reports reusing a local variable and overwriting its value with a new value that is not related to the original variable usage. Reusing a local variable in this way may be confusing because the intended semantics of the local variable may vary with each usage. It may also cause bugs, if code changes result in values that were expected to be overwritten while they are actually live. It is good practices to keep variable lifetimes as short as possible, and not reuse local variables for the sake of brevity. |
TypeScript
Inspection | Description | Default Severity |
---|---|---|
Reports a public constructor of an abstract class and suggests making it protected (because it is useless to have it public). | Weak warning | |
Reports a common mistake in TypeScript code, when a class field is declared as a constructor parameter, and then this parameter is assigned.
class Foo {
constructor(private p: number) {
p = 1; //must be this.p = 1;
}
}
| Warning | |
Reports a duplicate type inside a union or intersection. | Warning | |
Reports a type annotation that doesn't match the current code style for explicit types. | No highlighting, only fix | |
Reports a private field that can be made readonly (for example, if the field is assigned only in the constructor). | Weak warning | |
Reports inconsistency of a | Warning | |
Reports an invalid type argument in a function, interface, or class declaration. | Error | |
Reports a usage from augmentation module without an explicit import. | No highlighting, only fix | |
Reports a TypeScript library file that is required for a symbol but is not listed under the | Error | |
Reports a usage that requires an explicit option in | Warning | |
Reports a usage of a variable where the variable type is narrowed by a type guard. Note that severity level doesn't affect this inspection. | Warning | |
Reports a type argument that is equal to the default one and can be removed.
type Foo<T=number> = T;
let z: Foo<number>;
| Weak warning | |
Reports a usages of a UMD global variable if the current file is a module (EcmaScript or CommonJS). Referencing UMD variables without explicit imports can lead to a runtime error if the library isn't included implicitly. | Weak warning | |
Reports a parameter, return value, or assigned expression of incorrect type. | Error | |
Reports a function call with a parameter, return value, or assigned expression or incorrect type, if the context symbol can be implicitly resolved to the
declare var test: any;
test.hasOwnProperty(true); //reports 'true'
| Weak warning | |
Reports an unreesolved reference to a JSX (React) component. Suggests adding an import statement if the referenced component is defined in the project or its dependencies or creating a new component with the specified name. | Weak warning | |
Reports a call of a function that is not resolved. | Weak warning | |
Reports an unresolved reference to a variable or field. | Weak warning | |
Reports an unresolved name or binding in an | Error |
Probable bugs
Inspection | Description | Default Severity |
---|---|---|
'for' loop where update or condition does not use loop variable | Reports a | |
Reports a comparison of a | Warning | |
Reports a comparison with operands of incompatible types or an operand with a type without possible common values. | Weak warning | |
Reports a comparison with NaN. Comparisons like | Warning | |
Reports a consecutive comma in an array literal. The skipped element accepts the | Warning | |
Reports a constructor function that returns a primitive value. When called with | ||
Reports division by zero or a remainder by zero. | ||
Reports a usage of an equality operator that may cause unexpected type coercions. Suggests replacing
| Warning | |
Reports a | Warning | |
Reports a function which must either recurse infinitely or throw an exception. Such functions may not return normally. | Warning | |
Reports a potentially invalid indexed property access, for example, | Warning | |
Reports a usage of a potentially invalid constructor function, for example: a function that is not a constructor after | Warning | |
Reports a
function Outer() {
this.outerProp = 1;
function inner() {
// bad, because 'outerProp' of Outer
// won't be updated here
// on calling 'new Outer()' as may be expected
this.outerProp = 2;
}
inner();
}
| Warning | |
Potentially invalid reference to 'this' of a class from closure | Reports an attempt to reference a member of an ECMAScript class via the | Warning |
Reports object allocation where the result of the allocated object is ignored, for example, | ||
Reports an assignment in the form | Warning | |
Reports | Warning | |
Reports an assignment or a function call where the name of the target variable or the function parameter does not match the name of the value assigned to it.
var x = 0;
var y = x;
or
var x = 0, y = 0;
var rc = new Rectangle(y, x, 20, 20);
Specify the names that should not be used together. An error is reported if a parameter name or an assignment target name contains words from one group while the name of the assigned or passed variable contains words from another group. | Warning | |
Reports a return value of a function that doesn't return anything. Calling of such functions always produces an
let a = console.log('foo');
The following usages are ignored:
| Warning |
Control flow issues
Inspection | Description | Default Severity |
---|---|---|
Reports a
for(; exitCondition(); ) {
process();
}
After the quick-fix is applied the result looks like:
while(exitCondition()) {
process();
}
Use the checkbox below if you wish this inspection to ignore for loops with trivial or non-existent conditions. | ||
Reports an | ||
Reports an | ||
Reports a ternary conditional expression with identical | ||
Reports a conditional expression in the format | Warning | |
Reports duplicate conditions in different branches of an
if (a) {
...
} else if (a) {
...
}
| ||
Reports a | Warning | |
Reports an error caused by invoking a method, accessing a property, or calling a function on an object that is | Warning | |
Reports a pointless or pointlessly complicated boolean expression or statement.
let a = !(false && x);
let b = false || x;
After the quick fix is applied the result looks like:
let a = true;
let b = x;
| Warning | |
Reports an
if(foo())
{
return true;
}
else
{
return false;
}
After applying the quick-fix the code looks as follows: return foo(); | Warning | |
Reports a conditional expression of the form
condition
? true : false
condition
? false : true
These expressions may be safely converted to
condition
!
condition
| Warning | |
Reports a tail recursion, that is, when a function calls itself as its last action before returning. A tail recursion can always be replaced by looping, which will be considerably faster. Some JavaScript engines perform this optimization, while others do not. Thus, tail recursive solutions may have considerably different performance characteristics in different environments. | ||
Reports an unnecessary | Warning | |
Reports an unnecessary | Warning | |
Reports an unused label. | Warning | |
Reports a labeled | Warning | |
Reports a labeled | Warning | |
Reports code that can never be executed, which almost certainly indicates an error | Warning | |
Reports a
The x instanceof A type guard can be unsound in one of the following two cases:
| Warning |
Try statement issues
Inspection | Description | Default Severity |
---|---|---|
Reports a | Warning | |
Reports a | Warning | |
Reports s | Warning | |
Reports an empty | ||
Reports an empty | ||
Reports an empty | ||
Reports a | Warning | |
Reports a |
Naming conventions
Inspection | Description | Default Severity |
---|---|---|
Reports a class or a function that is annotated with a JSDoc | ||
Reports a function whose name is too short, too long, or does not follow the specified regular expression pattern. | ||
Reports a function parameter whose name is too short, too long, or doesn't follow the specified regular expression pattern. | ||
Reports a non-ASCII symbol in a name. | Warning | |
Reports a local variable whose name is too short, too long, or doesn't follow the specified regular expression pattern. |
Flow type checker
Inspection | Description | Default Severity |
---|---|---|
Reports a JavaScript code fragment that is not covered by the Flow type checker. To use this inspection, configure the Flow executable in Settings | Languages & Frameworks | JavaScript. | ||
Reports errors from Flow. | ||
Reports a | Warning | |
Reports a JavaScript file with a | Warning |
Function metrics
Inspection | Description | Default Severity |
---|---|---|
Reports a function with three or more negation operations ( | ||
Reports a function with multiple loop statements. | ||
Reports a function with multiple return points. Such functions are hard to understand and maintain. | ||
Reports a function with too many parameters. Such functions often indicate problems with design. | ||
Reports a function with too many branching points in a function (too high cyclomatic complexity). Such functions may be confusing and hard to test. | ||
Reports an overly long function. Function length is calculated by counting up the number of non-empty statements in the function. Functions that are too long are error-prone and difficult to test. | ||
Reports a function whose body contains statements that are too deeply nested within other statements. Such functions may be confusing and indicate that refactoring may be necessary. |
Code style issues
Inspection | Description | Default Severity |
---|---|---|
Checks that declarations of local variables declared with var are at the top of a function scope. | ||
Reports a chained equality comparison (i.e. | ||
Reports a function call whose target is another function call, for example, | ||
Reports a comparison operation with a constant value in the left-hand side. According to coding conventions, constants should be in the right-hand side of comparisons. | ||
Reports a comparison operation with a constant in the right-hand side. According to coding conventions, constants should only be in the left-hand side of comparisons. | ||
Reports a function call that is used as an argument in another function call, for example, | ||
Reports an arrow function whose body only consists of braces and exactly one statement. Suggests converting to concise syntax without braces. | No highlighting, only fix | |
Reports a | ||
Reports an assignment to a property that is not defined in the type of a variable.
/**
* @type {{ property1: string, property2: number }}
*/
let myVariable = create();
myVariable.newProperty = 3; // bad
| Weak warning | |
Reports redundant parentheses. | No highlighting, only fix | |
Reports a statement without a semicolon or a newline at the end. |
General
Inspection | Description | Default Severity |
---|---|---|
Reports | Error | |
Reports a usage of a deprecated function variable. | Weak warning | |
Reports multiple destructuring properties with identical keys. Suggests merging the properties. | Weak warning | |
Reports multiple declarations in a scope. | Warning | |
Reports basic syntax issues and inconsistencies with language specification, such as invalid usages of keywords, usages of incompatible numeric format, or multiple parameters to getters/setters. | Error | |
Reports an implicit declaration of a global variable.
var aaa = 1; // good
bbb = 2; // bad, if bbb is not declared with 'var' somewhere
| Weak warning | |
Reports an ES6 import whose | Warning | |
Reports a reference to a JavaScript member that is marked with s | Warning | |
Reports warnings implied by Google Closure Compiler annotations including correct use of | Warning | |
Reports a duplicated jQuery selector that can be cached or a usage of an attribute or a pseudo-selector (optional). | Warning | |
Reports a class method that can be safely made | Warning | |
Reports mismatch between the names and the number of parameters within a JSDoc comment and the actual parameters of a function. | Warning | |
Reports a collection of fields or variables whose contents are either queried and not updated or updated and not queried. Such mismatched queries and updates are pointless and may indicate either dead code or a typographical error. | Warning | |
Reports a URL of an external JavaScript library that is not associated with any locally stored file. Suggests downloading the library. Such association enables the IDE to provide proper code completion and navigation. | Warning | |
Reports a JavaScript file that is not in the | ||
Reports an improper usage of a wrapper for primitive types or a property of a primitive type being modified, as in the latter case the assigned value will be lost. | Warning | |
Reports an object property that can be converted to ES6 shorthand style and provides a quick-fix to do it. | No highlighting, only fix | |
Reports a usage of a React JSX tag in JavaScript code. | ||
Reports nested instances of a string or a template literal. Suggests inlining the nested instances into the containing template string. | Weak warning | |
Reports access to outer mutable variables from functions.
for (var i = 1; i <= 3; i++) {
setTimeout(function() {
console.log(i); // bad
}, 0);
}
| Warning | |
Reports a JavaScript call expression where the arguments do not match the signature of the referenced function, including the types of arguments and their number. Also, reports if the overloading function doesn't match the overloaded one in terms of parameters and return types. | Weak warning | |
Reports a syntax discrepancy in a documentation comment. | Warning | |
Reports unfiltered
Object.prototype.myMethod = function myMethod() {};
let a = { foo: 42 };
for (let i in a) {
console.log(a[i]);
}
Suggests replacing the whole loop with a Object.keys() method or adding a hasOwnProperty() check. After applying the quick-fix the code looks as follows:
for (let i in a) {
if (a.hasOwnProperty(i)) {
console.log(a[i]);
}
}
| ||
Reports an unneeded semicolon. | Warning | |
Reports a usage of a trailing comma in an array literal. | Warning | |
Reports usages of a trailing comma in object literals. | Warning | |
Reports an Ext JS | Warning | |
Reports an unresolved function in a call. | Weak warning | |
Reports an unresolved referenced variable or field. | Weak warning | |
Reports an unresolved file reference in a JavaScript file, including CommonJS and AMD modules references. | Warning | |
Reports a class member initializer which references another non-hoisted class member while the latter may be not initialized yet. | Warning | |
Variable declaration can be merged with the first assignment to the variable | Reports a variable that is declared without an initializer and is used much further in the code or in a single nested scope. Suggests moving the variable closer to its usages and joining it with the initializer expression. | No highlighting, only fix |
Validates options in webpack config files (which name should start with `webpack`, e.g. `webpack.config.js`) against webpack options schema. | Warning |
ES2015 migration aids
Inspection | Description | Default Severity |
---|---|---|
Reports a usage of a | No highlighting, only fix | |
Reports a | No highlighting, only fix | |
Reports a | No highlighting, only fix | |
Reports a | No highlighting, only fix | |
Reports a | Weak warning | |
Reports a function expression. Suggests converting it to an arrow function. arr.map(function(el) {return el + 1}) After applying the quick-fix the code looks as follows: arr.map(el => el + 1) | No highlighting, only fix | |
Reports an indexed | No highlighting, only fix | |
Reports a string concatenation. Suggests replacing it with a template literal "result: " + a + "." After applying the quick-fix the code looks as follows: `result: ${a}.` | No highlighting, only fix |
Switch statement issues
Inspection | Description | Default Severity |
---|---|---|
Reports a | ||
Reports a | No highlighting, only fix | |
Reports a | No highlighting, only fix | |
Reports a | No highlighting, only fix | |
Reports a duplicated | Warning | |
Reports a | Warning | |
Reports a | ||
Reports a labeled statement inside a
switch(x)
{
case 1:
case2: //typo!
case 3:
break;
}
| ||
Reports an unreachable
/**
* @param {('foo' | 'bar')} p
*/
function foo(p) {
switch (p) {
case 'foo': break;
case 'bar': break;
case 'baz': break; // unreachable
}
}
| Warning | |
Variable is declared and being used in different 'case' clauses | Reports a variable that is declared in one | Warning |
Bitwise operation issues
Inspection | Description | Default Severity |
---|---|---|
Reports an expression that includes | ||
Reports a suspicious usage of a bitwise AND (" | Warning | |
Reports a bitwise mask expression which for sure evaluates to
// Incompatible mask: as the last byte in mask is zero,
// something like 0x1200 would be possible, but not 0x1234
if ((mask & 0xFF00) == 0x1234) {...}
| Warning | |
Reports a shift operation where the second operand is a constant outside the reasonable range, for example, an integer shift operation outside the range | Warning |
Unused symbols
Inspection | Description | Default Severity |
---|---|---|
Reports a variable whose value is never used after assignment.
| Warning | |
Reports an unused globally accessible public function, variable, class, or property. | Warning | |
Reports an unused locally accessible parameter, local variable, function, class, or private member declaration. | Warning |
Potentially undesirable code constructs
Inspection | Description | Default Severity |
---|---|---|
Reports a | ||
Reports a labeled | ||
Reports a | ||
Reports a labeled | ||
Reports a | ||
Reports a | ||
Reports a | Warning | |
Reports an anonymous function. An explicit name of a function expression may be helpful for debugging. Ignores function expressions without names if they have a | ||
Reports a comma expression. Such expressions are often a sign of overly clever code, and may lead to subtle bugs. Comma expressions in the initializer or in the update section of | Warning | |
Reports a ternary conditional expression. Some coding standards prohibit such expressions in favor of explicit | ||
Reports a labeled statement. |