js数组方法大全(下)


记录一下整理的js数组方法,免得每次要找方法都找不到。图片有点多,注意流量,嘻嘻!

本期分享

  • forEach()
  • map()
  • filer()
  • every()
  • some()
  • reduce()
  • reduceRight()
  • indexOf()
  • lastIndex()

上期分享

  • join()
  • reverse()
  • sort()
  • concat()
  • slice()
  • splice()
  • push()
  • pop()
  • unshift()
  • shift()
  • toString()
  • toLocaleString()

forEach() --->遍历

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:无
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:该方法无法提前终止运行,如果要提前终止运行,只能使用try块中,然后抛出一个异常。
  • 小技巧:如果数组是个数组对象形式可以直接操作数组元素改变原始数组本身,因为对象是个引用数据类型嘛!
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var sum =0;
data.forEach(value=>{
sum+=value;
})
log(sum); data.forEach((v,i,a)=>{
a[i]=v+1;
})
log(data); var data_post=[{a:1},{a:2}]
data_post.forEach(value=>{
value.a++;
})
log(data_post)

map() --->映射

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:返回一个新函数
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:传递给map函数应该有返回值,返回值是新数组的元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.map(x=>{
return x*x;
})
log(b)

filter() --->过滤

  • 使用热度:常用
  • 是否改变原始数组:否
  • 返回:返回过滤后的数组
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:如果返回值是true或者可以转化为true的值,那么这个值就是新数组的元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.filter(x=>{
return x<3;
})
log(b)

every() --->检测

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:true或者false
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:当且仅当针对数组中的所有元素调用绑定函数都返回true时,它才返回true。
  • 注意:一旦every或者some已经确定了改返回什么值得时候就不会遍历数组了。根据数学上的惯例,在空数组调用时,every返回true,some返回false。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.every(x=>{
return x<10;
})
log(b) var c= data.every(x=>{
return x%2===0;
})
log(c)

some() --->检测

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:true或者false
  • 参数:
参数位置 参数类型 是否必选 说明
1 function 三个参数分别是:数组元素、元素的索引、数组本身
  • 说明:当数组中至少有一个元素调用绑定函数返回true时,它就返回true。
  • 注意:一旦every或者some已经确定了改返回什么值得时候就不会遍历数组了。根据数学上的惯例,在空数组调用时,every返回true,some返回false。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.some(x=>{
return x>10;
})
log(b) var c= data.some(x=>{
return x%2===0;
})
log(c)

reduce() --->简化

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:返回一个值
  • 参数:
参数位置 参数类型 是否必选 作用
1 function 四个参数分别是:初始化值/数组元素、数组元素、元素的索引、数组本身
2 number 供计算的初始化值
  • 说明:第一个参数是到目前为止的简化操作累计的结果
  • 注意:如果没有初始化值,第一次调用函数的第一个参数就是第一个数组元素,第二个参数则是第二个数组元素。如果有初始化值,第一次调用函数的第一个参数就是初始化值,二个参数则是第一个数组元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.reduce((x,y)=>{
return x+y;
},0)
log(b) var c= data.reduce((x,y)=>{
return x*y;
},1)
log(c) var d= data.reduce((x,y)=>{
return x>y?x:y;
},1)
log(d)

reduceRight() --->简化

  • 使用热度:不常用
  • 是否改变原始数组:否
  • 返回:返回一个值
  • 参数:
参数位置 参数类型 是否必选 作用
1 function 四个参数分别是:初始化值/数组元素、数组元素、元素的索引、数组本身
2 number 供计算的初始化值
  • 说明:第一个参数是到目前为止的简化操作累计的结果。不同于reduce这个仅仅是从右到左计算。
  • 注意:如果没有初始化值,第一次调用函数的第一个参数就是第一个数组元素,第二个参数则是第二个数组元素。如果有初始化值,第一次调用函数的第一个参数就是初始化值,二个参数则是第一个数组元素。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
data.reduceRight((x,y)=>{
log(y)
return x+y;
},0)

indexOf() --->搜索

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:返回数组索引或者-1
  • 参数:
参数位置 参数类型 是否必选 作用
1 * 要搜索的数组元素
2 number 从数组哪个索引开始搜索
  • 说明:如果能搜索到结果将返回第一个索引,如果搜索不到就返回-1
  • 注意:如果第二个参数是负数,指的是从数组元素末尾的偏移量位置开始向后搜索,而不是到偏移量位置就截止搜索了,这里是很容易和splice弄混的。
  • 实例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b=data.indexOf(1,-5);
log(b);

lastIndexOf() --->搜索

  • 使用热度:经常用
  • 是否改变原始数组:否
  • 返回:返回数组索引或者-1
  • 参数:
参数位置 参数类型 是否必选 作用
1 * 要搜索的数组元素
2 number 从数组哪个索引开始搜索
  • 说明:和indexOf不同的是lashIndexOf是反向搜索
  • 注意:因为是反向搜索,当第二个参数是负数的时候,就是指从末尾偏移量的位置向前搜索
  • 实例如下:
