js中使用break，continue，return的区别

前言：个人记录，好记性不如烂笔头，不常使用break，continue老忘记他们的区别，特此记录

注意事项：有些循环语句是不支持break，continue，return的(并不全后期发现在添加)

1. forEach不支持
2. 大部分ES6的方法都不支持break，continue
3. ......

continue

• 结束当前次循环，开始下一次的循环，也不会在执行当前continue语句下面的代码

break

• 结束当前整个循环，如果外层还有循环不会影响外层循环(也不会执行break语句后面的代码)

return

• return直接退出当前函数，必须在函数内使用，否则会报错

下面是测试代码

数据源

let arr = [
    {
        "label": "我是第一名",
        "value": "0"
    },
    {
        "label": "我是第二名",
        "value": "1"
    },
    {
        "label": "我是第三名",
        "value": "2"
    }
]

let arr1 = ['0','1','2']

 continue 测试代码

function test(arr,arr1){
   for (let i = 0; i < arr.length; i++) {
        console.log('外层for开始',arr[i]);
        for (let j = 0; j < arr1.length; j++) {
            console.log('内层for开始',arr1[j]);
            if(arr1[j] === '1' && arr[i].value === arr1[j]) {
                 console.log('中断');
                continue
            }
            console.log('内层for结束',arr1[j]);
        }
         console.log('外层for结束',arr[i]);
    }
}

test(arr,arr1)

 continue 测试结果

   外层for开始 {label: '我是第一名', value: '0'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   内层for结束 1
   内层for开始 2
   内层for结束 2
   外层for结束 {label: '我是第一名', value: '0'}
   外层for开始 {label: '我是第二名', value: '1'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   中断
   内层for开始 2
   内层for结束 2
   外层for结束 {label: '我是第二名', value: '1'}
   外层for开始 {label: '我是第三名', value: '2'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   内层for结束 1
   内层for开始 2
   内层for结束 2
   外层for结束 {label: '我是第三名', value: '2'}

 break 测试代码

function test(arr,arr1){
   for (let i = 0; i < arr.length; i++) {
        console.log('外层for开始',arr[i]);
        for (let j = 0; j < arr1.length; j++) {
            console.log('内层for开始',arr1[j]);
            if(arr1[j] === '1' && arr[i].value === arr1[j]) {
                 console.log('中断');
                break
            }
            console.log('内层for结束',arr1[j]);
        }
         console.log('外层for结束',arr[i]);
    }
}

test(arr,arr1)

 break 测试结果

   外层for开始 label: '我是第一名', value: '0'
   内层for开始 0
   内层for结束 0
   内层for开始 1
   内层for结束 1
   内层for开始 2
   内层for结束 2
   外层for结束 {label: '我是第一名', value: '0'}
   外层for开始 {label: '我是第二名', value: '1'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   中断
   外层for结束 {label: '我是第二名', value: '1'}
   外层for开始 {label: '我是第三名', value: '2'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   内层for结束 1
   内层for开始 2
   内层for结束 2
   外层for结束 {label: '我是第三名', value: '2'}

return 测试代码

function test(arr,arr1){
   for (let i = 0; i < arr.length; i++) {
        console.log('外层for开始',arr[i]);
        for (let j = 0; j < arr1.length; j++) {
            console.log('内层for开始',arr1[j]);
            if(arr1[j] === '1' && arr[i].value === arr1[j]) {
                 console.log('中断');
                return '我们结束了'
            }
            console.log('内层for结束',arr1[j]);
        }
         console.log('外层for结束',arr[i]);
    }
}

test(arr,arr1)

return 测试结果

外层for开始 {label: '我是第一名', value: '0'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   内层for结束 1
   内层for开始 2
   内层for结束 2
   外层for结束 {label: '我是第一名', value: '0'}
   外层for开始 {label: '我是第二名', value: '1'}
   内层for开始 0
   内层for结束 0
   内层for开始 1
   中断
   '我们结束了'