文档章节

JS中some(),every(),forEach(),map(),filter()区别

G
 GreatWall2017
发布于 2017/08/02 14:19
字数 475
阅读 17
收藏 0

js在1.6中为Array新增了几个方法map(),filter(),some(),every(),forEach(),也就是一共有这么多方法了。

刚开始接触这些倒也记得不是很清楚,在此纪录一下以加深影响。我主要从两个角度来理解和记忆吧,一个是API的使用,一个是内部实现。

函数简述

map():返回一个新的Array,每个元素为调用func的结果

filter():返回一个符合func条件的元素数组

some():返回一个boolean,判断是否有元素是否符合func条件

every():返回一个boolean,判断每个元素是否符合func条件

forEach():没有返回值,只是针对每个元素调用func

API的区别

function my_func(item) {
  if (item == 1) {
    console.log('t');
    return true;
  }
  console.log('f');
  return false;
}

// init an array
l = [0,1,2,3,4]

// print: f,t,f,f,f
// return:[false, true, false, false, false]
l.map(my_func)


// print: f,t,f,f,f
// return: 1
l.filter(my_func)

// print: f,t
// return: true
l.some(my_func)

// print: f
// return: false
l.every(my_func)

// print: f,t,f,f,f
//return: undefined
l.forEach(my_func)
内部实现

// From:http://developer.mozilla.org

Array.prototype.map = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var res = new Array(len);
  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this)
      res[i] = fun.call(thisp, this[i], i, this);
  }

  return res;
};

Array.prototype.filter = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var res = new Array();
  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this)
    {
      var val = this[i]; // in case fun mutates this
      if (fun.call(thisp, val, i, this))
        res.push(val);
    }
  }

  return res;
};

Array.prototype.some = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this && fun.call(thisp, this[i], i, this))
      return true;
  }

  return false;
};

Array.prototype.every = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this && !fun.call(thisp, this[i], i, this))
    return false;
  }

  return true;
};

Array.prototype.forEach = function(fun /*, thisp*/)
{
  var len = this.length;
  if (typeof fun != "function")
    throw new TypeError();

  var thisp = arguments[1];
  for (var i = 0; i < len; i++)
  {
    if (i in this)
      fun.call(thisp, this[i], i, this);
  }
};

 

本文转载自:http://blog.csdn.net/github_31392345/article/details/48631067

上一篇: canvas时钟
下一篇: 弹窗插件
G
粉丝 0
博文 25
码字总数 13402
作品 0
深圳
私信 提问
对一个数组 FILTER、SOME、MAP、FOREACH的操作分别有什么作用?

大家好,我是IT修真院北京总院第24期的学员,一枚正直纯洁善良的web程序员 今天给大家分享一下,修真院官网JS任务4,深度思考中的知识点——对一个数组 FILTER、SOME、MAP、FOREACH的操作分别...

我是一只北极熊啊
2017/12/23
0
0
深入了解JavaScript 中的For循环之详解

前言(https://promotion.aliyun.com/ntms/yunparter/invite.html?userCode=cklf8z5w): 今天我想分享一个有关于循环筛选的知识点,也许是前端小白的你首先想到的是用for循环做筛选,但我这种小...

苏南-首席填坑官
01/10
20
0
Javascript数组的5种迭代方法

#Javascript数组的5种迭代方法 数组当中定义了5个迭代方法,传入这些方法中的函数会接受三个参数,数组项的值,该项在数组的位置,和数组对象本身,以下是5个迭代方法的作用。 1、every方法:...

hhhyyy
2018/08/09
0
0
JavaScript编程趋势:用map和filter替换forEach

当你需要拷贝一个数组的全部或者部分到一个新数组的时候,优先使用map和filter而不是forEach。 咨询工作的好处之一是我可以看到无数的项目。这些项目在规模、使用的编程语言和开发人员的能力...

IT智云编程
2018/10/19
0
0
「前端练习场」原生 JavaScript 手写各种 数组 API

前言 JavaScript 中的数组类型提供了很多原生方法供我们使用,本文会 模拟实现 一些常用的数组 API。 「前端练习场」 将会持续更新,不同于之前的 【前端进阶之路】 和 【从头到脚】 这两个系...

大灰狼的小绵羊哥哥
05/05
0
0

没有更多内容

加载失败,请刷新页面

加载更多

好程序员大数据学习路线分享函数+map映射+元祖

好程序员大数据学习路线分享函数+map映射+元祖,大数据各个平台上的语言实现 hadoop 由java实现,2003年至今,三大块:数据处理,数据存储,数据计算 存储: hbase --> 数据成表 处理: hive --> 数...

好程序员官方
今天
6
0
tabel 中含有复选框的列 数据理解

1、el-ui中实现某一列为复选框 实现多选非常简单: 手动添加一个el-table-column,设type属性为selction即可; 2、@selection-change事件:选项发生勾选状态变化时触发该事件 <el-table @sel...

everthing
今天
6
0
【技术分享】TestFlight测试的流程文档

上架基本需求资料 1、苹果开发者账号(如还没账号先申请-苹果开发者账号申请教程) 2、开发好的APP 通过本篇教程,可以学习到ios证书申请和打包ipa上传到appstoreconnect.apple.com进行TestF...

qtb999
今天
10
0
再见 Spring Boot 1.X,Spring Boot 2.X 走向舞台中心

2019年8月6日,Spring 官方在其博客宣布,Spring Boot 1.x 停止维护,Spring Boot 1.x 生命周期正式结束。 其实早在2018年7月30号,Spring 官方就已经在博客进行过预告,Spring Boot 1.X 将维...

Java技术剑
今天
17
0
浅谈java过滤器Filter

一、简介 Servlet中的过滤器Filter是实现了javax.servlet.Filter接口的服务器端程序,主要的用途是过滤字符编码、做一些业务逻辑判断如是否有权限访问页面等。其工作原理是,只要你在web.xml...

青衣霓裳
今天
9
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部