JQuery的循环跟JS的循环

为一个后端开发,前端的知识当然是不可少的,今天来聊聊,前端的循环。

像我们后端常用的循环就是foreach,前端的jQuery的库也提供了foreach

foreach主要用到循环list 列表| array 数组 | ....

今天的主角是jQuery 的 $.each 和 js 的 array.forEach() 方法

# JavaScript forEach

#JavaScript forEach语法

array.forEach(function(currentValue, index, arr), thisValue)

#参数

参数 描述
function(currentValue, index, arr) 必需。 数组中每个元素需要调用的函数。
函数参数:
参数描述
currentValue必需。当前元素
index可选。当前元素的索引值。
arr可选。当前元素所属的数组对象。
thisValue 可选。传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值

#forEach() 的 continue 与 break

forEach() 本身是不支持的 continue 与 break 语句的,我们可以通过 someevery 来实现。 使用 return 语句实现 continue 关键字的效果:

var arr = [1, 2, 3, 4, 5];

arr.forEach(function (item) {
    if (item === 3) {
        return;
    }
    console.log(item);
});

1619680134

var arr = [1, 2, 3, 4, 5];

arr.some(function (item) {
        if (item === 2) {
                return;  // 不能为 return false
        }
        console.log(item);
});

1619680199

#break 实现

var arr = [1, 2, 3, 4, 5];

arr.every(function (item) {
        console.log(item);
        return item !== 3;
});

1619680246

# jQuery $.foreach()

#jQuery $.each语法

#JavaScript forEach语法

each(callback)

概述

以每一个匹配的元素作为上下文来执行一个函数。

意味着,每次执行传递进来的函数时,函数中的this关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素)。而且,在每次执行函数时,都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整型)。 返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。

参数

callback Function V1.0
对于每个匹配的元素所要执行的函数

#$.each() 的 continue 与 break

var arr = [1, 2, 3, 4, 5];

arr.each(function (key,item) {
   if (item === 3) {
       return true;//continue  不能return false
   }
   console.log(item);
});

#break 实现

var arr = [1, 2, 3, 4, 5];

arr.each(function (key,item) {
    if (item === 3) {
        return false;//break  不能return true
    }
    console.log(item);
});