js for等循環 跳出多層循環

js for 循環 跳出多層循環

var a = [1,2,3,4,5,6,7,8]; // 8個數
var b = [11,12,13,14,15,3,16,17]; //8個數

testFor();
console.log('555')

function testFor() {
  for(var k=0;k<a.length;k++){
    console.log('444');
    for(var i=0;i<a.length;i++){
      for(var j=0;j<b.length;j++){
        if( a[i]==b[j] ){
          return false;
        }
        console.log('111');
      }
      console.log('2222');
    }
    console.log('333');
  }
}


輸出:
// 1次444
// 8次111
// 1次222
// 8次111
// 1次222
// 5次111
// 1次555

　　

可見 return 會直接跳出多層循環,返回調用的方法外部
原因: js里for是沒有局部作用域的概念,方法才能一個局部作用域
return將會跳出當前局部作用繼續執行下面的方法

注意：
1.這里for循環如果直接放在全局作用域下執行而不被一個方法包裹，
將直接導致寫在for后的代碼永遠不會被執行；

2.如遇到邏輯特別復雜多層循環的時候，會遇到一些迭代器之類的方法，
這種迭代器實現的不同,會出現另一種情況，即不會跳出任何循環，
循環仍然繼續，只是當前循環if后的代碼不會被執行一次，下一次循環開始時,
仍然會執行if后的代碼

如：
var cc = 'xx';

Object.keys(o).forEach(function(key) {
var val = o[key];
if(cc == key){
return false;
}
console.log(key);
});

此外還有
break;
continue;
語句
break 語句跳出循環后，會繼續執行該循環之后的代碼 (退出循環)
continue continue 語句中斷循環中的迭代，如果出現了指定的條件，然后繼續循環中的下一個迭代。(跳過當前迭代,進入下次迭代)
這兩個語句可以指定label從而可以退出特定的循環
如

bbq:
for(var j=0;j<a.length;j++){
    ccc:
    for(var i =0;i<a.length;i++){
        if( i==5 ){
            break bbq; //直接跳出bbq外層循環
        }
    }
}


或者:
function testFor() {
    bbq:
    for(var k=0;k<a.length;k++){
        console.log('444');
        ccc:
        for(var i=0;i<a.length;i++){
            ddd:
            for(var j=0;j<b.length;j++){
                if(j == 2){
                    break;
                }
                console.log('j '+j);
            }
            console.log('i '+i);
       }
       console.log('k '+k);
    }
}

　　// 只會每次循環j==2時退出ddd循環然后外面的循環都會繼續循環

 

 return 不能用在for中的函數體中，如果遇到這種情況，可以使用標志位，如下

       for(var k=0; k<service_ids.length; k++) {
            var delete_flag = true
            await deleteService(service_ids[k]).then(response => {
            }).catch(error => {
              delete_flag = false
              workflowStepsParam = workflowSteps
              console.log(error)
　　　　　　　　　// return 這里的return不會生效
            })
            if(!delete_flag) {
              return
            }
          }

 

forEach方法如何跳出循環

1.for方法跳出循環

　　function getItemById(arr, id) {
        var item = null;
        for (var i = 0; i < arr.length; i++) {
            if (arr[i].id == id) {
                item = arr[i];
                break;
            }
        }
        return item;
    }

2.forEach方法跳出循環

　　function getItemById(arr, id) {
        var item = null;
        try {
            arr.forEach(function (curItem, i) {
                if (curItem.id == id) {
                    item = curItem;
                    throw Error();
                }
            })
        } catch (e) {
        }
        return item;
    }

3.備注

3.1 forEach的優勢一個是它的回調函數形成了一個作用域，它的curItem和i不會像for循環一樣污染全局變量，再一個是更容易寫出來函數式的代碼，和map、filter、reduce這些高階函數是一脈相承的。

3.2 forEach()本身無法跳出循環，必須遍歷所有的數據才能結束。參考鏈接：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach