当前位置:网站首页 > Vue.js开发 > 正文

js数组方法大全(js数组方法总结)



数组是js中最常用到的数据集合,其内置的方法有很多,熟练掌握这些方法,可以有效的提高我们的工作效率,同时对我们的代码质量也是有很大影响。本文所有的栗子都是在es7环境下测试的,如果有问题欢迎留言交流

我将创建数组的方式分为以下四大类

使用对象字面量方式创建数组是我们最常用的一种方式

 

使用无参构造可以创建一个长度为0的空数组

 
  1. 如果只传一个数值参数,则表示创建一个初始长度为指定数值的空数组
 
  1. 如果传入一个非数值的参数或者参数个数大于1,则表示创建一个包含指定元素的数组
 

ES6为数组新增创建方法的目的之一,是帮助开发者在使用Array构造器时避开js语言的一个怪异点。Array.of()方法总会创建一个包含所有传入参数的数组,而不管参数的数量与类型。

 

在使用Array.of()方法创建数组时,只需将想要包含在数组内的值作为参数传入。

在js中将非数组对象转换为真正的数组是非常麻烦的。在ES6中,将可迭代对象或者类数组对象作为第一个参数传入,Array.from()就能返回一个数组。

 

映射转换

如果你想实行进一步的数组转换,你可以向Array.from()方法传递一个映射用的函数作为第二个参数。此函数会将数组对象的每一个值转换为目标形式,并将其存储在目标数组的对应位置上。

 

如果映射函数需要在对象上工作,你可以手动传递第三个参数给Array.from()方法,从而指定映射函数内部的this值

 

创建数组完成之后,接下来我们就来看一下数组中的每一个方法是什么功能及其详细用法。下面的方法是按照字母顺序写的

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

 

通过上面的例子可以看出:concat传入的参数可以是具体的值,也可以是数组对象。可以是任意多个。

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

该方法会改变现有数组

 

默认情况下,copyWithin()方法总是会一直复制到数组末尾,不过你还可以提供一个可选参数来限制到底有多少元素会被覆盖。这第三个参数指定了复制停止的位置(不包含该位置本身)。

 

every()方法用于判断数组中每一项是否都满足条件,只有所有项都满足条件,才会返回true。

 

fill()方法能使用特定值填充数组中的一个或多个元素。当只是用一个参数时,该方法会用该参数的值填充整个数组。

 

如果不想改变数组中的所有元素,而只是想改变其中一部分,那么可以使用可选的起始位置参数与结束位置参数(不包括结束位置的那个元素)

 

filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。该方法不会改变原数组

 

find()与findIndex()方法均接受两个参数:一个回调函数,一个可选值用于指定回调函数内部的this。该回调函数可接受三个参数:数组的某个元素,该元素对应的索引位置,以及该数组本身。该回调函数应当在给定的元素满足你定义的条件时返回true,而find()和findIndex()方法均会在回调函数第一次返回true时停止查找。

二者唯一的区别是:find()方法返回匹配的值,而findIndex()返回匹配位置的索引。

 

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。

 

includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。

参数有两个,其中第一个是(必填)需要查找的元素值,第二个是(可选)开始查找元素的位置

 

需要注意的是:includes使用===运算符来进行值比较,仅有一个例外:NaN被认为与自身相等。

 

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

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

如果在数组中没找到指定元素则返回 -1。

参数有两个,其中第一个是(必填)需要查找的元素值,第二个是(可选)开始查找元素的位置

 

join() 方法用于把数组中的所有元素转换一个字符串

元素是通过指定的分隔符进行分隔的。默认使用逗号作为分隔符

 

lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,在一个数组中的指定位置从后向前搜索。

如果要检索的元素没有出现,则该方法返回 -1。

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

如果在数组中没找到指定元素则返回 -1。

 

map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。

map() 方法按照原始数组元素顺序依次处理元素。

该方法不会改变原数组

 

pop() 方法用于删除数组的最后一个元素并返回删除的元素。

 

push()方法从数组末尾向数组添加元素,可以添加一个或多个元素。

 

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

 

reduceRight() 方法的功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。

 

reverse() 方法用于颠倒数组中元素的顺序。

 

shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

 

slice() 方法可从已有的数组中返回选定的元素。

slice()方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。

slice() 方法不会改变原始数组。

 

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

some() 方法会依次执行数组的每个元素:

 

sort() 方法用于对数组的元素进行排序。

排序顺序可以是字母或数字,并按升序或降序。

默认排序顺序为按字母升序。

 

splice() 方法用于添加或删除数组中的元素。

  1. 删除元素,并返回删除的元素
 
  1. 向指定索引处添加元素
 
  1. 替换指定索引位置的元素
 

将数组转换为字符串

 

unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。

该方法将改变数组的数目。

到此这篇js数组方法大全(js数组方法总结)的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!
                            

版权声明


相关文章:

  • vue3.0脚手架安装(vue脚手架3.0搭建)2025-05-14 08:27:07
  • Json字符串转map(JSON字符串转list)2025-05-14 08:27:07
  • vue钩子函数(Vue钩子函数有哪些含义)2025-05-14 08:27:07
  • map转jsonobject报错(map转json对象 fastjson)2025-05-14 08:27:07
  • ettercap 0.8.3教程(ettercap 0.8.3.1教程)2025-05-14 08:27:07
  • vue安装(vue安装不上)2025-05-14 08:27:07
  • Ubuntu换源之后卡住了(ubuntu 20.04 换源)2025-05-14 08:27:07
  • ubuntu代码大全(ubuntu20.10代号)2025-05-14 08:27:07
  • vue 安装(vue 安装命令)2025-05-14 08:27:07
  • jvm内存模型 知乎(jvm内存模型jdk1.8)2025-05-14 08:27:07
  • 全屏图片