前端 - 嵌套函数跳出外部函数

一、现在存在的问题

function Test(){
   a();
   b();
   c();
}
function a()
    return false;
}
1
2
3
4
5
6
7
8

一般 a() 里 return false 就跳出 a 函数了，这是没有任何问题的，但是如果是 Test() 这种，如何实现函数a() return false 跳出外部函数 Test() 呢？

二、解决方案

利用 throw 语句

return 只能退出当前函数，不具备跨函数的功能。但是 throw 具有不限层次中断的功能，所以这个可以使用 throw 来完成。

一般情况下 throw 应该抛出一个 Error 对象。但是 JavaScript 并未对 throw 的对象有所有限制，所以也可以抛出其它东西，在确实不需要抛出错误的情况下，抛出一个状态对象，甚至值都是可以的。

但不管抛出什么，要想外面的程序能正常运行，都是需要 try … catch 的。

function a() {
    console.log("[Trace] a()");
    if (true) throw "true"
}
function test() {
    try {
        a();
        b();
        c();
    } catch (stat) {
        if (stat === "true") {
            return;
        }
        // TODO 其他情况正常处理可能发生的错误
    }
}
test();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

只会输出 [Trace] a()，因为被 throw 给中断掉了。

throw 这种方法我们可以看到，就算多层嵌套，用这种方法也是可行的。

利用 Array.every() 方法

如果是有一堆判断函数，只要有一个 flase 就退出，那就可以用数组来处理，比如：

const fns = [
    () => { console.log(true); return true; },
    () => { console.log(true); return true; },
    () => { console.log(false); return false; },
    () => { console.log(true); return true; },
];

fns.every(fn => fn());
// true
// true
// false
1
2
3
4
5
6
7
8
9
10
11

只要遇到一个返回 false 的就结束了。

使用 Array.every() 方法需要注意的一点是：若想继续执行，必须显式返回 true 才行，返回 undefined，也就是无返回值，也表示 false。

短路与 && 的实现

function Test(){
   a() && b() &&  c();
}
1
2
3

这样也可以实现只要函数 a、b、c 里有1个返回 false，Test() 就会不再执行后面的函数，但是这个的短板是跟 Array.every() 类似，只是 Test() 执行完成，而不是跳出 Test 函数。也就是说如果像下面这样，还是会往下执行：

function Test(){
    a() && b() &&  c();
    // 如果a、b、c函数里有返回false，下面的代码还是会执行
}
1
2
3
4

如果想实现 a() 返回 false 就跳出 Test 函数，不执行后面代码，也可以像下面这样，但是这样就多了一层判断。

function Test(){
　　if(!a()) return;
　　// 哪怕这里有代码也不会执行，而是跳出
　　b();
　　c();
}
1
2
3
4
5
6

所以也就是说这种方式与 Array.every() 一样，只适合仅仅只是一堆判断函数的情况。

function fun1(){

    function fun2(){

        return false;

    }

   return fun2();

}
1
2
3
4
5
6
7
8
9
10
11

三、使用标签跳出多层循环

outer:for(let i = 0; i < 2; i++) {
    inner:for(let j = 0; j < 3; j++) {
        if( i == 0 && j == 1) {
            console.log("333")
            break outer;
        }
        console.log("222")
    }
    console.log("111")
}
//222 333
outer:for(let i = 0; i < 2; i++) {
    inner:for(let j = 0; j < 3; j++) {
        if( i == 0 && j == 1) {
            console.log("333")
            continue outer;
        }
        console.log("222")
    }
    console.log("111")
}
// 222 333 222 222 222 111
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

---

浅析JavaScript中的嵌套函数如何实现优雅地跳出外部函数
使用标签跳出多层循环