JavaScript 你不知道的循環跳出

下表是JS中經常使用的實現循環遍歷的方法的跳出/結束遍歷的辦法,通過測試後的總結。可能各位大佬還有其餘的辦法,我在此表示大佬NB。markdown

序號 方法 break continue return return true return false 結論
1 for循環 成功 跳出本次循環 不合法 不合法 不合法
2 Array.forEach() 不合法 不合法 跳出本次循環 跳出本次循環 跳出本次循環 ×
3 for...in 成功 跳出本次循環 不合法 不合法 不合法
4 Array.map() 不合法 不合法 跳出本次循環 跳出本次循環 跳出本次循環 ×
5 Array.some() 不合法 不合法 跳出本次循環 成功 跳出本次循環
6 Array.every() 不合法 不合法 成功 跳出本次循環 成功
7 Array.filter() 不合法 不合法 跳出本次循環 跳出本次循環 跳出本次循環 ×

forEach、map和filter目前我不知有什麼辦法中止遍歷,在其餘幾種方法中,上表中列出的方法都可實現結束循環。app

1. for循環

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

for (var i = 0; i < arr.length; i++) {
    if (i === 2) {
        break;// ['a', 'b'] 成功跳出循環
        // continue;// ['a', 'b', 'd', 'e'] 只能跳出本次循環
        // return;// Uncaught SyntaxError: Illegal return statement
        // return true;// Uncaught SyntaxError: Illegal return statement
        // return false;// Uncaught SyntaxError: Illegal return statement
    }
    show.push(arr[i]);
}
複製代碼

2. Array.forEach()

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

arr.forEach((item, index) => {
    if (index === 2) {
        // break;// Uncaught SyntaxError: Illegal break statement
        // continue;// Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement
        // return;// ["a", "b", "d", "e"] 只能跳出本次循環
        // return true;// ["a", "b", "d", "e"] 只能跳出本次循環
        // return false;// ['a', 'b', 'd', 'e'] 只能跳出本次循環
    }
    show.push(item);
})
複製代碼

要想跳出整個forEach循環,能夠使用拋異常的方式:throw '異常';測試

3. for...in...

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

for (var item in arr) {
    if (item === '2') {
        break;// ["a", "b"] 跳出循環成功
        // continue;// ["a", "b", "d", "e"] 只能跳出本次循環
        // return;// Uncaught SyntaxError: Illegal return statement
        // return true;// Uncaught SyntaxError: Illegal return statement
        // return false;// Uncaught SyntaxError: Illegal return statement
    }

    show.push(arr[item]);
}
複製代碼

4. Array.map()

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

arr.map((item, index) => {
    if (index === 2) {
        // break;// Uncaught SyntaxError: Illegal break statement
        // continue;// Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement
        // return;// ["a", "b", "d", "e"] 只能跳出本次循環
        // return true;// ["a", "b", "d", "e"] 只能跳出本次循環
        // return false;// ["a", "b", "d", "e"] 只能跳出本次循環
    }
    show.push(item);
})
複製代碼

5. Array.some()

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

arr.some((item, index) => {
    if (index === 2) {
        // break;// Uncaught SyntaxError: Illegal break statement
        // continue;// Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement
        // return;// ["a", "b", "d", "e"] 只能跳出本次循環
        return true;// ["a", "b"] 成功跳出循環
        // return false;// ["a", "b", "d", "e"] 只能跳出本次循環
    }
    show.push(item);
})
複製代碼

6. Array.every()

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

arr.every((item, index) => {
    if (index === 2) {
        // break;// Uncaught SyntaxError: Illegal break statement
        // continue;// Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement
        // return;// ["a", "b"] 成功跳出循環
        // return true;// ["a", "b", "d", "e"] 只能跳出本次循環
        return false;// ["a", "b"] 成功跳出循環
    }
    return show.push(item);
})
複製代碼

some()與every()不一樣,some遍歷中一個爲真所有即爲真,而every遍歷中所有爲真才行。some遍歷中返回true纔會退出執行,而every則須要返回false纔會退出執行。ui

7. Array.filter()

var arr = ['a', 'b', 'c', 'd', 'e'];
var show = [];

arr.filter((item, index) => {
    if (index === 2) {
        // break;// Uncaught SyntaxError: Illegal break statement
        // continue;// Uncaught SyntaxError: Illegal continue statement: no surrounding iteration statement
        // return;// ["a", "b", "d", "e"] 只能跳出本次循環
        // return true;// ["a", "b", "d", "e"] 只能跳出本次循環
        return false;// ["a", "b", "d", "e"] 只能跳出本次循環
    }
    show.push(item);
})
複製代碼
相關文章
相關標籤/搜索