JS 跳出循环的几种方法
1、return 语句
2、break 语句
3、 给循环体增加别名
4、continue 语句
5、throw 语句
1、return 语句
首先来说 return 语句，仅限函数内部使用，在函数体内部使用 return 语句会导致函数立即返回并跳出循环
function myFunction() {
for (var i = 1; i < 5; i++) {
if (i === 3) {
return; // 当i等于3时跳出循环并返回到调用处
}
console.log(i);
}
console.log('end') // 未执行
}
myFunction();
// 输出结果为：1 2
只输出了1和2，第三次循环中return跳出了循环，同时也阻止了后面代码的执行，这就是return的特性：当执行return语句时，即使函数主体中还有其他语句，函数执行也会停止！
2、break 语句
使用 break 关键字来立即结束当前所在的循环
function myFunction() {
for (var i = 1; i < 5; i++) {
if (i === 3) {
break; // 当i等于3时跳出循环并返回到调用处
}
console.log(i);
}
console.log('end') // 执行
}
myFunction();
// 输出结果为：1 2 end
通过输出了 end 可以看出他跟 return 语句的不同之处，break 语句只是跳出了当前循环语句，并不会阻止函数内其他语句的执行
3、 给循环体增加别名
首先我们针对 for 循环设置一个常量表示循环体，然后 break 指定跳出循环体。（tips：指定的循环体可以是英文也可以是中文，只适用于 for 循环，且每层都得用for循环）
foo: for (var i = 1; i <= 5; i++) {
if (i === 3) {
break foo;
}
console.log(i);
}
// 输出结果为 1 2
此方法还可跳出多个循环体，如下找出第一个吃草莓的人
const arr = [
{ name: '张三', fruit: ['苹果', '香蕉']},
{ name: '李四', fruit: ['梨', '草莓']},
{ name: '王五', fruit: ['樱桃', '西瓜']},
{ name: '小红', fruit: ['菠萝', '芒果']},
]
let person = undefined
// 为紧邻的for循环命名
冰淇淋: for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr[i].fruit.length; j++) {
console.log(arr[i].name, arr[i].fruit[j])
if (arr[i].fruit[j] === '草莓') {
person = arr[i].name
// 跳出命名的循环
break 冰淇淋
}
}
}
console.log('这里仍然可以执行', person)
// 执行结果如下：
// 张三 苹果
// 张三 香蕉
// 李四 梨
// 李四 草莓
// 这里仍然可以执行 李四
看打印的结果，不仅阻断了命名循环的执行，而且执行命名循环后续的代码
4、continue 语句
和 break 语句相似。所不同的是，它不是退出一个循环，而是跳出当前循环，继续下一轮循环。
continue 语句只能用在 while 语句、do/while 语句、for 语句（包括 for/of、for/in 语句）循环体内, 在其他地方使用都会引起错误
function fn() {
for (var i = 1; i <= 5; i++) {
if (i === 3) {
continue;
}
console.log(i);
}
console.log('end'); // end
}
fn()
// 输出结果为 1，2，4，5
5、throw 语句
通过 throw 语句将自定义错误对象抛出，从而触发 try-catch 机制进行异常处理，达到类似跳出循环的效果。
相当于强制抛错中断执行，不仅终止了循环，后续代码也不再执行。
try {
for (var i = 0; i < 5; i++) {
if (i === 3) {
throw new Error('Jump out of loop'); // 当i等于3时抛出错误
}
console.log(i);
}
} catch (error) {
console.log(error.message); // 打印错误信息
}
// 输出结果为：0 1 2 Jump out of loop