break、continue、return区别

1. break、continue

  • 一般用于for循环、swith语句中;

  • break -- 用于终止循环,跳出包含在最内层的循环; continue -- 用于跳过本层循环,直接执行下层循环语句;


for(var i=0; i++; i<4){
   if(i == 2){
    break;
   }
    console.log(i);
}
//最终将会输出:0 1

for(var i=0; i++; i<4){
   if(i == 2){
    continue;
   }
    console.log(i);
}
//最终将会输出:0 1 3

2. return

  • 常用于函数中;

  • return -- 用于跳出return当前所在的函数,return后面的函数语句将不再执行;

循环函数中使用:

(1). $.each(); -- $.each()是一个函数;
return false 终止循环; return true 继续执行;

var data = ["a", "b","c"];
$.each(data,function(dataItem){
    if(dataItem == "b"){
        return false;
    }
    console.log(dataItem);
});
//最终输出:a 

var data = ["a", "b","c"];
$.each(data,function(dataItem){
    if(dataItem == "b"){
        return true;
    }
    console.log(dataItem);
});
//最终输出:a  c

(2). forEach(); 暂时没有终止forEach和跳过forEach本层循环的语句;可以将其循环语句改写为:
return true 终止循环; return false继续执行;

//1.使用some函数

var ary = ["a", "b", "c", "d"];

ary.some(function (value, index, _ary) {
    console.log(index + ": " + value);
    return value === "b";
});
// 输出 0:a 1:b

//2.使用every函数
var ary = ["a", "b", "c", "d"];

ary.every(function(value, index, _ary) {
    console.log(index + ": " + value);
    return value.indexOf("b") > -1;
});
// 输出 0: a

return 深层解析

(1). 事件冒泡 :当一个元素接收到事件的时候 会把他接收到的事件传给自己的父级,一直到window 。(注意这里传递的仅仅是事件 并不传递所绑定的事件函数。所以如果父级没有绑定事件函数,就算传递了事件 也不会有什么表现 但事件确实传递了。但是如果父级有此事件,将会执行;)

(2). return false一般用来阻止浏览器的默认行为,何为默认行为,如表单提交,或者当我们点击一个超链接时,除了要触发它的点击事件外,还会触发浏览器的默认跳转请求(href属性),所以我会使用return false来阻止浏览器的默认行为;

这种return false阻止默认行为存在一定的隐患,其实return false进行了三种操作:
(1)、阻止默认行为;(event.preventDefault)
(2)、阻止冒泡;(event.stopPropagation)
(3)、跳出函数,不再执行函数中的语句;

当我们在写一个比较大的程序的时候,就有可能出现不可预知的错误,这时候最安全、最妥当、最不容易出错的方案就是,我们针对不同的情况使用对应的行为;

  • 如果我们只想阻止浏览器的默认行为,那我们就使用event.preventDefault;
  • 如果我们只想阻止冒泡,不想让它影响包含它的父元素及其祖先元素,那我们就是用event.stopPropagation;
posted @ 2019-02-23 10:12  Zero_追梦  阅读(1058)  评论(0编辑  收藏  举报