JS中数组常用方法

  • JS中迭代数组数组元素的方法
  • forEach()
  • filter()
  • map()
  • some()
  • every()
  • keys() es6新增
  • values() es6新增
  • entries() es6新增
  • from() es6新增
  • of() es6新增
  • fill() es6新增
  • copyWithin() es6新增
  • JS中数组转字符串方法
  • toString()
  • join()
  • JS中数组中增加、删除、截取元素的方法
  • 增加、删除、替换元素的方法
  • splice()
  • 增加元素
  • push()
  • concat()
  • unshift()
  • 删除元素
  • shift()
  • pop()
  • 截取元素
  • slice()
  • JS中数组中查询元素方法
  • indexOf()
  • find()
  • findIndex()
  • includes()
  • JS中数组对元素排序的方法
  • reverse()
  • sort()
  • 数组元素求和、求积等操作
  • reduce()


JS中迭代数组数组元素的方法

forEach()

- 定义
forEach()按照遍历顺序使数组中的每个元素执行一遍自定义函数
- 语法

array.forEach(function(currentValue, index, arr), thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素运行的函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

- 注意

  1. forEach() 对于空数组是不会执行回调函数的。

filter()

- 定义
filter()返回一个新数组,新数组中是通过函数检测的数组元素。

- 语法

array.filter(function(currentValue,index,arr), thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素都会执行的检测函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

- 注意

  1. filter() 不会对空数组进行检测。
  2. filter() 不会改变原始数组。

map()

- 定义
map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
map() 方法按照原始数组元素顺序依次处理元素。
- 语法

array.map(function(currentValue,index,arr), thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素都会执行的函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

- 注意

  1. map() 不会对空数组进行检测;
  2. map() 不会改变原始数组。

some()

- 定义
some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。some() 方法会使数组的每个元素依次执行检测函数,若遇到通过监测函数的元素,则返回true,剩余元素不会再执行检测函数;若没有通过监测函数的元素,则返回fasle。

- 语法

array.some(function(currentValue,index,arr),thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素都会执行的函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

- 注意

  1. some() 不会对空数组进行检测。
  2. some() 不会改变原始数组。

every()

- 定义
every() 方法用于检测数组中的元素是否满足指定条件(函数提供)。every() 方法会使数组的每个元素依次执行检测函数,若遇到未通过监测函数的元素,则返回false,剩余元素不会再执行检测函数;若全部元素通过监测函数的元素,则返回true。

- 语法

array.every(function(currentValue,index,arr),thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素都会执行的函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

- 注意

  1. every() 不会对空数组进行检测。
  2. every() 不会改变原始数组。

keys() es6新增

- 定义
keys() 方法返回带有数组键的 Array Iterator 对象。

- 语法

array.keys()

- 注意

  1. keys() 方法不改变原数组。

values() es6新增

- 定义
values()函数是JavaScript中的内置函数,用于返回一个新的数组Array Iterator对象,该对象包含数组中每个索引对应的值。

- 语法

array.values()

- 注意

  1. values() 方法不改变原数组。

entries() es6新增

- 定义
entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key,value)。

- 语法

array.entries()

- 注意

  1. entries() 方法不改变原数组。

from() es6新增

- 定义
from() 方法对一个类似数组(伪数组)或可迭代对象创建一个新的,浅拷贝的数组实例。

- 语法

Array.from(object, mapFunction, thisValue)

参数值

参数

描述

object

必需。要转换为数组的对象。

mapFn

可选,数组中每个元素要调用的函数。

thisValue

可选,映射函数(mapFunction)中的 this 对象。

- 注意

of() es6新增

- 定义
of() 方法创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型。

- 语法

array.of(element0[, element1[, ...[, elementN]]])

参数值

参数

描述

elementN

任意个参数,将按顺序成为返回数组中的元素。

fill() es6新增

- 定义
fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。

- 语法

array.fill(value, start, end)

参数值

参数

描述

value

必需。填充的值。

start

可选。开始填充位置。

value

可选。停止填充位置 (默认为 array.length)

copyWithin() es6新增

- 定义
copyWithin() 方法浅复制数组的一部分到同一数组中的另一个位置,并返回这个新数组,不会改变原数组的长度。

- 语法

array.copyWithin(target, start, end)

参数值

参数

描述

target

必需。0 为基底的索引,复制序列到该位置。如果是负数,target 将从末尾开始计算。如果 target 大于等于 arr.length,将不会发生拷贝。如果 target 在 start 之后,复制的序列将被修改以符合 arr.length。

start

可选。0 为基底的索引,开始复制元素的起始位置。如果是负数,start 将从末尾开始计算。如果 start 被忽略,copyWithin 将会从 0 开始复制。

end

可选。0 为基底的索引,开始复制元素的结束位置。copyWithin 将会拷贝到该位置,但不包括 end 这个位置的元素。如果是负数, end 将从末尾开始计算。如果 end 被忽略,copyWithin 方法将会一直复制至数组结尾(默认为 arr.length)。

- 注意

  1. copyWithin()方法会改变原始数组。

JS中数组转字符串方法

toString()

- 定义
toString() 方法可把数组转换为字符串,并返回结果。

- 语法

array.toString()

- 注意

  1. toString() 方法不会改变原始数组。
  2. 数组中的元素之间用逗号分隔。

join()

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

- 语法

array.join(separator)

参数值

参数

描述

separator

可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。

- 注意

  1. join() 方法不会改变原始数组。
  2. 元素是通过指定的分隔符进行分隔的。

JS中数组中增加、删除、截取元素的方法

增加、删除、替换元素的方法

splice()

- 定义
splice() 方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。

- 语法

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

参数值

参数

描述

index

必需。指定修改的开始位置(从 0 计数)。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位(从 -1 计数,这意味着 -n 是倒数第 n 个元素并且等价于 array.length-n);如果负数的绝对值大于数组的长度,则表示开始位置为第 0 位。

howmany

可选。整数,表示要移除的数组元素的个数。如果 deleteCount 大于 start 之后的元素的总数,则从 start 后面的元素都将被删除(含第 start 位)。如果 deleteCount 被省略了,或者它的值大于等于array.length - start(也就是说,如果它大于或者等于start之后的所有元素的数量),那么start之后数组的所有元素都会被删除。如果 deleteCount 是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。

item1, …, itemX

可选。要添加进数组的元素,从start 位置开始。如果不指定,则 splice() 将只删除数组元素。

返回值

类型

描述

Array

由被删除的元素组成的一个数组。如果只删除了一个元素,则返回只包含一个元素的数组。如果没有删除元素,则返回空数组。

- 注意

  1. 此方法会改变原数组。

增加元素

push()

- 定义
push() 方法向数组末尾添加新项目,并返回新长度。
- 语法

array.push(item1, item2, ..., itemX)

参数值

参数

描述

item1, item2, …, itemX

必需。要添加到数组中的元素。

返回值

类型

描述

Number

数组新长度

- 注意

  1. 新元素将添加在数组的末尾。
  2. push()方法改变数组的长度

concat()

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

- 语法

array1.concat(array2,array3,...,arrayX)

参数值

参数

描述

array2, array3, …, arrayX

可选。数组和/或值,将被合并到一个新的数组中。如果省略了所有 valueN 参数,则 concat 会返回调用此方法的现存数组的一个浅拷贝。

返回值

类型

描述

Array

连接后的新数组

- 注意

  1. concat() 方法不会改变现有的数组,而是返回被连接数组形成的新数组。
  2. 被连接后的数据是浅拷贝,也就是说原有数组的改变会影响到新数组。

unshift()

- 定义
unshift() 方法将一个或多个元素添加到数组的开头,并返回该数组的新长度。

- 语法

array.unshift(item1, item2, ..., itemX)

参数值

参数

描述

item1, item2, …, itemX

必选要添加到数组开头的元素。

返回值

类型

描述

Number

新数组长度

- 注意

  1. unshift()会改变原始数组
  2. 能够通过 call 或 apply 方法作用于类似数组的对象上。但是对于没有 length 属性(从 0 开始的一系列连续的数字属性的最后一个)的对象,调用该方法可能没有任何意义。
  3. 如果传入多个参数,它们会被以块的形式插入到对象的开始位置,它们的顺序和被作为参数传入时的顺序一致。 于是,传入多个参数调用一次 unshift(),和传入一个参数调用多次 unshift()(例如,循环调用),它们将得到不同的结果。

删除元素

shift()

- 定义
shift() 方法从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度。

- 语法

array.shift()

参数值

参数

描述

无参数

返回值

类型

描述

任何类型 *

表示被删除的数组项目。* 数组元素可以是字符串、数字、数组、布尔值或数组中允许的任何其他对象类型。

- 注意

  1. shift() 方法会改变原始数组。
  2. 如果 length 属性的值为 0 (长度为 0),则返回 undefined。
  3. 能够通过 call 或 apply 方法作用于类似数组的对象上。但是对于没有 length 属性(从 0 开始的一系列连续的数字属性的最后一个)的对象,调用该方法可能没有任何意义。

pop()

- 定义
pop() 方法移除数组的最后一个元素,并返回该元素。

- 语法

array.pop()

参数值

参数

描述

无参数

返回值

类型

描述

任何类型 *

表示被删除的数组项目。* 数组元素可以是字符串、数字、数组、布尔值或数组中允许的任何其他对象类型。

- 注意

  1. pop() 方法会改变原始数组。
  2. pop()可以和call() 或 apply() 一起使用,可应用在类似数组的对象上。pop()根据 length 属性来确定最后一个元素的位置。如果不包含 length 属性或 length 属性不能被转成一个数值,会将 length 置为 0,并返回 undefined。
  3. 如果在一个空数组上调用 pop(),它将返回 undefined。

截取元素

slice()

- 定义
slice() 方法返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。

- 语法

array.slice(start, end)

参数值

参数

描述

start

可选。提取起始处的索引(从 0 开始),从该索引开始提取原数组元素。如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。如果省略 begin,则 slice 从索引 0 开始。如果 begin 超出原数组的索引范围,则会返回空数组。

end

可选。整数,指定结束选择的位置。如果省略,将选择从开始位置到数组末尾的所有元素。使用负数从数组末尾进行选择。

返回值

类型

描述

Array

返回被截取的元素组成的新数组

- 注意

  1. slice() 方法不会改变原始数组。
  2. 被截取后的数据是浅拷贝,也就是说原有数组的改变会影响到新数组。

JS中数组中查询元素方法

indexOf()

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

- 语法

array.indexOf(item,start)

参数值

参数

描述

item

必选。要查找的元素。

start

可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。

返回值

类型

描述

Number

返回首个被找到的元素在数组中的位置,如果没有搜索到则返回 -1。

- 注意

find()

- 定义
find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

- 语法

array.find(function(currentValue, index, arr), thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素都会执行的函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

返回值

类型

描述

任意类型*

如果数组中的任何元素通过测试,则返回数组元素值,否则返回 undefined。

- 注意

  1. 此方法与some()方法基本一致,只是返回值不同,find()方法对每个元素以此执行检测函数,若遇到通过监测的函数则返回元素本身,并且不检测剩余元素;若没有通过监测的元素,则返回undefined。
  2. find() 不对空数组执行该函数。
  3. find() 不会改变原始数组。

findIndex()

- 定义
findIndex() 方法返回数组中通过测试的第一个元素的索引(作为函数提供)。
- 语法

array.findIndex(function(currentValue, index, arr), thisValue)

参数值

参数

描述

function(currentValue, index, arr)

必需。为数组中的每个元素都会执行的函数 【currentValue(必需。当前元素的值); index(可选。当前元素的数组索引);arr(可选。当前元素所属的数组对象)】

thisValue

可选。要传递给函数以用作其 “this” 值的值。如果此参数为空,则值 “undefined” 将作为其 “this” 值传递。

返回值

类型

描述

Number

返回首个通过检测的元素在数组中的索引值,如果没有通过检测的元素则返回 -1。

- 注意

  1. 此方法与some()、find()方法与异曲同工之妙,只是返回值不同,具体不做赘述。
  2. findIndex() 不会为没有值的数组元素执行函数。
  3. findIndex() 不会改变原始数组。

includes()

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

- 语法

arrary.includes(searchElement, fromIndex)

参数值

参数

描述

searchElement

必选。需要查找的元素值。

fromIndex

可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。

返回值

类型

描述

Boolean

如果找到指定值返回 true,否则返回 false。

- 注意

  1. 如果fromIndex 大于等于数组长度 ,则返回 false 。该数组不会被搜索。
  2. 如果索引小于 0,则整个数组都会被搜索。

JS中数组对元素排序的方法

reverse()

- 定义
reverse() 方法反转数组中元素的顺序。

- 语法

array.reverse()

参数值

参数

描述

无参数

返回值

类型

描述

Array

反转后的数组

- 注意

  1. reverse() 方法将改变原始数组。

sort()

- 定义
sort() 方法对数组的元素进行排序。

- 语法

array.sort(compareFunction)

参数值

参数

描述

compareFunction

可选。如果省略,元素按照转换为的字符串的各个字符的Unicode位来进行排序。若compareFunction(x,y)传入两个参数,函数返回值小于0,x会被移动到y前面,即升序;若compareFunction(x,y)得到的返回值大于0,x会被移动到y后面即降序;若compareFunction(x,y)得到的返回值等于0,x,y的位置相对不变,不是所有浏览器都遵守。

返回值

类型

描述

Array

排序后的新数组

- 注意

  1. sort() 方法会改变原始数组。

数组元素求和、求积等操作

reduce()

- 定义
reduce() 方法对数组中的每个元素按序执行reducer 函数,每一次运行reducer 函数会将先前元素的计算结果作为参数传入,最后将其结果汇总为单个返回值。

- 语法

array.reduce(function(previousValue, currentValue, currentIndex, arr), initialValue)

参数值

参数

描述

function(previousValue, currentValue, index, arr)

必需为数组中的每个元素运行的reducer 函数。【previousValue(必需。上一次调用 自定义函数时的返回值。在第一次调用时,若指定了初始值 initialValue,其值则为 initialValue,否则为数组索引为 0 的元素 array[0]。),currentValue(必需。数组中正在处理的元素。在第一次调用时,若指定了初始值 initialValue,其值则为数组索引为 0 的元素 array[0],否则为 array[1]。),currentIndex(可选。数组中正在处理的元素的索引。若指定了初始值 initialValue,则起始索引号为 0,否则从索引 1 起始。),arr(可选。当前元素所属的数组对象)】

initialValue

可选。作为初始值传递给函数的值。

返回值

类型

描述

调用函数的累计结果

- 注意

  1. reduce()的用法比较多,例如最常使用的数组求和、求乘积;还可以计算数组中每个元素出现的次数、数组去重、将二维数组转化为一维数组、将多维数组转化为一维数组、对象里的属性求和。