zoukankan      html  css  js  c++  java
  • for ,foreach ,map 循环的区别

    一、for循环

    1、for - 循环代码块一定的次数

     遍历数组最常用到的for循环,是最为熟知的一种方法

    for (var i=0; i<5; i++)
      {
      x=x + "The number is " + i + "<br>";
      }

    从上面的例子中,可以看到:

    Statement 1 在循环开始之前设置变量 (var i=0)。

    Statement 2 定义循环运行的条件(i 必须小于 5)。

    Statement 3 在每次代码块已被执行后增加一个值 (i++)。

    2、for/in - 循环遍历对象的属性

    var person={fname:"John",lname:"Doe",age:25};
    
    for (x in person)
      {
      txt=txt + person[x];
      }

    3、while - 当指定的条件为 true 时循环指定的代码块

    如果忘记增加条件中所用变量的值,该循环永远不会结束

    while (i<5)
      {
      x=x + "The number is " + i + "<br>";
      i++;
      }

    4、do/while - 同样当指定的条件为 true 时循环指定的代码块

    do/while 循环是 while 循环的变体。该循环会执行一次代码块,在检查条件是否为真之前,然后如果条件为真的话,就会重复这个循环。循环至少会执行一次,即使条件是 false,隐藏代码块会在条件被测试前执行

    do
      {
      x=x + "The number is " + i + "<br>";
      i++;
      }
    while (i<5);

    二、foreach 用于调用数组的每个元素,并将元素传递给回调函数。注意: forEach() 对于空数组是不会执行回调函数的。

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

    #for  和  foreach 的总结

    三、map

    .map(callback(index,domElement))

    .map()要比.forEach()执行速度更快。虽然我也说过执行速度不是我们需要考虑的主要因素,但是他们都比for()要更好用,那肯定要选更优化的一个,但是map()方法不会对空数组进行检测。

    第二,.forEach()的返回值并不是array

    var arr = [1, 2, 3];
    
    console.log(
        arr.map(function(i){
            return i+i;
        })
        //链式风格
        .sort()
    );// [2,4,6]
    
    console.log(
        arr.forEach(function(i){
            return i+i;
        })
        //接不起来,断了
        .sort()
    );//TypeError: Cannot read property 'sort' of undefined
    • map:和forEach非常相似,都是用来遍历数组中的每一项值的,用来遍历数组中的每一项;
    • 区别:map的回调函数中支持return返回值;return的是啥,相当于把数组中的这一项变为啥(并不影响原来的数组,只是相当于把原数组克隆一份,把克隆的这一份的数组中的对应项改变了);
    • 不管是forEach还是map 都支持第二个参数值,第二个参数的意思是把匿名回调函数中的this进行修改。

    #map 和 foreach的总结

    1、map速度比foreach快

    2、map会返回一个新数组,不对原数组产生影响,foreach不会产生新数组,

    3、map因为返回数组所以可以链式操作,foreach不能

  • 相关阅读:
    微信小程序路由跳转 wx.navigateTo() 失败
    微信小程序文件下载 wx.downloadFile()、 wx.saveFile() 和 wx.openDocument()
    Vue——项目中接口返回值为函数回调,回调函数定义方法(Vue的方法给原生调用)
    h5页面判断移动端系统为Android或IOS
    解决小程序报错 Page "pages/index/main" has not been registered yet.
    mpvue路由传参报错Cannot read property 'query' of undefined
    解决前端项目启动时报错:Use // eslint-disable-next-line to ignore the next line.
    解决npm报错:Module build failed: TypeError: this.getResolve is not a function
    APIO2016赛艇
    容斥小结
  • 原文地址:https://www.cnblogs.com/sjxx/p/7410710.html
Copyright © 2011-2022 走看看