1、map方法

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <title>map方法</title>

    </head>

    <body>

        <script type="text/javascript">

            var arr = [6, 5, 4];

            var arrNew = [];

            arrNew = arr.map(function(value, index, arr) {

                console.log('当前值：' + value);

                console.log('当前值对应的索引：' + index);

                console.log('原数组：' + arr);

                return value * value

            });

            //map返回新数组

            console.log(arrNew);

        </script>

    </body>

</html>

控制台输出为：

2、filter方法

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <title>filter方法</title>

    </head>

    <body>

        <script type="text/javascript">

            var arr = [6, 5, 4];

            var arrNew = [];

            arrNew = arr.filter(function(value, index, arr) {

                console.log('当前值：' + value);

                console.log('当前值对应的索引：' + index);

                console.log('原数组：' + arr);

                return value % 2 == 0;

            });

            //map返回新数组

            console.log(arrNew);

        </script>

    </body>

</html>

控制台输出为：

3、forEach方法

<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="UTF-8" />

        <title>forEach方法</title>

    </head>

    <body>

        <script type="text/javascript">

            var arr = [6, 5, 4];

            var total = 0;

            arr.forEach(function(value, index, arr) {

                console.log('当前值：' + value);

                console.log('当前值对应的索引：' + index);

                console.log('原数组：' + arr);

                total += value

            });

            console.log(total);

        </script>

    </body>

</html>

控制台输出：

总结：以上函数的回调函数的形参是一样的。

注意：jQuery中的each的参数是：

$(selector).each(function(index,element))
是不一样的顺序。

js map、filter、forEach的更多相关文章

  1. (转载)js数组中的find、filter、forEach、map四个方法的详解和应用实例

    数组中的find.filter.forEach.map四个语法很相近,为了方便记忆,真正的掌握它们的用法,所以就把它们总结在一起喽. find():返回通过测试的数组的第一个元素的值 在第一次调用 c ...

  2. JavaScript数组方法的兼容性写法 汇总：indexOf()、forEach()、map()、filter()、some()、every()

    ECMA Script5中数组方法如indexOf().forEach().map().filter().some()并不支持IE6-8,但是国内依然有一大部分用户使用IE6-8,而以上数组方法又确实 ...

  3. JavaScript高级编程——Array数组迭代（every()、filter()、foreach()、map()、some()，归并（reduce() 和reduceRight() ））

    JavaScript高级编程——Array数组迭代(every().filter().foreach().map().some(),归并(reduce() 和reduceRight() )) < ...

  4. react+redux教程（三）reduce()、filter()、map()、some()、every()、...展开属性

    reduce().filter().map().some().every()....展开属性   这些概念属于es5.es6中的语法,跟react+redux并没有什么联系,我们直接在https:// ...

  5. ES5新增数组方法every()、some()、filter()、map()

    JavaScript ES5标准中新增了一些Array方法,如every().some().filter().map().它们的出现使我们能够更加便利地操作数组,但对IE9以下浏览器的兼容性比较差.下 ...

  6. reduce()、filter()、map()、some()、every()、...展开属性

    reduce().filter().map().some().every()....展开属性   这些概念属于es5.es6中的语法,跟react+redux并没有什么联系,我们直接在https:// ...

  7. 辅助函数和高阶函数 map、filter、reduce

    辅助函数和高阶函数 map.filter.reduce: 一.辅助函数:(1-1)响应式函数 (数组更新检测):    push()    pop()    shift()    unshift()  ...

  8. Python基础三. 函数、lambda、filter、map、reduce

    一.概述 函数, 就是用一些语句组织起来实现一组特定的功能, 用来重复调用. 函数的作用及意义:最大化的重用代码和最小化的代码冗余以及对流程的分解. Python中有哪些函数: 内建的函数 第三方模块 ...

  9. Swift函数编程之Map、Filter、Reduce

    在Swift语言中使用Map.Filter.Reduce对Array.Dictionary等集合类型(collection type)进行操作可能对一部分人来说还不是那么的习惯.对于没有接触过函数式编 ...

  10. python之map、filter、reduce、lambda函数 转

    python之map.filter.reduce.lambda函数  转  http://www.cnblogs.com/kaituorensheng/p/5300340.html 阅读目录 map ...

随机推荐

  1. 运行微信支付demo

    首先要说说写这篇文章的初衷:集成支付宝支付运行demo都是可以正常运行的,但是我下载下来微信支付的demo,却发现一大堆报错,而且相关文章几乎没有,可能大家觉得没必要,也许你觉得很简单:但是技术大牛都 ...

  2. 【cocos2d-js官方文档】三、Bake功能使用说明

    设计意图 在游戏开发的过程中,经常会遇到作为UI或者不怎么修改的背景的层(Layer), 这些层内容并不怎么变动. 而在游戏的渲染过程中,这些层往往又会消耗大量的渲染时间,特别是比较复杂的UI界面,比 ...

  3. Appium +Python 连接真机测试

    1.数据线连接电脑和手机: 2.用adb获取手机的UUID:cmd-> adb devices 前面的就是你手机的UUID 3.打开appium,选择手机的安卓版本(关于手机中查看),填写手机的 ...

  4. 洛谷 P3371 【模板】单源最短路径 【链式前向星+SPFA】

    题目描述 如题,给出一个有向图,请输出从某一点出发到所有点的最短路径长度. 输入输出格式 输入格式: 第一行包含三个整数N.M.S,分别表示点的个数.有向边的个数.出发点的编号. 接下来M行每行包含三 ...

  5. Codeforces #427 Div2 D

    #427 Div2 D 题意 给出一个字符串,求它的子串中为 \(k-palindrome\) 的个数. \(1-palindrome\) 要求是一个回文串. \(k-palindrome (k &g ...

  6. 23、Django实战第23天：视频播放页面

    打开素材course-play.html,会发现播放页面处了包含播放器,其他和“章节”页面一样. 1.把course-play.html复制到template目录下 2.把下面两段代码拷贝出来 < ...

  7. AOJ 2266 Cache Strategy（费用流）

    [题目链接] http://judge.u-aizu.ac.jp/onlinejudge/description.jsp?id=2266 [题目大意] 有M个桶,N个球,球编号为1到N,每个球都有重量 ...

  8. [xsy1140]求值

    $\newcommand{ali}[1]{\begin{align*}#1\end{align*}}$题意:给定$n,b,c,d,e,a_{0\cdots n-1}$,令$x_k=bc^{4k}+dc ...

  9. 【分块答案】【最小割】bzoj1532 [POI2005]Kos-Dicing

    引用zky的题解:http://blog.csdn.net/iamzky/article/details/39667859 每条S-T路径代表一次比赛的结果.最小割会尽量让一个人赢得最多. 因为二分总 ...

  10. JavaScript异步编程的Promise模式(转)

    异步模式在web编程中变得越来越重要,对于web主流语言Javascript来说,这种模式实现起来不是很利索,为此,许多Javascript库(比如 jQuery和Dojo)添加了一种称为promis ...