var log=console.log;
var data=[1,2,3,2,5];
var b=data.lastIndexOf(2,-3)
log(b) var c=data.lastIndexOf(1,-5)
log(c)

js数组方法大全(下)的更多相关文章

  1. 转载收藏(js数组方法大全)

    js数组方法大全 JavaScript中创建数组有两种方式 (一)使用 Array 构造函数: var arr1 = new Array(); //创建一个空数组var arr2 = new Arra ...

  2. js数组方法大全(上)

    # js数组方法大全(上) 记录一下整理的js数组方法,免得每次要找方法都找不到.图片有点多,注意流量,嘻嘻! 本期分享 join() reverse() sort() concat() slice( ...

  3. js数组方法大全

    JavaScript中创建数组有两种方式 (一)使用 Array 构造函数: var arr1 = new Array(); //创建一个空数组var arr2 = new Array(20); // ...

  4. js中数组方法大全

    js数组方法大全 一:前言 我们在学到js中数组的时候,我们会接触到js中数组的一些方法,这些方法对我们来说,可以很遍历的达到我们想要的结果,但是因为方法比较多,有些方法也不常用,可能会过一段时间就会 ...

  5. JavaScript数组方法大全(推荐)

    原网址:http://www.jb51.net/article/87930.htm 数组在笔试中经常会出现的面试题,javascript中的数组与其他语言中的数组有些不同,为了方便之后数组的方法学习, ...

  6. 一站式超全JavaScript数组方法大全

    一站式JavaScript数组方法大全(建议收藏) 方法一览表 详细操作 本人总结了JavaScript中有关数组的几乎所有方法(包含ES6之后新增的),并逐一用代码进行演示使用,希望可以帮助大家! ...

  7. js 数组方法比较

    js 数组方法比较 table th:first-of-type { width: 80px; } table th:nth-of-type(2) { width: 120px; } table th ...

  8. js数组方法详解

    Array对象的方法-25个 /*js数组方法详解 */ /* * 1 concat() 用于连接多个数组或者值-------------- * 2 copyWithin() 方法用于从数组的指定位置 ...

  9. JavaScript数组方法大全(第二篇)

    数组方法大全(第二篇) 注意:如有错误欢迎指出,如有雷同纯属巧合,本博客参考书籍JavaScript权威指南,有兴趣的小伙伴可以去翻阅一下哦 forEach()方法 遍历数组,里面可以传递一个方法 v ...

随机推荐

  1. 高通电源管理函数的power_supply的调用关系

    以msm8909为例,高通的主要文件有几个: qpnp-linear-charger.c(线性充电器) qpnp-vm-bms.c(BMS管理) power_supply_core.c(power_s ...

  2. google::Glog

    windows下使用google的Glog库 下载glog-.tar.gz,解压. vs2013打开工程, 有四个项目 libglog libglog_static logging_unittest ...

  3. windows 系统对应的内核版本和自带 iis 版本

    Windows 10 10.0* Windows Server 2016 10.0* Windows 8.1 6.3* Windows Server 2012 R2 6.3* Windows 8 6. ...

  4. php下载文件,线上文件下载

    1.多个文件下载 <?php /* 把知道的图片问题名字做成一个数组 */ $mp4 = ['123','456']; /* count($mp4) 类似于 js 的 $mp4.length * ...

  5. 【RabbitMQ 实战指南】一 延迟队列

    1.什么是延迟队列 延迟队列中存储延迟消息,延迟消息是指当消息被发送到队列中不会立即消费,而是等待一段时间后再消费该消息. 延迟队列很多应用场景,一个典型的应用场景是订单未支付超时取消,用户下单之后3 ...

  6. [线段树系列] LCT打延迟标记的正确姿势

    这一篇博客将教你什么? 如何用LCT打延迟标记,LCT和线段树延迟标记间的关系,为什么延迟标记要这样打. ——正片开始—— 学习这一篇博客前,确保你会以下知识: Link-Cut-Tree,普通线段树 ...

  7. 该虚拟机似乎正在使用中。 如果该虚拟机未在使用,请按“获取所有权(T)”按钮获取它的所有权。否则,请按“取消(C)”按钮以防损坏。 配置文件: ***.vmx。

    打开虚拟机的时候,出现这样的问题: 该虚拟机似乎正在使用中.  如果该虚拟机未在使用,请按“获取所有权(T)”按钮获取它的所有权.否则,请按“取消(C)”按钮以防损坏.  配置文件: D:\VM\wi ...

  8. PHPStorm IntelliJ IDEA 代码缩进风格设置

    关于缩进风格,我还是觉得4空格比tab好 File -> Settings -> Editor -> Code Style: 如图,把Detect and use exsiting ...

  9. KMP算法关键

    Knuth-Morris-Pratt Algorithm 当初写这个博客之后一年多,再次看发现当初并不是完全弄明白了.这里为了“避免重复制造轮子”,引用大神博客. http://blog.csdn.n ...

  10. day4-01 流程控制

    目录 一.if语法 1.什么是if? 2.语法结构 2.1.if 条件: 2.2.if...else: 2.3.if...elif...else: 2.4.if嵌套 二.循环结构 2.1 什么是循环结 ...