JS中的几种循环和跳出方式

JS中的循环是大家很常用的,这里总结一下几种常用循环的跳出方式。

1.for循环

var arr = ['q','w','e','r','t'];
for(var i=0, len = arr.length ; i< len ; i++){
    console.log(arr[i]);    
}
 
// q , w , e , r , t

跳出本次循环continue:

for(var i=0, len = arr.length ; i< len ; i++){
    if(i == 2){
        continue;
    }
    console.log(arr[i]);    
}
 
// q ,  w , r , t

当i==2时,跳出本次循环,本次循环下面的代码不在执行。但是真个循环继续执行,直到循环条件为false。

跳出整个循环break:

for(var i=0, len = arr.length ; i< len ; i++){
    if(i == 2){
        break;
    }
    console.log(arr[i]);    
}
 
// q ,  w 

2. for-in循环

退出方法同for循环。

3.jQuery的each循环

$.each(arr,function(index,oo){
    console.log(oo);
})
//q , w , e , r , t

退出当前循环 return true:

$.each(arr,function(index,oo){
    if(index == 2){
        return true;
    }
    console.log(oo);
})
//q ,w ,r ,t

当index == 2 时,退出当前循环,整体循环继续执行。

退出整个循环 return false:

$.each(arr,function(index,oo){
    if(index == 2){
        return false;
    }
    console.log(oo);
});
 
// q , w

当index == 2时,使用return false,可以退出整个循环,后面的条件不在执行。

4.forEach循环

arr.forEach(function(oo,index){
    console.log(oo);
});
 
// q, w, e, r, t

退出当前循环 return ;reutrn false ; return true ;

arr.forEach(function(oo,index){
    if(index == 2){
        return ;
        //return false;    //效果同上
       // return true;    //效果同上
    }
    console.log(oo);
});
// q , w ,r ,t

在forEach循环中,return 返回任何值,都只能退出当前循环。

要想跳出整个forEach循环,可以使用抛异常的方式:

try{
    arr.forEach(function(oo,index){
        if(index == 2){
             throw 'jumpout';
        }
        console.log(oo);
    });
}catch(e){
}
 
// q , w
在 JavaScript 中,`map` 方法是一种高阶函数,用于对数组中的每个元素执行回调函数,并返回一个新数组。然而,`map` 方法并不支持直接使用 `break` 或 `continue` 语句来中断或跳过循环[^1]。这是因为 `map` 的设计初衷是为了遍历整个数组并生成一个新的数组,而不是像传统的 `for` 循环那样可以中途退出。 如果需要在某种条件下提前结束 `map` 操作,可以通过以下几种方法实现: ### 方法一:使用普通 `for` 循环 通过普通的 `for` 循环,可以直接使用 `break` 语句来跳出循环。 ```javascript const array = [1, 2, 3, 4, 5]; let result = []; for (let i = 0; i < array.length; i++) { if (array[i] === 3) break; result.push(array[i] * 2); } console.log(result); // [2, 4] ``` ### 方法二:使用 `some` 或 `every` `some` `every` 方法都允许通过返回 `true` 或 `false` 来控制是否继续迭代。当条件满足时,它们会自动停止迭代。 ```javascript const array = [1, 2, 3, 4, 5]; const result = []; array.some(item => { if (item === 3) return true; // 停止迭代 result.push(item * 2); return false; }); console.log(result); // [2, 4] ``` ### 方法三:使用异常机制(不推荐) 虽然可以通过抛出异常来中断 `map` 的执行,但这种方法通常不被推荐,因为它会使代码难以维护调试。 ```javascript const array = [1, 2, 3, 4, 5]; try { array.map(item => { if (item === 3) throw new Error('StopIteration'); console.log(item * 2); }); } catch (e) { if (e.message !== 'StopIteration') throw e; } // 输出: 2 4 ``` ### 方法四:使用 `reduce` `reduce` 方法可以在累积结果的同时控制迭代的终止条件。 ```javascript const array = [1, 2, 3, 4, 5]; const result = array.reduce((acc, item) => { if (item === 3) return acc; // 停止迭代 acc.push(item * 2); return acc; }, []); console.log(result); // [2, 4] ``` ### 总结 由于 `map` 方法的设计特性,它并不支持直接跳出循环。如果需要类似功能,可以考虑使用 `for` 循环、`some`、`every` 或 `reduce` 等替代方案。每种方法都有其适用场景,选择时应根据具体需求权衡代码的可读性性能[^2]。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值