JavaScript引用类型之Array类型API详解

原创 年树先生 随笔 前端技术 9404阅读 13 天前 举报

Array类型也是ECMASCRIPT中最常见的数据类型,而且数据的每一项可以保存任何类型的数值,而且数组的大小是可以动态调整的,可以随着数据的添加自动增长以容纳新的数据。下面,总结数据的一些常用方法:

JavaScript引用类型之Array类型API详解

1.创建数组

1.1.使用Array构造函数

1.2.数组字面量创建

2.读取和设置数组的值

index数组的索引,即下标,当index<arr.length时,可以获取数组中的值,否则取到的值为undefined。

通过设置数组的length,可以对数组的末尾移除或添加

通过arr[arr.length-1]可以获取到数组的最后一项,通过arr[length]=item可以设置最后一项的值并动态增加了数组的长度

JavaScript引用类型之Array类型API详解

3.数组的方法

3.1.连接两个数组或多个数组-concat

不改变原始数组,需要用新的变量保存返回的新数组

3.2.截取数组一部分-slice

arr.slice(startIndex,endIndex);截取的项包括数组开始的索引的项,不包括数组结束的索引的项

也不改变原始数组,需要用新的变量保存返回的新数组

3.2.截取数组一部分-slice

arr.slice(startIndex,endIndex);截取的项包括数组开始的索引的项,不包括数组结束的索引的项

也不改变原始数组,需要用新的变量保存返回的新数组

3.3用不同的分隔符构建字符串-join

默认以','拼接,

 3.4.数组的反转-reverse

3.5.数组的排序-sort方法

这里只是通过出入比较函数给sort方法来保持正确的排序,对象也可以根据某一属性来进行正确的排序,这里暂不赘述。

3.6.数组的删除,替换,插入-splice方法

array.splice(index,howmany,item1,.....,itemX);

3.7.栈方法

数组提供了一种让数组类似于其他数据结构的方法,栈是一种LIFO(Last-In-First-Out)后进先出的数据结构,也就是最新添加的最早被移除。

栈中的推入-push,接收任意变量的参数,把他们添加到数组的末尾,并返回修改后数组的长度

栈中的弹出-pop,从数组末尾移除最后一项,减少length值,然后返回移除的项

都发生在同一位置-栈的顶部。

3.8.队列方法

队列的数据结构是FIFO(First-In-First-Out),队列在数组的末端添加项,在列表的前端移除项。

末端添加项-push,

前端移除项-shift,移除数组中的第一项,并返回该项,同时将数组长度减1,

前端新增项-unshift,在数组前端新增一项并返回数组的新长度。

通过数组的unshift和pop方法可以从相反方向的来模拟队列

3.9.数组的位置方法-indexOf,lastIndexOf

indexOf() 方法可返回数组中某个指定的元素位置。

该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。如果在数组中没找到指定元素则返回 -1。

lastIndexOf() 方法可返回数组中从尾到头方向上的位置,找到返回第一次出现的位置,否则返回-1。

3.10.数组的平铺(有些低版本浏览器不兼容)

方法会递归到指定深度将所有子数组连接,并返回一个新数组。arr.flat(depth);默认深度为1

4.数组的迭代方法

4.1.every():对数组的每一项运行给定函数,如果该函数对每一项都返回true,则返回true

4.2.some():对数组的每一项运行给定函数,如果该函数对任一项返回true,则返回true

4.3.filter():对数组中每一项运行给定的函数,返回该函数会返回true的项组成新的数组

4.4.map():对数组中每一项运行给定的函数,返回每次函数调用的结果组成新的数组

4.5.foreach():对数组中每一项运行给定函数,这个方法没有结果,与for循环迭代数组一样

了解更多
本次给大家推荐一个免费的学习群,里面概括移动应用网站开发,css,html,webpack,vue node angular以及面试资源等。
对web开发技术感兴趣的同学,欢迎加入Q群:864305860,不管你是小白还是大牛我都欢迎,还有大牛整理的一套高效率学习路线和教程与您免费分享,同时每天更新视频资料。
最后,祝大家早日学有所成,拿到满意offer,快速升职加薪,走上人生巅峰。

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复