eslint-plugin-array-func

Rules for Array functions and methods.

Contents

• Installation
• Rules
  • from-map
    • Examples
    • Using the rule
  • no-unnecessary-this-arg
    • Checked Functions
    • Checked Methods
    • Examples
    • Using the rule
  • prefer-array-from
    • Examples
    • Using the rule
  • avoid-reverse
    • Examples
    • Using the rule
  • prefer-flat-map
    • Examples
    • Using the rule
  • prefer-flat
    • Examples
    • Using the rule
• Configurations
  • array-func/recommended Configuration
    • Using the Configuration
  • array-func/all Configuration
    • Using the Configuration
• License

Installation

Install ESLint either locally or globally.

1$ npm install -D eslint

If you installed ESLint globally, you have to install the array-func plugin globally too. Otherwise, install it locally.

1$ npm install -D eslint-plugin-array-func

Rules

from-map

Prefer using the mapFn callback of Array.from over an immediate .map() call on the Array.from result.

Array.from has a mapFn callback that lets you map the items of the iterable to an array like you would with .map() except that values have not yet been truncated to fit types allowed in an array. Some iterables can't be directly converted to an array and thus have to be iterated either way. In that case using the mapping callback of Array.from avoids an iteration. See also MDN for an explanation of the potential benefits of using the mapping callback of Array.from directly.

This rule is auto fixable. It will produce nested function calls if you use the Array.from map callback and have a .map() call following it.

Examples

Code that triggers this rule:

1Array.from(iterable).map((t) => t.id);
2
3Array.from(iterable, (t) => t.id).map((id) => id[0]);

Code that doesn't trigger this rule:

1Array.from(iterable, (t) => t.id);
2
3Array.from(iterable, function(t) { this.format(t); }, this);
4
5const arr = Array.from(iterable);
6const mappedArray = arr.map((t) => t.id);

Using the rule

To use this rule, your eslint.config.js should at least contain the following:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  {
5    plugins: {
6      "array-func": arrayFunc
7    },
8    rules: {
9      "array-func/from-map": "error"
10    }
11  }
12];

Alternatively you can use a configuration included with this plugin.

no-unnecessary-this-arg

Avoid the this parameter when providing arrow function as callback in array functions.

The this parameter is useless when providing arrow functions, since the this of arrow functions can not be rebound, thus the parameter has no effect.

The fix is usually to omit the parameter. The Array methods can't be auto-fixed, since the detection of array methods is not confident enough to know that the method is being called on an array.

Checked Functions

• from (fixable)

Checked Methods

• every
• filter
• find
• findIndex
• forEach
• map
• some

Examples

Code that triggers this rule:

1const array = Array.from("example", (char) => char.charCodeAt(0), this);
2
3const e = array.find((char) => char === 101, this);
4
5const exampleAsArray = array.map((char) => String.fromCharCode(char), this);
6
7const eIndex = array.findIndex((char) => char === 101, this);
8
9const containsE = array.some((char) => char === 101, this);
10
11const isOnlyE = array.every((char) => char === 101, this);
12
13const onlyEs = array.filter((char) => char === 101, this);
14
15array.forEach((char) => console.log(char), this);

Code that doesn't trigger this rule:

1const array = Array.from("example", (char) => char.charCodeAt(0));
2const alternateArray = Array.from("example", function(char) {
3    return char.charCodeAt(this)
4}, 0);
5
6const e = array.find((char) => char === 101);
7
8const exampleAsArray = array.map((char) => String.fromCharCode(char));
9
10const eIndex = array.findIndex((char) => char === 101);
11
12const containsE = array.some((char) => char === 101);
13
14const isOnlyE = array.every((char) => char === 101);
15
16const onlyEs = array.filter(function(char) {
17    return char === this
18}, 101);
19
20array.forEach(function(char) {
21    this.log(char);
22}, console);
23
24array.filter(this.isGood, this);

Using the rule

To use this rule, your eslint.config.js should at least contain the following:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  {
5    plugins: {
6      "array-func": arrayFunc
7    },
8    rules: {
9      "array-func/no-unnecessary-this-arg": "error"
10    }
11  }
12];

Alternatively you can use a configuration included with this plugin.

prefer-array-from

Use Array.from instead of [...iterable]. See from-map for additional benefits Array.from can provide over the spread syntax.

This rule is auto fixable.

Examples

Code that triggers this rule:

1const iterable = [..."string"];
2
3const arrayCopy = [...iterable];

