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. 计算机网络知识点总结2:IP协议(IPV4)

    一.Internet网络是一种数据报网络(另一种是虚电路网络,用于ATM等),主要功能是路由和转发. 二.IP数据报(分组)格式(IPV4版本) 首部 描述 版本号(4bit) 描述IP协议的版本号, ...

  2. opencv::绘制-基本几何

    画线 cv::line(LINE_4\LINE_8\LINE_AA) 画椭圆 cv::ellipse 画矩形 cv::rectangle 画圆 cv::circle 画填充 cv::fillPoly ...

  3. 第三方软件 radmin提权

    一款远控工具 端口扫描 4899 端口 上传 radmin.asp 木马读取 radmin的加密密文 下载radmin工具连接

  4. 清理git仓库

    参考 https://harttle.land/2016/03/22/purge-large-files-in-gitrepo.html https://git-scm.com/docs/git-re ...

  5. git的使用和常用命令

    git介绍 git 是一个免费开源的分布式版本控制系统 git可以实现各个版本之间的来回穿梭 git可以远程托管代码 git可以完成团队合作 workspace --add--> index - ...

  6. join的使用

    我们还是以这四张表为例:1.left joinselect * from student a left join score b on a.sid=b.sid; 也就是说A中的元素都会显示,没有值的用 ...

  7. ArcGIS Engine添加地图元素的实现

    在ArcGIS中,我们使用的制图控件除了MapControl之外,还有PageLayoutControl,用于页面布局和制图,生成一幅成品地图. PageLayoutControl 封装了PageLa ...

  8. 原生js实现导航栏吸顶

    实现滑动滚动条让导航栏吸顶原理:主要是通过监听scroll,设定一个滚动条垂直位移作为临界,让导航栏吸顶或者取消吸顶. 话不多说了,代码如下: window.onscroll = function ( ...

  9. 小白学 Python(16):基础数据类型(函数)(上)

    人生苦短,我选Python 前文传送门 小白学 Python(1):开篇 小白学 Python(2):基础数据类型(上) 小白学 Python(3):基础数据类型(下) 小白学 Python(4):变 ...

  10. 爬取bing背景图片

    因为工作环境的原因,没办法用梯子,也不喜欢用某度,只能用bing,发现背景图片蛮好看的,刚好最近在学习摄影,需要提高审美,就想着把bing背景图片都爬去下来做桌面背景.写的代码比较入门,只是做个记录, ...