首先总结的意义就是让杂乱无章变得更加井然有序,这样在使用的过程思路会更加清晰。

数组使用方法注意点:

  • 变异方法和非变异方法。即变异方法使用会改变原数组,后者则不会。下面脑图将其进行了标注。
  • 你或许需要注意数组方法和字符串方法有几个方法相似,数组和字符串是如何切换的?
  • 有些方法参数是支持负数的,有些方法第二个参数不是代表坐标代表的是个数。
  • 甚至回调函数我们也可以将其梳理一遍,大部分回调函数参数格式是一样的,有些回调函数是不一样的。
  • 当split,slice,splice,join,contains,includes,push,pop,shift,unshift甚至你被相似的单词搞得晕头转向,以至于你分不清哪个是数组的方法哪个是字符串方法,哪个功能是干嘛来着。当然我现在可以告诉你上面那些方法究竟是数组方法还是字符串方法,甚至字符串方法和数组都有这么一个方法,但是没必要,因为你终究很难记住。所以下面将其进行系统的归类总结,你就很容易区分出来了。

接下来你只需要忘记你之前杂乱无章的记忆,通过梳理重新建立你的记忆。

在这里插入图片描述

数组常用方法

数组元素增添和删除

操作数组头部

  • unshift(value)变异方法 数组头部插入一个元素
  • shift()变异方法 移出数组头部的第一个元素

操作数组尾部

  • push(value) 变异方法 向数组尾部压入一个元素
  • pop() 变异方法 弹出数组尾部一个元素

任意位置增删

splice(start,length[…,value]) 变异方法

第二个参数为个数,不为0的时候表示需要从start开始删除length个元素支持增删一起做。

数组拼接

  • concat(…arr) 字符串有该类似方法 

数组转换成字符串

  • join(str) 以指定字符进行拼接将数组转换成字符串
  • toString() 以","号进行分割将数组转换字符串

截取数组

  • slice(start[,end])支持负数 字符串有该类似方法 

数组排序方法

排序

  • sort(callback)变异方法 对数组进行排序

回调函数返回 a-b为从大到小进行排序,b-a则为从小到大进行排序。

//callback回调函数格式
function callback(a,b) {
	return a-b
}

顺序翻转

reverse()变异方法 对数组的顺序进行反转

数组迭代方法

数组遍历查找

返回值为下标

  • indexOf(targetValue) 从左到右数组进行遍历,查找目标值的所在下标,返回第一次出现的下标值.
  • lastIndexOf(targetValue) 从右到左对数组进行遍历,查找目标值所在下标,返回第一次出现的下标值.
  • findIndex(callback) 通过回调函数对数组元素进行条件判断,返回第一次满足条件的元素下标值

返回值为内容

  • find(callback) 通过回调函数对数组元素进行条件判断,返回第一次满足条件的元素值 

数组遍历处理

callback(value[,index[,array]])

//callback回调函数格式
function callback( value, index, array) {
	//处理
	...
	return ... //此处是否不需要retrun语句下面对其进行标注
}
  • forEach(callback) 对数组进行遍历处理仅处理无返回值。callback不需要return语句
  • map(callback) 遍历数组每一个元素使用callback对数组进行处理,并且将callback处理过的返回值加入到新数组并返回新数组。
  • filter(callback) 对数组进行过滤操作,返回callback返回值为true的元素组成的新数组。
  • every(callback) 对数组进行遍历,如果callback返回值都为true,则方法的返回值为true
  • some(callback) 对数组进行遍历,如果callback返回值有一个为true,则方法的返回值为true

callback(total,value[,index[,array]])

//callback回调函数格式
function callback(total, value, index, array) {
  return total   value;
}
  • reduce(callback[,初始值])

从左往右数组依次缩短,同时上一次处理的结果total传入下次回调函数的作为参数供回调函数使用

  • reduceRight(callback[,初始值])

从右往左数组依次缩短,同时上一次处理的结果total传入下次回调函数的作为参数供回调函数使用

数组其他方法

includes(value) ES6 判断数组是否包含某个元素

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注Devmax的更多内容!

JavaScript数组方法-系统性总结详解的更多相关文章

  1. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  2. html5使用canvas实现弹幕功能示例

    这篇文章主要介绍了html5使用canvas实现弹幕功能示例的相关资料,需要的朋友可以参考下

  3. HTML5数字输入仅接受整数的实现代码

    这篇文章主要介绍了HTML5数字输入仅接受整数的实现代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  4. amaze ui 的使用详细教程

    这篇文章主要介绍了amaze ui 的使用详细教程,本文通过多种方法给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  5. html5简介_动力节点Java学院整理

    这篇文章主要介绍了html5简介,用于指定构建网页的元素,这些元素中的大多数都用于描述网页内容,有兴趣的可以了解一下

  6. 前端实现弹幕效果的方法总结(包含css3和canvas的实现方式)

    这篇文章主要介绍了前端实现弹幕效果的方法总结(包含css3和canvas的实现方式)的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. H5 canvas实现贪吃蛇小游戏

    本篇文章主要介绍了H5 canvas实现贪吃蛇小游戏,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  8. ios – parse.com用于键,预期字符串的无效类型,但是得到了数组

    我尝试将我的数据保存到parse.com.我已经预先在parse.com上创建了一个名为’SomeClass’的类.它有一个名为’mySpecialColumn’的列,其数据类型为String.这是我尝试使用以下代码保存数据的代码:如果我运行这个我得到:错误:密钥mySpecialColumn的无效类型,预期字符串,但得到数组这就是我在parse.com上的核心外观:有谁知道我为什么会收到这个错误?

  9. ios – 上下文类型’NSFastEnumeration’不能与数组文字一起使用

    斯威夫特3,你会这样做吗?解决方法正如您所发现的,您不能使用as-casting将数组文字的类型指定为NSFastEnumeration.您需要找到一个符合NSFastEnumeration的正确类,在您的情况下它是NSArray.通常写这样的东西:

  10. ios 8 Homescreen webapp,关闭和打开iPad停止javascript

    我有一个适用于iPad的全屏HTML5网络应用程序,并且刚刚安装了IOS8来试用它,它一切正常,直到你关闭并重新启动iPad.一旦web应用程序重新启动javascript就会停止并加载新页面不会重新启动它.在iPad上的Safari中打开同一页面时,关闭和打开iPad会继续按预期工作.其他人注意到了这个或想出了一个解决方案吗?解决方法这似乎是我在iOS8.1.1更新中解决的.

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部