Code that doesn't trigger this rule:

1const array = [1, 2, 3];
2
3const extendedArray =  [0, ...array];
4
5const arrayCopy = Array.from(array);
6
7const characterArray = Array.from("string");

Using the rule

To use this rule, your eslint.config.js should at least contain the following:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  {
5    plugins: {
6      "array-func": arrayFunc
7    },
8    rules: {
9      "array-func/prefer-array-from": "error"
10    }
11  }
12];

Alternatively you can use a configuration included with this plugin.

avoid-reverse

Avoid reversing the array and running a method on it if there is an equivalent of the method operating on the array from the other end.

There are two operations with such equivalents: reduce with reduceRight.

This rule is auto fixable.

Examples

Code that triggers this rule:

1const string = array.reverse().reduce((p, c) => p + c, '');
2
3const reverseString = array.reverse().reduceRight((p, c) => p + c, '');

Code that doesn't trigger this rule:

1const reverseString = array.reduce((p, c) => p + c, '');
2
3const string = array.reduceRight((p, c) => p + c, '');
4
5const reverseArray = array.reverse();
6
7const reverseMap = array.reverse().map((r) => r + 1);

Using the rule

To use this rule, your eslint.config.js should at least contain the following:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  {
5    plugins: {
6      "array-func": arrayFunc
7    },
8    rules: {
9      "array-func/avoid-reverse": "error"
10    }
11  }
12];

Alternatively you can use a configuration included with this plugin.

prefer-flat-map

Use .flatMap() to map and then flatten an array instead of using .map().flat().

This rule is auto fixable.

Examples

Code that triggers this rule:

1const mappedAndFlattened = array.map((p) => p).flat();
2
3const flatWithDefaultDepth = array.map((r) => r).flat(1);

Code that doesn't trigger this rule:

1const oneAction = array.flatMap((m) => m);
2
3const flattened = array.flat();
4
5const mapped = array.map((r) => r + 1);
6
7const flattenedThenMapped = array.flat().map((r) => r + 1);
8
9const flatMappedWithExtra = array.map((r) => r + 1).reverse().flat();
10
11const flatWithDepth = array.map((p) => p).flat(99);

Using the rule

To use this rule, your eslint.config.js should at least contain the following:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  {
5    plugins: {
6      "array-func": arrayFunc
7    },
8    rules: {
9      "array-func/prefer-flat-map": "error"
10    }
11  }
12];

Alternatively you can use a configuration included with this plugin.

prefer-flat

Use .flat() to flatten an array of arrays. This rule currently recognizes two patterns and can replace them with a .flat() call:

• [].concat(...array)
• array.reduce((p, n) => p.concat(n), [])

This rule is auto fixable.

Examples

Code that triggers this rule:

1const concatFlat = [].concat(...array);
2
3const reduceFlat = array.reduce((p, n) => p.concat(n), []);

Code that doesn't trigger this rule:

1const flattened = array.flat();
2
3const reverseFlat = array.reduce((p, n) => n.concat(p), []);
4
5const otherReduce = array.reduce((p, n) => n + p, 0);

Using the rule

To use this rule, your eslint.config.js should at least contain the following:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  {
5    plugins: {
6      "array-func": arrayFunc
7    },
8    rules: {
9      "array-func/prefer-flat": "error"
10    }
11  }
12];

Alternatively you can use a configuration included with this plugin.

Configurations

recommended Configuration

Rule	Error level	Fixable
array-func/from-map	Error	Yes
array-func/no-unnecessary-this-arg	Error	Sometimes
array-func/prefer-array-from	Error	Yes
array-func/avoid-reverse	Error	Yes

Using the Configuration

To enable this configuration, import the plugin and add the config to your eslint config array:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  arrayFunc.configs.recommended,
5];

all Configuration

The recommended configuration does not include all rules, since some Array methods were added after ES2015. The all configuration enables all rules the plugin containsy.

Rule	Error level	Fixable
array-func/from-map	Error	Yes
array-func/no-unnecessary-this-arg	Error	Sometimes
array-func/prefer-array-from	Error	Yes
array-func/avoid-reverse	Error	Yes
array-func/prefer-flat-map	Error	Yes
array-func/prefer-flat	Error	Yes

Using the Configuration

To enable this configuration, import the plugin and add the config to your eslint config array:

1import arrayFunc from "eslint-plugin-array-func";
2
3export default [
4  arrayFunc.configs.all,
5];

License

The array-func plugin is licensed under the MIT License.