javascript中 fn() 和 return fn() 的区别

在js中用return和不用return，输出结果有的时候傻傻搞不清，之前在网上看到个例子挺经典，不过讲的不清楚，上例子:

var i = 0;
function fn(){
    i++;
   if(i < 10){
        console.log(i);
        fn();
   }else{
        return i;
   }
}
var result = fn();
console.log(result);

这也是道隐藏了坑的经典面试题，看上去好像是输出10，然而打印出来的确实undefined，再来看一下改造

var i = 0;
function fn(){
    i++;
   if(i < 10){
        console.log(i);
        return fn();
   }else{
        return i;
   }
}
var result = fn();
console.log(result);

这时候就输出了想要得到的10。

那么，为什么加不加return区别这么大？

这里必须熟悉递归调用，不明白的可以网上，你可以在两个例子的前都加上console.log(i)；一个返回1,2,3,4,5,6,7,8,9,undefined，另外一个输出1,2,3,4,5,6,7,8,9,10。
由于上下两个都用到递归，到i=9的时候大家都是一样的，依次输出1,2,3,4,5,6,7,8,9。
区别就在最后一次，此时return i，i=10，没有return的那个函数体内把10给了fn()，fn()也就是10没有最终返回出去，导致result是undefined，而有return的那个在最后把fn()也就是得到的值10返回了回去，所以result得到了10。

总结:javascript函数默认是有返回值的，如果函数结尾不写return，将返回的是undefined，这就是为何例子少了return，控制台console.log输出undefined原因。