关闭

js中关于for循环、for in、foreach、for each in

标签: javascript循环 foreach for fo
199人阅读 评论(0) 收藏 举报

for  each  in

原谅我标题党了  因为在js中是不支持 for each(var  i  in array){}的,

关于for循环

for循环是很简单的但是注意

for(var i=0;i<arr.length;i++){
    alert(arr[i]);
}

如果要提高效率

 j=arr.length;    //避免每次重新计算 arr.length
for(var i=0;i<j;i++){
    
}

,这个里面对于初学者还是要注意一下的,如果你的第一个条件var i 没有定义直接写成

for(var i;i<arr.length;i++){  
    alert(arr[i]);
}

浏览器是不会报错的但是后面要执行的操作是不会被执行的,



关于 for in

一般在js里面我们需要遍历的有两种一种是数组  一种是对象,但是一般不推荐遍历数组,因为for in遍历后的不能保证顺序,而且原型链上的属性也会被遍历到,因此一般常用来遍历非数组的对象并且使用hasOwnProperty()方法去过滤掉原型链上的属性

var arr=['a','b','c'];

var person={
    name:"xiaoming",
    age:25,
    height:"178cm",
    weight:"65kg"
};

我们先遍历数组

for(var i in arr){
    console.log(i);  //这时的var i 代表的是 arr的下标
    console.log(arr[i]);
}

遍历嵌套数组

 var arr1=[['ab','cd'],['e','f'],['ghi','jkl'],['mnop','rlst']];

for(var i in arr1){
    //console.log(i);  输出的也是arr1的下标
  for(var j in arr1[i]){
    console.log(arr1[i][j]);
  }
}

遍历对象

for(var i in person){
    console.log(i);  // i代表的是person的key
    console.log(person[i]);
}

其实还有一种

遍历对象数组----其实很简单只是把上面的结合一下

var arr2=[{
    name:"xiaoming1",
    age:25,
    height:"178cm",
    weight:"65kg"
    },
    {
    name:"xiaoming2",
    age:25,
    height:"178cm",
    weight:"65kg"
      },
    {
    name:"xiaoming3",
    age:25,
    height:"178cm",
    weight:"65kg"
  }];

  for (var i in arr2){
      console.log(i);  //arr2的下标
      for (var j in arr2[i]){ //此处的arr3[i]代表的是一个对象
          console.log(j);  // 所以遍历对象 这个 j就是对象的key ex: name age……
          console.log(arr3[i][j])
      }
  }

关于for each  是无法遍历对象的 不然会报错Uncaught TypeError: person.forEach is not a function   我是拿上面的persong实验的

缺陷:不能响应break、continue和return语句

遍历数组

var arr=['a','b','c'];
arr.forEach(function(item,index){
    console.log(item);  //输出 a b c
    console.log(index); //输出的是数组的下标
});

遍历嵌套数组

var arr1=[['ab','cd'],['e','f'],['ghi','jkl'],['mnop','rlst']];
arr1.forEach(function(item,index){

    item.forEach(function(con,num){
        console.log(con)
    });

});


强大的for-of循环

还记得在《深入浅出ES6(一):ES6是什么》中我向你们承诺过的话么?ES6不会破坏你已经写好的JS代码。目前看来,成千上万的Web网站依赖for-in循环,其中一些网站甚至将其用于数组遍历。如果想通过修正for-in循环增加数组遍历支持会让这一切变得更加混乱,因此,标准委员会在ES6中增加了一种新的循环语法来解决目前的问题。

  • 这是最简洁、最直接的遍历数组元素的语法
  • 这个方法避开了for-in循环的所有缺陷
  • 与forEach()不同的是,它可以正确响应break、continue和return语句
  • 能数组,set,map,不能遍历对象
写法同for in





2
0
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

你知道forEach和each的区别吗?

要知道forEach和each的区别,你必须明白一点:forEach是js中的方法(针对数组),而each是jquery中的方法(针对jquery对象,即$( ) )。知道这一点,接下来我分别给举个栗子: 1.forEach方法:如下图所示 2.each方法:如下图所示 输出结果:...
  • FightingGirls
  • FightingGirls
  • 2017-04-19 18:35
  • 2363

for i和for each和Java8的forEach性能测试,到底谁快的测试

有说这个快,有说那个快,但是,靠嘴不顶用啊。还是测试一下就知道啦。 如下 : /** * Created by King on 2016/7/27 * 关于for和for each到底谁快的测试 */ public class Test { public static void mai...
  • qq_27093465
  • qq_27093465
  • 2016-07-27 13:31
  • 2635

foreach 和 for 循环的区别

1.如果只是遍历集合或者数组,用foreach好些,快些。 2.如果对集合中的值进行修改,就要用for循环了。其实foreach的内部原理其实也是Iterator,但它不能像Iterator一样可以人为的控制,而且也不能调用iterator.remove();更不能使用下标来访问每个元素,所以不能用...
  • heyuchang666
  • heyuchang666
  • 2015-11-06 15:40
  • 10049

Java for循环和foreach循环的性能比较

在公司codereview过程中,发现一个问题,就是有些人循环用的是普通for循环,有些人用的是foreach循环,它们之间有什么区别?应该在什么时候使用这两种循环了? 两种循环的语法格式: 普通for循环语法: for (int i = 0; i < integers.length; i++...
  • mlc1218559742
  • mlc1218559742
  • 2016-09-30 16:48
  • 7391

JavaScript——forEach跳出循环

想要在满足指定条件的时候跳出forEach循环 但是在打包的时候出错如下: 查阅相关资料,发现无法终止forEach遍历,跳出循环 然而 for循环 可以通过 return和break跳出循环 所以改用for循环,成功得到想要的效果 扩展: for循环如果是多层循环 可以将循环命名,跳出...
  • Shiyaru1314
  • Shiyaru1314
  • 2017-04-05 15:48
  • 7384

javascript 学习之原型示例练习--- 实现一个each方法,遍历多维数组

var arr = [1,2,3,[4,5,[6,7]]]; /* arr.forEach(function(item,index,Array){ alert(item);//依次弹出1,2,3,最后一次弹出4,5,6,7不能遍历数组每一项 })*/ //自己实现一个each...
  • sinat_32546159
  • sinat_32546159
  • 2017-03-21 22:30
  • 475

原生JS forEach()和map()遍历的区别以及兼容写法

一、原生JS forEach()和map()遍历 共同点:      1.都是循环遍历数组中的每一项。   2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前项的索引index,原始数组input。 3....
  • huangpb123
  • huangpb123
  • 2016-10-08 14:25
  • 8505

从源码角度看for循环和foreach的区别

for循环和foreach的区别
  • LANG791534167
  • LANG791534167
  • 2015-12-27 23:23
  • 2021

Javascript 数组循环遍历之forEach

1.  js 数组循环遍历。 数组循环变量,最先想到的就是 for(var i=0;i<count;i++)这样的方式了。 除此之外,也可以使用较简便的forEach 方式 2.  forEach 函数。 Firefox 和Chrome 的A...
  • oscar999
  • oscar999
  • 2013-03-14 10:37
  • 421205

Java For-each 的实现原理

参考: http://blog.csdn.net/a596620989/article/details/6930479
  • yasi_xi
  • yasi_xi
  • 2014-05-10 15:09
  • 3896
    个人资料
    • 访问:3740次
    • 积分:123
    • 等级:
    • 排名:千里之外
    • 原创:6篇
    • 转载:3篇
    • 译文:1篇
    • 评论:3条
    最新评论