为什么我的箭头函数不返回数组而是函数声明答案

【问题标题】：Why doesn't my arrow function return array but instead a function declaration为什么我的箭头函数不返回数组而是函数声明
【发布时间】：2018-08-02 06:36:01
【问题描述】：

我尝试编写一个箭头函数来计算仅正整数的平方（不包括分数）。

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
    "use strict";

    const squaredIntegers = (arr) => {
        let arrayChoosen = arr.filter(ele => ele > 0 && Number.isInteger(ele));
        return arrayChoosen.map(x => x * x);
    }

    return squaredIntegers;
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

但结果是一个函数声明，而不是我期望的数组。但是当我尝试以这种方式修改代码时

const squareList = (arr) => {
  "use strict";
  let squaredIntegers = arr.filter(ele => ele > 0 && Number.isInteger(ele));
  squaredIntegers = squaredIntegers.map(val => val * val);
  return squaredIntegers;
};

然后它输出我期望的数组。为什么在第一种情况下它不起作用？

【问题讨论】：

在第一个示例中，从未调用函数squaredIntegers()，而只返回函数引用。那么为什么你会期望结果首先是一个数组呢？

标签： javascript arrow-functions

【解决方案1】：

您需要返回 squaredIntegers 函数的返回值，因此请尝试以下代码：

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
    "use strict";

    const squaredIntegers = (a) => {
        let arrayChoosen = a.filter(ele => ele > 0 && Number.isInteger(ele));
        return arrayChoosen.map(x => x * x);
    }

    return squaredIntegers(arr);
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

【讨论】：

虽然您已经修复了 OPs 代码以使其正常工作，但您的回答却忽略了解释为什么他们的代码不起作用，这实际上是最初的问题。

【解决方案2】：

因为您只返回函数名 - 即 - 对函数的引用。

相反，您应该调用该函数：

return squaredIntegers();

您的第二个示例运行良好，因为您实际上是在调用 arr.filter() 并将其值分配给 squaredIntegers

【讨论】：

谢谢。你帮我理清箭头函数的概念

【解决方案3】：

您需要使用arr 调用squaredIntegers 以获取新数组。

return squaredIntegers(arr);

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
    "use strict";

    const squaredIntegers = (arr) => {
        let arrayChoosen = arr.filter(ele => ele > 0 && Number.isInteger(ele));
        return arrayChoosen.map(x => x * x);
    }

    return squaredIntegers(arr);
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

【讨论】：

【解决方案4】：

因为第一个 squareList 返回函数本身，而不是在输入 arr 上调用的函数。你可以return 代替它的调用：

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
    "use strict";

    const squaredIntegers = (arr) => {
        let arrayChoosen = arr.filter(ele => ele > 0 && Number.isInteger(ele));
        return arrayChoosen.map(x => x * x);
    }

    return squaredIntegers(arr);
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

【讨论】：

【解决方案5】：

因为当你需要返回函数调用的结果时，你返回了一个函数。检查更正后的代码。

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
    "use strict";

    const squaredIntegers = (arr) => {
        let arrayChoosen = arr.filter(ele => ele > 0 && Number.isInteger(ele));
        return arrayChoosen.map(x => x * x);
    }

    return squaredIntegers(arr);
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

【讨论】：

【解决方案6】：

您返回的是函数而不是函数调用。

将return squaredIntegers;更改为return squaredIntegers(arr)；

所以会变成

const realNumberArray = [4, 5.6, -9.8, 3.14, 42, 6, 8.34];
const squareList = (arr) => {
    "use strict";

    const squaredIntegers = (arr) => {
        let arrayChoosen = arr.filter(ele => ele > 0 && Number.isInteger(ele));
        return arrayChoosen.map(x => x * x);
    }

    return squaredIntegers(arr);
};
// test your code
const squaredIntegers = squareList(realNumberArray);
console.log(squaredIntegers);

【讨论】：