1、循环中断差别

具体见示例代码：

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>js for forEach区别 </title>

    </head>

    <body>

        <script src="https://cdn.bootcss.com/lodash.js/4.17.10/lodash.min.js"></script>

        <script type="text/javascript">

            let arr = [1, 2, 3, 4]

            for(let i = 0; i < arr.length; i++) {

                if(arr[i] == 2) {

                    continue;

                    //break;

                }

                console.log(arr[i], '  for')

            }

            for(let i in arr) {

                if(i == 2) {

                    break;

                }

                console.log(arr[i], '   for in')

            }

            for(let i of arr) {

                if(i == 2) {

                    break;

                }

                console.log(i, '   for of')

            }

            arr.forEach(val => {

                if(val == 2) {

                    //此处的return false 仅仅相当于continue

                    return false;

                    //break或者continue均不能使用 会报错，对于map filter方法一样会报错

                    //break;

                    //continue

                }

                console.log(val, '   forEach')

            })

        </script>

    </body>

</html>

数组的迭代方法：every、filter、forEach、map、some均不能使用break或者continue进行中断循环。

以上几个函数的参数都是：一个回调函数 和 一个this的指向

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

2、数组变化时差别

（1）数组添加操作

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>js for forEach区别 </title>

    </head>

    <body>

        <script src="https://cdn.bootcss.com/lodash.js/4.17.10/lodash.min.js"></script>

        <script type="text/javascript">

            let arr = [1, 2, 3, 4]

            for(let i = 0; i < arr.length; i++) {

                if(arr[i] == 2) {

                    //对于添加时，for可以遍历新数组

                    arr.push(5)

                }

                // 输出1 2 3 4 5

                console.log(arr[i], '  for')

            }

            arr.forEach(val => {

                if(val == 2) {

                    //对于添加时，forEach

                    arr.push(5)

                }

                // 输出1 2 3 4 5

                console.log(val, '   forEach')

            })

        </script>

    </body>

</html>

（2）数组更新、删除操作

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <meta http-equiv="X-UA-Compatible" content="ie=edge" />

        <title>js for forEach区别 </title>

    </head>

    <body>

        <script src="https://cdn.bootcss.com/lodash.js/4.17.10/lodash.min.js"></script>

        <script type="text/javascript">

            let arr = [1, 2, 3, 4]

            for(let i = 0; i < arr.length; i++) {

                if(arr[i] == 2) {

                    //对于更新、删除时，for可以遍历新数组

                    arr[1] = 100

                    //arr.splice(i,1)

                }

                // 输出1 100 3 4

                console.log(arr[i], '  for')

            }

            arr.forEach((val, i) => {

                if(val == 2) {

                    //对于更新、删除时，forEach可以遍历新数组

                    val = 100

                    //arr.splice(i,1)

                }

                // 输出1 100 3 4

                console.log(val, '   forEach')

            })

        </script>

    </body>

</html>

js forEach for区别的更多相关文章

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

    一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...

  2. JS中map和foreach的区别以及some和every的用法

    一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...

  3. js forEach参数详解，forEach与for循环区别，forEach中如何删除数组元素

     壹 ❀ 引 在JS开发工作中,遍历数组的操作可谓十分常见了,那么像for循环,forEach此类方法自然也不会陌生,我个人也觉得forEach不值得写一篇博客记录,直到我遇到了一个有趣的问题,我们来 ...

  4. JS中map与forEach的区别

    很多同学可能对于map与forEach的区别不是太了解,今天我们介绍一下JS中的map与forEach方法, 我对map的理解是,这个方法对一个数组arr1中的每一个元素进行遍历(传递给一个数组,参数 ...

  5. 应该用forEach改变数组的值吗? 原生JS forEach()和map()遍历的异同点

    应该用forEach改变数组的值吗? https://segmentfault.com/q/1010000013170900?utm_source=index-hottest 由于js中的数组是引用类 ...

  6. js == 与 === 的区别，‘’与“”的区别

    js == 与 === 的区别 1.对于string,number等基础类型,==和===是有区别的 1)不同类型间比较,==之比较"转化成同一类型后的值"看"值&quo ...

  7. for循环与foreach的区别

    for循环与foreach的区别 foreach 依赖 IEnumerable. 第一次 var a in GetList() 时 调用 GetEnumerator 返回第一个对象 并 赋给a, 以后 ...

  8. every();some();filter();map();forEach()各自区别：

    every();some();filter();map();forEach()各自区别: (1)every()方法:(返回值为boolean类型) 对数组每一项都执行测试函数,知道获得对指定的函数返回 ...

  9. jQuery each和js forEach用法比较

    本文实例分析了jQuery each和js forEach用法.分享给大家供大家参考,具体如下: 对于遍历数组的元素,js代码和jquery都有类似的方法,js用的是forEach而jquery用的是 ...

随机推荐

  1. 基础设施即服务 PaaS, 平台即服务 IaaS

    基础设施即服务(Infrastructure as a Service,简称IaaS)是消费者使用处理.储存.网络以及各种基础运算资源,部署与执行操作系统或应用程序等各种软件. 客户端无须购买服务器. ...

  2. BitTorrent Sync 老版本

    Sync version 1.4.111 Installer for Windows: BTSync.exe BTSync_x64.exe Installer for OSX: BTSync.dmgG ...

  3. Thinkpad T440p安装Linux的种种问题（by quqi99)

    作者:张华  发表于:2014-05-08 版权声明:能够随意转载,转载时请务必以超链接形式标明文章原始出处和作者信息及本版权声明 (http://blog.csdn.net/quqi99 ) Thi ...

  4. Pig系统分析(5)-从Logical Plan到Physical Plan

    Physical Plan生成过程 优化后的逻辑运行计划被LogToPhyTranslationVisitor处理,生成物理运行计划. 这是一个经典的Vistor设计模式应用场景. 当中,LogToP ...

  5. MFC绘制直方图和饼图

    转载原文: Normal 0 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE /* Style Definitions */ table.MsoNorma ...

  6. mac 下 outlook 邮箱 服务器端口设置

  7. arcgis python 沿线生成点

    # coding: utf-8 """ Source Name: generatepointsfromlines.py Version: ArcGIS 10.4/Pro ...

  8. Lucene TFIDF打分公式

    还没读TFIDFSimilarity的代码,读了一下lucene的文档,没有特复杂,感觉还是非常严谨的. 对于查询q和文档d,如果查询为纯token查询,套用向量空间模型(VSM),相似度度量使用余弦 ...

  9. Web系统自己主动化部署脚本

    Web开发的项目,除了在本地直接执行外,还可能常常须要在server上部署. 写了个自己主动化部署的脚本,仅供參考. 不少地方须要配置路径.个人建议使用绝对路径,不用依赖执行脚本时所在的路径. #!/ ...

  10. C语言：用二进制方式向文件读写一组数据(fread、fwrite)

    #include<stdio.h> #define SIZE 10 struct student { char name[10]; int num; int age; char addr[ ...