JavaScript数组的5种迭代方法

ES5为数组定义了5个迭代方法。每种方法都接收两个参数。要在每一项上运行的函数和（可选的）运行该函数的作用域对象--影响this的值。//其中（可选的）这个参数暂时未遇到过。

其中，函数都接收三个参数（数组中的每一项、每一项的索引值、数组对象本身）。

下面是5中方法的介绍：

every() :　对数组中的每一项执行函数，如果每一项都返回 true ,则该方法返回 true。

some():     对数组中的每一项执行函数，只要有一项返回了 true ,则该方法返回 true。

filter():       对数组中的每一项执行函数，把里面返回 true 的项，组成一个数组返回。

forEach()  对数组中的每一项执行函数，没有返回值。类似于for循环。

map()       对数组中的每一项执行函数，返回（处理后的）每一项。

以上5种方法，都不会改变数组本身。

forEach和map的比较：

  var arr = [1,2,3,4,5];
  //every() filter() some() forEach() map()
  var res = arr.every(function(i,index,o){
    return i>2;
  });
  console.log(arr); //[1,2,3,4,5]
  console.log(res); //false

  var some = arr.some(function (i, k, l) {
    return i>2;
  });
  console.log(arr);//[1,2,3,4,5]
  console.log(some);//true

  var filter = arr.filter(function (i, k, l) {
    return i>2;
  });
  console.log(arr);//[1,2,3,4,5]
  console.log(filter);//[3,4,5]

  var forEach = arr.forEach(function (i, k, l) {
    return i>2;
  });
  console.log(arr);//[1,2,3,4,5]
  console.log(forEach);//undefined

  var map = arr.map(function (i, k, l) {
    return i>2;
  });
  console.log(arr);//[1,2,3,4,5]
  console.log(map);//[false,false,true,true,true]

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • javascript中Array数组的迭代方法实例分析

    本文实例讲述了javascript迭代的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: //filter() 利用指定的函数确定是否返回数组中包涵的某一项 var num = [1,2,3,4,5,6,12]; num.filter(function(item, index, array){ return (item > 2); //[3, 4, 5, 6, 12] }); //map() 返回一个数组,数组中每一项都是在原始数组中的对应项上运行传入参数的结果 var nu

  • js数组的五种迭代方法及两种归并方法(推荐)

    js数组的五种迭代方法及两种归并方法(推荐) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta ht

  • 详谈JS中数组的迭代方法和归并方法

    数组的迭代方法 ES5中为数组定义了5个迭代方法.每个方法都要接收两个参数:要在每一项上面运行的函数和(可选的)运行该函数的作用域对象---影响this的值. 传入方法中的函数会介绍三个参数:1.数组项的值 2. 该项在数组的中位值 3. 数组对象本身: every()和some()方法 every():对数组中的每一项运行给定函数,如果每一项都返回true,则返回true,否则false: some():对数组中的每一项运行给定函数,如果至少有一项返回true,则返回true,否则false:

  • js 数组实现一个类似ruby的迭代器

    js 数组实现一个类似ruby的迭代器

    分为如下几节: ·基本实现 ·在迭代中引用原来的对象,或者直接改变数组的值而不是返回一个新数组 ·向迭代传入无限多的参数 ·基本实现 今天突然发现js的数组处理起来真是麻烦,代码一些就是一大堆,相比起ruby的迭代器来真是逊色不少,主要是要写的代码太多了,也许是js有特殊的处理数组的方式,真是我不知道而已,但是我真的想自己给js实现一个类似ruby的迭代器的东东,而且实现起来也不难,那就开始动手吧. 真的应该庆幸js是动态语言啊,如果是静态语言,实现起来很不方便(别说要我重新定义一个继承自arr

  • JS的数组迭代方法

    本文实例讲述了JS的数组迭代方法.分享给大家供大家参考.具体实现方法如下: <!doctype html> <html> <head lang="zh"> <meta charset="utf-8"> <title>js数组迭代</title> <meta name="renderer" content="webkit"> <script

  • JavaScript数组迭代方法

    最近工作中经常涉及到数据的处理,数组尤其常见,经常需要对其进行遍历.转换操作,网上的文章零零散散,不得已自己又找出红宝书来翻出来看,顺便记一笔,便于以后查询. 数组常用的迭代方法 ECMAScript5为数组定义了5个迭代方法.每个方法都接受两个参数:要在每一项上运行的函数fn和(可选的)运行该函数的作用域对象--影响 `this` 的值. 传入这些方法中的函数(fn)会接收3个参数:item .index .array; 如: array.forEach(function(item,index

  • 深入JavaScript高级程序设计之对象、数组（栈方法，队列方法，重排序方法，迭代方法）

    继承是OO语言中的一个最为人津津乐道的概念. 许多OO语言都支持两种继承方式:接口继承和实现继承. 接口继承只继承方法签名,而实现继承则继承实际的方法. 如其所述,由于函数没有签名,在ECMAScript中无法实现接口继承. ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的. 1.使用对象字面量定义对象 var person={}; 使用这种方式创建对象时,实际上不会调用Object构造函数. 开发人员更喜欢对象字面量的语法. 2.有时候需要传递大量可选参数的情形时,一

  • javaScript数组迭代方法详解

    本文为大家介绍了javaScript数组迭代方法,供大家参考,具体内容如下 每个方法都接收两个参数:要在每一项上运行的函数  和  (可选的)运行该函数的作用域对象. 传入这些方法中的函数会接收三个参数:数组项的值,该项在数组中的位置,数组对象本身. forEach()  对数组中的每一项运行 给定函数.该方法没有返回值. every()  对数组中的每一项运行 给定函数,如果数组的每一项都返回true,则返回true. some()  对数组中的每一项运行 给定函数,如果数组的任意一项返回tr

  • JavaScript数组迭代器实例分析

    本文实例讲述了JavaScript数组迭代器用法.分享给大家供大家参考.具体如下: 这里注意:如果数组中有0.false."".null.NaN迭代器将会停止 function createIterator(x) { var i = 0; return function(){ return x[i++]; }; } var iterator=createIterator(['a','b','c','d','e','f','g']); var current; while(current

  • JavaScript数组的5种迭代方法

    ES5为数组定义了5个迭代方法.每种方法都接收两个参数.要在每一项上运行的函数和(可选的)运行该函数的作用域对象--影响this的值.//其中(可选的)这个参数暂时未遇到过. 其中,函数都接收三个参数(数组中的每一项.每一项的索引值.数组对象本身). 下面是5中方法的介绍: every() : 对数组中的每一项执行函数,如果每一项都返回 true ,则该方法返回 true. some():     对数组中的每一项执行函数,只要有一项返回了 true ,则该方法返回 true. filter()

  • JavaScript函数的4种调用方法实例分析

    本文实例讲述了JavaScript函数的4种调用方法.分享给大家供大家参考,具体如下: JavaScript 函数有 4 种调用方式: 1. 作为一个函数调用 2. 函数作为方法调用 3. 使用构造函数调用函数 4. 作为函数方法调用函数 分述如下: 每种方式的不同方式在于 this 的初始化. 作为一个函数调用 function myFunction(a, b) { return a * b; } myFunction(10, 2); // myFunction(10, 2) 返回 20 以上

  • JavaScript数组实例的9个方法

    JavaScript数组实例的9个方法

    目录 前言 map filter some every reduce forEach find和findIndex join 总结 前言 手写JS原生API在面试中很常见,今天努力工作之余(摸鱼的时候)翻到了MDN文章中关于数组实例方法这部分,正好无聊就手写几个实例方法玩玩,复习一下基础内容,并记录一下. 如果你还不知道数组实例中迭代方法有什么区别,可以看下面这张图: map 这个方法会返回一个新的数组,数组中的每一项都是执行过map提供的回调函数结果. 实现代码如下: const map =

  • JavaScript数组前面插入元素的方法

    本文实例讲述了JavaScript数组前面插入元素的方法.分享给大家供大家参考.具体如下: JS数组带有一个unshift方法可以再数组前面添加若干个元素,下面是详细的代码演示 复制代码 代码如下: <!DOCTYPE html> <html> <body> <p id="demo">Click the button to add elements to the array.</p> <button onclick=&q

  • 对Python中数组的几种使用方法总结

    二维数组的初始化 matirx_done = [[0 for i in range(0, len(matirx))]for j in range(0, len(matirx[0]))] 就将其初始化为一个与matrix相同大小的元素全为 0 的矩阵 数组的多级排序 在数组 idea_collect = [[3, 1, 2], [3, 2, 1], [3, 2, 2], [3, 1, 1]] 中, 先按照第二项排列, 再按照第三项倒序排列 可写为: idea_collect.sort(key=la

  • js数组的 entries() 获取迭代方法

    目录 1.entires() 方法语法详解 2.entires() 方法常见使用及注意 2.1 返回迭代器对象 2.2 for...of...的使用 2.3 二维数组行排序 1.entires() 方法语法详解 entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value) . 迭代对象中数组的索引值作为 key, 数组元素作为 value.它的原型(__proto__:Array Iterator)上有一个next方法,可用用于遍历迭代器取得原数组的[key,v

  • JavaScript中的几种继承方法示例

    JavaScript中的几种继承方法示例

    1.原型链继承 原理: 子类原型指向父类实例对象实现原型共享,即Son.prototype = new Father(). 这里先简单介绍下原型 js中每个对象都有一个__proto__属性,这个属性指向的就是该对象的原型.js中每个函数都有一个prototype属性,这个属性指向该函数作为构造函数调用时创建的实例的原型.原型对象上有一个constructor属性,指向创建该对象的构造函数,该属性不可枚举. var obj = {}; obj.__proto__ === Object.proto

  • JavaScript对象的四种创建方法

    JavaScript对象的四种创建方法

    目录 前言 1. 基于对象字面量 2. 利用new Object方式创建对象 3. 基于构造函数 4. 基于工厂方法 前言 今天我们来学习一下JavaScript中关于对象的四种创建方法. 首先,我们来确定一个对象的属性和方法.比如说,我们想要我们定义一个girlFriend的对象,希望她有名字name.年龄age的属性,希望有一个getName方法,来获取名字:最后属性是一个稍微复杂的对象属性address,它具有两个属性值,所在地name和邮政编码code. 接下来,我们来通过本篇内容,来看

  • Javascript setInterval的两种调用方法(实例讲解)

    如下所示: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head>    <title>&l

随机推荐