在reduce函数中使用concat无效？

Question

我正在尝试使用 Array.reduce() 将下面这个字符串：

'React, {PureComponent, Fragment}'

转换成如下数组：

['React', 'PureComponent', 'Fragment']

为了实现这个目标，我使用了递归的 Array.reduce() 方法，代码如下：

const str = 'React, {PureComponent, Fragment}';

const moduleFinder = (acc, curr) => {
    if (curr.charAt(0) === '{') {
        const insideStr = curr.substring(curr.indexOf("{")+1, curr.indexOf("}"));
        const insideModules = insideStr.split(',').map(e => e.trim());
        return acc.concat(insideModules.reduce(moduleFinder, []));
    } else {
        acc.push(curr);
        return acc;
    }
}


console.log(str.split(',').map(e => e.trim()).reduce(moduleFinder, []));

然而，我一直收到Maximum call stack exceeded的错误提示！

我做错了什么？

- MarksCode

---

既然您不关心嵌套，为什么不使用正则表达式：let results = str.match(/[a-z]+/gi);？ - ibrahim mahrir

Answer 1

我觉得你可能做得太多了。这个简单的函数应该能满足你的需求：

let str = 'React, {PureComponent, Fragment}';

function replaceAndSplit(str) {
    return  str.replace(/{|}/g, '').split(',').map(e => e.trim());
}
console.log(replaceAndSplit(str));

- C. Johnson

---

不错的回答，还可以考虑修剪结果：str.split(',').map(e => e.trim()); 另外，无需将结果存回 str，直接返回它们即可：return str.split(',')...; - ibrahim mahrir

Fraekin beautiful - TheCrzyMan

谢谢！我总是感觉我应该使用功能性方法，比如 map, reduce 等等，但我猜有时候只用简单的解决方案可能更好。 - MarksCode

我不认为OP做得太多了。看起来他们正在编写一个递归解析器。如果嵌套不可能，那么是的。 - user2437417

如果我们要从嵌套属性的对象解构中创建一个数组，我们必须知道所需格式的数组，其中一些项被深度嵌套。 - C. Johnson