Array方法大汇总!有些方法不看不知道!

137 阅读12分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第11天,点击查看活动详情

注:以下的方法大部分是参照MDN官网结合自身的理解进行说明,若理解有误望指正!

1. at()

  • 该方法用于查找对应索引值位置的元素
  • 语法arr.at(index)
  • 参数:只有一个参数index,用于指定索引值位置,如果传入的index是负数,则从倒数第一个元素开始数起
  • 返回值:返回对应位置的元素,如果没有该元素,则返回undefined

2. concat()

  • 该方法用于合并两个或多个数组(不改变原数组

  • 语法arr.concat(value1,...)

  • 参数:参数value就是需要被合并的数组、对象或其他类型的值,数量可以是任意个,如果没有参数,就只是返回其自身的一个浅拷贝

    注意: 这里的浅拷贝针对的不是整个最大的数组本身,而是数组的内部元素,即如果元素的内部存在数组或对象,新数组只是对他们进行了一个浅拷贝

    let arr = [1,{name:1}]
    let arr1 = arr.concat()
    console.log(arr === arr1);  //false
    console.log(arr.name === arr1.name);  //true
  • 返回值:返回一个全新的数组,新数组里面是所有数组的一个合并,所以不会对原数组造成影响

3. copyWithin()

  • 该方法用于将数组内部的一部分转移到复制一份到另一个位置,并会对原来位置的元素进行覆盖,所以不会改变数组的长度(会改变原数组

  • 语法arr.copyWithin(target[,start[,end]])

  • 参数

    target:指定复制的目标位置

    start(可选):指定待复制部分的开始位置,包括start位置的元素,如果省略了start参数,则默认为0,,即数组的开始位置

    end(可选):指定待复制部分的结束位置,不包括end位置的元素,如果忽略了end参数,则默认结束位置为数组的结尾

  • 返回值:改变后的数组

4. entries()

  • 该方法用于生成数组的iterator即迭代器对象(迭代器的相关只是可以查看我主页的ES6专栏,里面的文章有详细介绍噢!)
  • 语法arr.entries()
  • 参数:无
  • 返回值:一个全新的迭代器对象,可以调用next()方法对数组进行遍历

5. every()

  • 该方法用于对数组中的每个元素进行检测

  • 语法arr.every(callback(element[,index[,array]])[,thisArg])

  • 参数

    callback:对每个元素进行检测的回调函数,其中这个回调函数可以接受三个参数

    element:当前遍历到的元素

    index:当前遍历到的元素的索引值

    array:整个数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:该返回值取决于所有元素在回调函数中的返回值是否全都为true,因此回调函数中需要设置返回值,当所有的回调函数返回值均为trueevery方法才会返回true,否则返回false(相当于串联电路)

6. fill()

  • 该方法用于将数组中的某一部分填充指定字符(会改变原数组

  • 语法arr.fill(value[,start[,end]])

  • 参数

    value:用于填充的指定字符

    start(可选):指定填充部分的开始位置,如果省略,则默认从0开始

    end(可选):指定填充部分的结束位置,如果省略,则默认填充值数组结尾

  • 返回值:修改后的数组

7. filter()

  • 该方法就是我们常说的过滤器,可以将数组的所有元素进行一个过滤,将不符合要求的元素剔除(不会改变原数组

  • 语法arr.filter(callback(element[,index[,array]])[,thisArg])

  • 参数

    callback:对每个元素进行检测的回调函数,其中这个回调函数可以接受三个参数

    element:当前遍历到的元素

    index:当前遍历到的元素的索引值

    array:整个数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:一个新数组,新数组里面包含了通过回调函数的所有元素

8. find()

  • 该方法用于查找数组中满足条件的第一个元素

  • 语法arr.find(callback[,thisArg])

  • 参数

    callback:对每个元素进行检测的回调函数,其中这个回调函数可以接受三个参数

    element:当前遍历到的元素

    index:当前遍历到的元素的索引值

    array:整个数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:满足条件的第一个元素,如果不存在该元素,则返回undefined

9. findIndex()

  • 该方法和find()类似,用于查找数组中满足条件的第一个元素,只不过返回的是索引值,所以这里就不再过多赘述,语法和参数可以参考find()
  • 返回值:满足条件的第一个元素的索引值,如果不存在该元素,则返回-1

10. flat()

  • 该方法通俗点将就是可以将一个多层数组扁平化(不会改变原数组
  • 语法arr.flat([depth])
  • 参数:depth(可选):用于指定扁平化的程度,即数组的深度,如果省略,则默认为1
  • 返回值:返回扁平化后的新数组

11. map()

  • 该方法用于将整个数组的每一个元素按照某种关系映射到一个新数组(不会改变原数组

  • 语法arr.map(callback(element[,index[,array]])[,thisArg])

  • 参数

    callback:对每个元素进行映射的函数,需要设定返回值,并且返回的就是新数组中对应位置的新元素,可以传递三个参数

    element:当前处理的元素

    index:当前处理的元素的索引值

    array:整个数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:一个经过映射后的全新的数组

12. flatMap()

  • 该方法相当于flatmap的结合版,用于在映射新数组的同时对数组进行扁平化处理(不会改变原数组

  • 语法arr.flatMap(callback(element[,index[,array]])[,thisArg])

  • 参数

    callback:对每个元素进行映射的函数,需要设定返回值,并且返回的就是新数组中对应位置的新元素,可以传递三个参数

    element:当前处理的元素

    index:当前处理的元素的索引值

    array:整个数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:一个经过映射后的全新的数组,并且扁平化程度为1

13. forEach()

  • 该方法用于对数组的每一个元素执行一次给定的操作函数

  • 语法arr.forEach(callback(element[,index[,array]])[,thisArg])

  • 参数

    callback:对每个元素进行操作的回调函数,其中这个回调函数可以接受三个参数

    element:当前遍历到的元素

    index:当前遍历到的元素的索引值

    array:整个数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:无

14. from()

  • 该方法可以创建一个新的数组,并对一个可迭代对象进行浅拷贝,可以是字符串

  • 语法Array.from(arrayLike[,mapFunc[,thisArg]])

  • 参数

    arrayLike:进行浅拷贝的可迭代对象

    mapFunc(可选):浅拷贝的同时进行映射的回调函数

    thisArg(可选):执行回调函数时的this值

  • 返回值:一个全新的数组。注:如果浅拷贝对象的字符串,则将字符串逐个字符进行切割形成数组

15. includes()

  • 该方法用于判断数组中是否包含某个值

  • 语法arr.includes(searchElement[,fromIndex])

  • 参数

    searchElement:在数组中查找的值

    fromIndex(可选):指定在数组中开始查找的位置

  • 返回值:如果数组中存在要找的值则返回true,否则返回false

16. indexOf()

  • 该方法用于寻找指定值在数组中的第一个检索值

  • 语法arr.indexOf(searchElement[,fromIndex])

  • 参数

    searchElement:在数组中查找的值

    fromIndex(可选):指定在数组中开始查找的位置

  • 返回值:如果数组中存在要找的值则返回其第一次出现的索引值,不存在则返回-1

17. isArray()

  • 该方法用于判断传入的参数是否为数组
  • 语法Array.isArray(value)
  • 参数:value:要进行判断的值
  • 返回值:如果传入的值为数组,返回true,否则返回false

18. join()

  • 该方法用于将数组中的每个元素通过指定的字符进行拼接,拼接为一个新字符串
  • 语法arr.join(separator)
  • 参数:separator(可选):用于指定分隔符,如果省略,则默认为逗号
  • 返回值:返回一个拼接形成的全新字符串

19. keys()

  • 该方法用于创建一个新的Array迭代器对象,其中包含数组中每个索引的键
  • 语法arr.keys()
  • 参数:无
  • 返回值:一个新的迭代器对象,通过遍历迭代器可以访问数组中所有索引的键名

20. lastIndexOf()

  • 该方法用于在数组中查找指定元素,并返回其在数组中最后一次出现的索引值

  • 语法arr.lastIndexOf(searchElement[,fromIndex])

  • 参数

    searchElement:指定要查找的元素

    fromIndex:指定查找的开始位置

  • 返回值:返回指定元素在数组中最后一次出现的索引值,如果不存在,则返回-1

21. of()

  • 该方法用于创建一个新的数组,并且直接将数组内的元素作为参数传入,无论数量
  • 语法Array.of(element1,...)
  • 参数:element:是新创建数组中的元素,数量不限
  • 返回值:一个新创建的Array实例

22. pop()

  • 该方法用于删除数组中的最后一个元素,并将其作为返回值返回(改变原数组)
  • 语法arr.pop()
  • 参数:无
  • 返回值:被删除的元素

23. push()

  • 该方法用于在数组的尾部插入一个或多个元素
  • 语法arr.push(value1,...)
  • 参数:value:是要插入的元素,数量不限
  • 返回值:插入的最后一个元素

24. reduce()

  • 该方法用于对每个元素执行回调函数,并且会将上一次回调返回的结果作为这次回调的参数传入,而第一次没有上一次的返回值,可以自己定义

  • 语法arr.reduce(callback(previousValue,currentValue[,currentIndex[,array]])[,initialValue])

  • 参数

    callback:每个元素需要调用的回调函数

    previousValue:上一次回调函数的返回值

    currentValue:当前元素的值

    currentIndex:当前的索引位置

    array:要遍历的数组

    initialValue(可选):第一次调用回调函数式传入的previousValue的值,如果不定义,则初始化previousValue为数组第一个值,currentValue为数组第二个值

  • 返回值:在整个数组执行完回调后最终的返回值

25. reduceRight()

  • 该方法就是从右到左的reduce()

26. reverse()

  • 该方法用于讲数组反转(会改变原数组
  • 语法arr.reverse()
  • 参数:无
  • 返回值:在原来的数组上进行反转,并返回其引用,也就是原数组本身

27. shift()

  • 该方法用于删除数组第一个元素(会改变原数组
  • 语法arr.shift()
  • 参数:无
  • 返回值:返回被删除的元素,如果数组为空时则范围undefined

28. slice()

  • 该方法用于将数组的一部分浅拷贝到一个新数组中(不会改变原数组

  • 语法arr.slice([start[,end]])

  • 参数

    start(可选):表示浅拷贝部分开始的位置,如果省略,则默认浅拷贝整个数组

    end(可选):表示浅拷贝部分结束的位置,如果省略,则默认从开始位置到结尾

  • 返回值:返回由浅拷贝部分组成的全新数组

29. some()

  • 该方法用法与every()类似,不过只需要有一个回调为true则返回true

  • 语法arr.some(callback(element[,index[,array]])[,thisArg])

  • 参数

    callback:每个元素调用的回调函数

    element:代表当前的元素

    index:代表当前的索引值

    array:需要遍历的数组

    thisArg(可选):执行callback时使用的this值

  • 返回值:如果数组中的所有回调中有至少一个返回值为true,则该方法返回值为true

30. sort()

  • 该方法用于对数组进行排序,支持自定义排序方法(会改变原数组

  • 语法arr.sort([compareFunc(a,b)])

  • 参数

    compareFunc(可选):定义排序规则的函数,如果该函数的返回值<0则第一个参数排在第二个参数前面,如果返回值>0则第一个参数排在第二个参数后面,如果范围值=0则两个参数的位置不变

    a、b:进行比较的两个参数,可以使数值类型,也可以是字符串、数组或对象等类型

  • 返回值:进行排序后的数组,也就是原来的数组

31. splice()

  • 该方法用于替换或删除数组现有的元素(会改变原数组

  • 语法arr.splice(start[,deleteCount[,item,...]])

  • 参数

    start:替换部分的起始位置

    deleteCount(可选):指定要从开始位置起删除的元素个数,如果省略,则删除从开始位置到数组结尾的所有元素

    item(可选):替换进开始位置的新元素,数量不限,如果省略,则只是对其进行删除操作

  • 返回值:一个数组,其中包含了被删除的元素,如果未删除元素,则返回一个空数组

32. toString()

  • 该方法用于将数组转换为字符串,其内部实际上是调用了join()方法,元素间用逗号隔开
  • 语法arr.toString()
  • 参数:无
  • 返回值:数组进行转化后的字符串

33. unshift()

  • 该方法用于将一个或多个元素添加至数组的头部(会改变原数组
  • 语法arr.unshift(element1,...)
  • 参数:element:添加的元素,数量不限
  • 返回值:数组的新长度

34. values()

  • 该方法用于创建一个新的Array迭代器对象,其中包含数组中每个索引的值
  • 语法arr.values()
  • 参数:无
  • 返回值:一个新的迭代器对象,通过遍历迭代器可以访问数组中所有索引的值