javascript中递归调用返回结果的问题

Question

这是一段用于搜索字符串中
字符所在的位置，并返回这些位置值所构成的数组的函数

function searchBrIndex(val,start,arr){
    if(typeof val !== "string"){
        throw new Error("参数不是字符串")
    }
    var arr = arr || [];
    var start = start || 0;
    var index = val.indexOf("<br>",start);
    if(index !== -1){
        arr.push(index);
        searchBrIndex(val,index+4,arr);
    }
    return arr;
}

如果我把递归中arr参数去掉，也就是这样

function searchBrIndex(val,start,arr){
    if(typeof val !== "string"){
        throw new Error("参数不是字符串")
    }
    var arr = arr || [];
    var start = start || 0;
    var index = val.indexOf("<br>",start);
    if(index !== -1){
        arr.push(index);
        searchBrIndex(val,index+4);
    }
    return arr;
}

进入下一过程arr始终会变成空数组，由于在最后index总会有等于-1的时候，此时的arr一定为空数组，然而最终返回的却不是空数组，而是第一次调用后返回的arr，也就是字符串中第一个
所在在位置。

比如：searchBrIndex("12345<br>6789<br>12345")
1、首次调用arr = [5] ， 进入递归第一次 arr = [13], 第三次 arr = []， 然后退出递归循环，最终返回的是arr = [5]，为什么不是arr = []？

2、return不是就退出了函数了吗，那不就不会再执行先前未执行完的函数的return语句了吗？

Answer 1

谢邀

改一下就能用了

function searchBrIndex(val,start,arr){
    if(typeof val !== "string"){
        throw new Error("参数不是字符串")
    }
    var arr = arr || [];
    var start = start || 0;
    var index = val.indexOf("<br>",start);
    if(index !== -1){
        arr.push(index);
        // 这儿可以不用return，但return了就成了尾递归了。
        // 然后虽然递归了一下，若不传arr进去就成了 @scort[scort] 讲的那个问题
        return searchBrIndex(val,index+4, arr);
    }
    return arr;
}

换个实现

function searchBrIndex(str, flag){
  var arr = [];
  var reg = new RegExp(flag+'','g');
  (str+'').replace(reg, (a,b)=> arr.push(b));
  return arr;
}

console.log(searchBrIndex("12345<br>6789<br>12345", "<br>"))

Answer 2

其实这么一个需求根本不用递归来实现。var arr = arr || [];有可能就修改了arr，但是由于值传递的原因，并不会修改你当初传入的arr，按照你想要的结果你应该把arr定义在函数外层作用域。

var arr = [];
function searchBrIndex(str){
    ...    
}