JS中循环的多种使用方式

JS中循环的遍历

在js中我们一般都使用for循环,但是这样的代码见的多了,总是感觉到审美疲劳,而且有更好的方式可以替代for循环,比如js的foreach和jquery的each.

我们看一行代码,这是一个多选框(html代码)

<input type="checkbox" name="senceIds" lay-skin="primary" value=‘1‘ title=‘全自助黄金卡‘ checked />
<input type="checkbox" name="senceIds" lay-skin="primary" value=‘2‘ title=‘测试储值卡‘ />
<input type="checkbox" name="senceIds" lay-skin="primary" value=‘3‘ title=‘私教卡‘ />
?

定义一个数组var arr1 = [ "aaa", "bbb", "ccc" ]

如果我们采用jquery的each方式,我们可以如下方式那样使用

var chk_value =[];//定义一个数组
$(‘input[name="senceIds"]:checked‘).each(function(index){
    chk_value.push($(this).val());
});
classTypeIds = chk_value.join(",");
/**----------------**/
$.each(arr1, function(i,val){      
      clonsole.log(i); /**每一个元素的索引**/
      console.log(val);/**每一个元素的值**/
});   
?

如果多选后,我们可看到classTypeIds的值为"1,2,3",index为所遍历的索引

相对数组,我们可以拿出数组中的每一个值及它的索引

如果我们采用js的foreach方式,我们可以如下这样使用

var arr = [1,2,3,4,5];
arr.forEach(function(val,index)){
   console.log(val);
   console.log(index);
}

原文地址:https://www.cnblogs.com/tianjizhe/p/9848806.html

时间: 2024-08-15 11:26:21

JS中循环的多种使用方式的相关文章

【JS中循环嵌套六大经典例题+六大图形题,你知道哪几个?】

首先,了解一下循环嵌套的特点:外层循环转一次,内层循环转一圈. 在上一篇随笔中详细介绍了JS中的分支结构和循环结构,我们来简单的回顾一下For循环结构: 1.for循环有三个表达式,分别为: ①定义循环变量 ② 判断循环条件 ③更新循环变量(三个表达式之间,用;分隔.) for循环三个表达式可以省略,两个;缺一不可2.for循环特点:先判断,再执行:3.for循环三个表达式,均可以有多部分组成,之间用逗号分隔,但是第二部分判断条件需要用&&链接,最终结果需要为真/假. [嵌套循环特点]外层

js中创建对象的几种方式

js中的几种创建对象的方式. 一共有5种: 一 , 工厂方式 var lev = function() {    return this.age;};function Parent() {    var child = new Object();    child.name = '小芳';    child.age = 30;    child.lev = lev;    return child;}var x = Parent();alert(x.name);alert(x.lev()); 说

JS中三种字符串连接方式及其性能比较

工作中经常会碰到要把2个或多个字符串连接成一个字符串的问题,在JS中处理这类问题一般有三种方法,这里将它们一一列出顺便也对它们的性能做个具体的比较. 第一种方法  用连接符“+”把要连接的字符串连起来: str="a"; str+="b"; 毫无疑问,这种方法是最便捷快速的,如果只连接100个以下的字符串建议用这种方法最方便. 第二种方法  以数组作为中介用 join 连接字符串: var arr=new Array(); arr.push(a); arr.push

PHP学习笔记--数组中常用的多种遍历方式

数组的遍历 * * 1. 使用for语句循环遍历数组 * a. 其它语言(只有这一种方式) * b. PHP中这种方式不是我们首选方式 * c. 数组必须是索引数组,而且下标还必须是连续的 * (索引数组下标还可以不连序,数组还有关联数组) * * * 2. 使用foreach语句循环遍历数组 * foreach(数组变量 as 变量值){ * //循环体 * } * a. 循环次数由数组的元素个数决定 * b. 每一次循环都会将数组中的元素分别赋值给后面变量 * * foreach(数组变量

js教程--从入门到精通 第一篇 js的前世今生以及js中基本数据类型和引入方式

1.Javascript前世今生   1.1.什么是Javascript       Javascript运行于Javascript [解释器/引擎]中的解释性脚本语言      Javascript运行环境:      1.Javascript解释器 :NodeJS      2.嵌入在浏览器中的内核(引擎) 1.2.Javascript 发展      1.1992年 Nombas公司 开发了一款脚本语言 ScriptEase ,可以嵌入在网页中  大概在 1992 年,一家称作 Nomba

强大的CSS3/JS:帧动画的多种实现方式与性能对比

Web动画形式 首先我们来了解一下Web有哪些动画形式 1\. CSS3动画 Transform(变形) Transition(过渡) Animation(动画) 2\. JS动画(操作DOM.修改CSS属性值) 3\. Canvas动画 4\. SVG动画 5\. 以Three.js为首的3D动画 以上各种动画形式都可以制作出一种类型的动画,那就是帧动画,也叫序列帧动画,定格动画,逐帧动画等,这里我们统一用帧动画来表述. 这里推荐一下我的前端学习交流扣qun:767273102 ,里面都是学习

更快的理解js中循环嵌套

[循环控制语句] break语句:终止本层循环,继续执行循环后面的语句:(当循环有多层时,break只会跳出一层循环) continue语句:跳过本次循环,继续执行下次循环: (对于for循环,continue执行后,继续执行循环变量更新语句n++: 对于while, do while,continue执行后,继续执行循环条件,所以使用这两个循环,必须注意,continue一定要在n++之后): [嵌套循环题的特点] 外层循环控制行数,内层循环控制每行元素的个数: [做图形的思路步骤] 1.确定

js中循环嵌套

[循环控制语句] break语句:终止本层循环,继续执行循环后面的语句:(当循环有多层时,break只会跳出一层循环) continue语句:跳过本次循环,继续执行下次循环: (对于for循环,continue执行后,继续执行循环变量更新语句n++: 对于while, do while,continue执行后,继续执行循环条件,所以使用这两个循环,必须注意,continue一定要在n++之后): [嵌套循环题的特点] 外层循环控制行数,内层循环控制每行元素的个数: [做图形的思路步骤] 1.确定

js中实现继承的不同方式以及其缺点

1.利用call和apply,借助构造函数 fucntion P(){ this.name = "P"; } fucntion C1(){ P.call(this); } 解释一下,P.call(this)的意思,就是将P的上下文指向C的上下文. 那么,什么是上下文呢,比如说,我有一把菜刀,可以用来杀猪,那么这里我就是菜刀的上下文.你没有,但是有一天你也要去杀猪,怎么办,最简单的方式就是向我借,而不是自己去买,向我借就是说菜刀的上下文被指给你了. call函数和apply都是用来指定上