array-callback-return

強制在陣列方法的 callback 中使用 return 陳述式

💡

此規則報告的一些問題可以透過編輯器的建議手動修正

Array 有幾種用於過濾、映射和摺疊的方法。如果我們忘記在這些方法的 callback 中寫入 return 陳述式，這可能是一個錯誤。如果您不想使用 return 或不需要回傳的結果，請考慮改用 .forEach。

// example: convert ['a', 'b', 'c'] --> {a: 0, b: 1, c: 2}
var indexMap = myArray.reduce(function(memo, item, index) {
  memo[item] = index;
}, {}); // Error: cannot set property 'b' of undefined
1
2
3
4

規則細節

此規則強制在陣列方法的 callback 中使用 return 陳述式。此外，它還可以透過使用 checkForEach 選項，強制 forEach 陣列方法的回呼函式不回傳值。

此規則會找到以下方法的回呼函式，然後檢查 return 陳述式的使用情況。

Array.from
Array.prototype.every
Array.prototype.filter
Array.prototype.find
Array.prototype.findIndex
Array.prototype.findLast
Array.prototype.findLastIndex
Array.prototype.flatMap
Array.prototype.forEach（可選，基於 checkForEach 參數）
Array.prototype.map
Array.prototype.reduce
Array.prototype.reduceRight
Array.prototype.some
Array.prototype.sort
Array.prototype.toSorted
以及上述的類型陣列。

此規則的不正確程式碼範例

在遊樂場中開啟

/*eslint array-callback-return: "error"*/

var indexMap = myArray.reduce(function(memo, item, index) {
    memo[item] = index;
}, {});

var foo = Array.from(nodes, function(node) {
    if (node.tagName === "DIV") {
        return true;
    }
});

var bar = foo.filter(function(x) {
    if (x) {
        return true;
    } else {
        return;
    }
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

此規則的正確程式碼範例

在遊樂場中開啟

/*eslint array-callback-return: "error"*/

var indexMap = myArray.reduce(function(memo, item, index) {
    memo[item] = index;
    return memo;
}, {});

var foo = Array.from(nodes, function(node) {
    if (node.tagName === "DIV") {
        return true;
    }
    return false;
});

var bar = foo.map(node => node.getAttribute("id"));
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

選項

此規則接受一個包含三個選項的設定物件

"allowImplicit": false (預設) 當設定為 true 時，允許需要回傳值的方法的回呼函式，透過不包含運算式的 return 陳述式隱含地回傳 undefined。
"checkForEach": false (預設) 當設定為 true 時，規則也會報告回傳值的 forEach 回呼函式。
"allowVoid": false (預設) 當設定為 true 時，允許在 forEach 回呼函式中使用 void，因此規則不會報告使用 void 運算子的回傳值。

注意： 只有當 checkForEach 選項設定為 true 時，{ "allowVoid": true } 才會起作用。

allowImplicit

{ "allowImplicit": true } 選項的正確程式碼範例

在遊樂場中開啟

/*eslint array-callback-return: ["error", { allowImplicit: true }]*/
var undefAllTheThings = myArray.map(function(item) {
    return;
});
1
2
3
4

checkForEach

{ "checkForEach": true } 選項的不正確程式碼範例

在遊樂場中開啟

/*eslint array-callback-return: ["error", { checkForEach: true }]*/

myArray.forEach(function(item) {
    return handleItem(item);
});

myArray.forEach(function(item) {
    if (item < 0) {
        return x;
    }
    handleItem(item);
});

myArray.forEach(function(item) {
    if (item < 0) {
        return void x;
    }
    handleItem(item);
});

myArray.forEach(item => handleItem(item));

myArray.forEach(item => void handleItem(item));

myArray.forEach(item => {
    return handleItem(item);
});

myArray.forEach(item => {
    return void handleItem(item);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

{ "checkForEach": true } 選項的正確程式碼範例

在遊樂場中開啟

/*eslint array-callback-return: ["error", { checkForEach: true }]*/

myArray.forEach(function(item) {
    handleItem(item)
});

myArray.forEach(function(item) {
    if (item < 0) {
        return;
    }
    handleItem(item);
});

myArray.forEach(function(item) {
    handleItem(item);
    return;
});

myArray.forEach(item => {
    handleItem(item);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

allowVoid

{ "allowVoid": true } 選項的正確程式碼範例

在遊樂場中開啟

/*eslint array-callback-return: ["error", { checkForEach: true, allowVoid: true }]*/

myArray.forEach(item => void handleItem(item));

myArray.forEach(item => {
    return void handleItem(item);
});

myArray.forEach(item => {
    if (item < 0) {
        return void x;
    }
    handleItem(item);
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14

已知限制

此規則會檢查具有給定名稱的方法的回呼函式，即使具有該方法的物件不是陣列。

何時不使用

如果您不想警告在陣列方法的 callback 中使用 return 陳述式，則可以安全地禁用此規則。

版本

此規則在 ESLint v2.0.0-alpha-1 中引入。

資源

編輯此頁面