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. CareerCup之1.3字符串去重

    [题目] 原文: 1.3 Design an algorithm and write code to remove the duplicate characters in a string witho ...

  2. 5V and 3V Level Translators

    http://www.daycounter.com/Circuits/Level-Translators/Level-Translators.phtml Interfacing 5V and 3V l ...

  3. Matlab的linprog解决简单线性规划问题

    一个简单的线性规划问题,使用Matlab的linprog解决 假定有n种煤,各种煤的配比为x1,x2,x3,……首先需要满足下列两个约束条件,即 x1+x2+x3……+xn=1 x1≥0, x2≥0, ...

  4. OSChina 周日乱弹 —— 超酷炫 58 页年终总结，笑喷！

    猿文:http://my.oschina.net/xxiaobian/blog/368981 借鉴一下以下的各种年终总结吧,总有适合你的... OSCer 们,小小编掐指一算,你命里真的缺我啊,赶紧给 ...

  5. arcgis10.5新功能图形缓冲

    摘要 在输入要素周围某一指定距离内创建缓冲区多边形.在要素周围生成缓冲区时,大部分制图形状对缓冲区末端(端头)和拐角(连接)可用. 插图  

  6. Spring jdbcTemplat 写入BLOB数据为空

        近日做平台新闻接口,数据库用的是Oracle10g,项目使用Spring框架,新闻表内有一字段为BLOB类型,可是在写入时遇到了写入后BLOB字段为空,替换了Spring 的jar包无效,跟b ...

  7. Ubuntu安装Oracle时出现乱码,及其他安装错误

    只要在运行./runInstaller之前先运行下以下命令就ok了: export LANG=en_US #设置运行语言 编译错误 ln -s /usr/lib/i386-linux-gnu/libp ...

  8. JQuery文件上传及以Base64字符串形式呈现图片

    一:上传之 首先,你必然得有一个 file input,如下: <td>     <img id="imgGif" style="display: no ...

  9. 进程操作篇atexit execl exit fprintf fscanf getpid nice get priority printf setpid system vfork wait waitpid

    atexit(设置程序正常结束前调用的函数) 相关函数 _exit,exit,on_exit 表头文件 #include<stdlib.h> 定义函数 int atexit (void ( ...

  10. 如何记录linux终端下的操作日志

    如何记录linux终端下的操作日志 在linux终端下,为方便检查操作中可能出现的错误,以及避免屏幕滚屏的限制,我们可以把操作日志记录下来.常用的工具有 screen,script,以及tee等,通过 ...