数组的27个api方法

不归欸
167 阅读7分钟
  • indexOf()方法
    • 从前往后查询数组指定元素的第一个索引

var arr = [1,2,3,4,2]
console.log(arr.indexOf(2)) // 1

  • lastIndexOf()方法
    • 从后往前查询数组指定元素的第一个索引

var arr = [1,2,3,4,2]
console.log(arr.indexOf(2)) // 4

  • concat()方法
    • 拼接两个数组，不修改原数组，返回一个新数组

var arr = [1,2,3,4]  
var arr2 = [7,8,9,7]  
console.log(arr.concat(arr2)) //[1, 2, 3, 4,7, 8, 9, 7]

  • valueOf()方法

    • valueOf() 方法返回 Array 对象的原始值。该原始值由 Array 对象派生的所有对象继承。valueOf() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。

var arr = [1,2,3,4]  
var arr2 = [7,8,9,7]  
console.log(arr.values())//Object [Array Iterator] {}

  • reduce()方法
    • reduce(function(prevalue,value,index,arr){},initPrevalue),接收两个参数，第一个参数是一个回调函数，每次遍历数组的值都会执行一次回调函数，回调函数的第一个参数是上一次的返回值，第二个参数的当前遍历的值，第三个参数是当前值的索引，第四个参数是当前值所在的数组；第二个参数是一个可选的数值，如果不选，默认回调函数第一次的preValue为undefined

//数组去重  
function createArr(arr) {
    return arr.reduce((preitem, item) => {
      console.log(preitem)
      return preitem.concat(Array.isArray(item)?createArr(item):item)
    },[])
  }

  • reduceRight()方法
    • 基本和reduce()方法一样，不过reduce()是从第一个元素开始遍历，reduceRight()是从最后一个元素开始遍历
  • slice()方法
    • slice(start,end)接收两个参数，start代表开始截取的下标，end可选，代表需要截取的后一个坐标，slice()方法不会改变原数组

var arr = [1,2,3,4]
var arr2 = [7,8,9,7]  
var result = arr.slice(0,2)  
console.log(result, arr) // [ 1, 2 ] [ 1, 2, 3, 4 ]

  • splice()方法
    • splice(index,howmany,item0...itemx)方法会改变原数组，该方法表示从数组中删去指定的元素并返一个数组，同时也可以填充相应的元素

var arr = [1,2,3,4]
var arr2 = [7,8,9,7]  
var result = arr.splice(0,3,2,5)  
console.log(result, arr) // [ 1, 2, 3 ] [ 2, 5, 4 ]

  • map()方法
    • map(function(item,index，arr){},thisValue)方法返回一个数组对象,其中item为当前遍历的值，index为当前遍历的值的索引，arr为当前遍历的值所在的数组。thisValue可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。

var arr = [1,2,3,4]

var arr2 = [7,8,9,7]  
console.log(arr.map(item => {  return item * 2})) //[ 2, 4, 6, 8 ]

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

var arr = [1,2,3,4]

var arr2 = [7,8,9,7]console.log(arr.reverse())

  • join()方法
    • 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。

var arr = [1,2,3,4]  

var arr2 = [7,8,9,7]  
console.log(arr.join("")) // 1234

  • toString()方法
    • 将数组转化为字符串并返回结果，和不带参数的join()方法功能一样
  • toLocalString()方法
    • 把数组转换为本地字符串。
  • sort()方法
    • 方法sort()将在原数组上对数组元素进行排序，即排序时不创建新的数组副本。如果调用方法sort()时没有使用参数，将按字母顺序(更为精确地说，是按照字符编码的顺序)对数组中的元素进行排序。要实现这一点，首先应把数组的元素都转换成字符串(如果有必要的话)，以便进行比较。如果想按照别的顺序进行排序，就必须提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数a和b，其返回值如下：

      如果根据你的评判标准，a小于b，在排序后的数组中a应该出现在b之前，就返回一个小于0的值。如果a等于b，就返回0。注意，数组中undefined的元素都排列在数组末尾。即使你提供了自定义的排序函数也是这样，因为undefined值不会被传递给你提供的orderfunc。JavaScript中数组的sort()方法主要用于对数组的元素进行排序。其中，sort()方法有一个可选参数。但是，此参数必须是函数。 数组在调用sort()方法时，如果没有传参将按字母顺序（字符编码顺序）对数组中的元素进行排序，如果想按照其他标准进行排序，就需要进行传一个参数且为函数，该函数要比较两个值，并且会返回一个用于说明这两个值的相对顺序的数字。

var arr = [22,12,3,43,56,47,4];

arr.sort();
console.log(arr); // [12, 22, 3, 4, 43, 47, 56]
arr.sort(function (m, n) {
if (m < n) return -1 else if (m > n) return 1

else return 0});

console.log(arr); // [3, 4, 12, 22, 43, 47, 56]

  • filter()方法
    • filter方法接收两个参数，一个回调函数，一个上下文对象，回调函数接收三个参数

var arr = [1,2,3,4]  

var arr2 = [7,8,9,7]  console.log(arr.filter((item,index,arr)=>{

rturn item>2
})) // [ 3, 4 ]

  • fill()方法

    • fill()方法，使用自己想要的参数替换原数组内容，但是会改变原来的数组。该方法有三个参数：fill(value, start, end)  value：想要替换的内容。start：开始位置（数组的下标），可以省略。end：替换结束位置（数组的下标），如果省略不写就默认为数组结束

var arr = [1,2,3,4]  

var arr2 = [7,8,9,7]  var result = arr.fill("hello",1,3)

console.log(result, arr) // [ 1, 'hello', 'hello', 4 ] [ 1, 'hello', 'hello', 4 ]

  • from()方法
    • Array.from() 方法从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。
Array.from(arrayLike[, mapFn[, thisArg]])
arrayLike想要转换成数组的伪数组对象或可迭代对象。mapFn 可选如果指定了该参数，新数组中的每个元素会执行该回调函数。thisArg 可选可选参数，执行回调函数 mapFn 时 this 对象。


console.log(Array.from('foo'));
// expected output: Array ["f", "o", "o"]

console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]

  • of()方法
    • Array.of()方法用于将一组数值转换为数组

const a = Array.of(2,4,6,8);
console.log(a);         // [2,4,6,8]

const b = Array.of(1);
console.log(b);         // [1]

const c = Array.of(1).length;
console.log(c);         // 1

  • find()方法
    • 用于找出符合条件的第一个值

const arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]

const ret1 = arr1.findIndex((value, index, arr) => {  return value > 4}) const ret2 = arr1.find((value, index, arr) => {  return value > 4})

console.log('%s', ret1)  // 4console.log('%s', ret2)  // 5

  • findIndex()方法
    • 用于找到符合条件的第一个值的下标，基本用法同上
  • copyWithin()方法
    • ES6为Array增加了copyWithin(target,start,end)函数，用于操作当前数组自身，用来把某些个位置的元素复制并覆盖到其他位置上去。该函数有三个参数。

      target：目的起始位置。

      start：复制源的起始位置，可以省略，可以是负数。

      end：复制源的结束位置，可以省略，可以是负数，实际结束位置是end-1

var arr = [1,2,3,4,5,6,7]  

arr.copyWithin(1,3,6)console.log(arr) // [1, 4, 5, 6,5, 6, 7]

  • includes()方法
    • 用于判断数组是否含有某个值，返回一个布尔值

var arr = [1,2,3,4,5,6,7]
console.log(arr.includes(2)) // true

  • shift()方法
    • 用于删除数组的第一个值，并返回删除的值

var arr = [1,2,3,4,5,6,7]  

var result = arr.shift()
console.log(result, arr) // 1 [ 2, 3, 4, 5, 6, 7 ]

  • unshift方法
    • 用于向数组最前面插入一个值，并返回插入之后数组的长度

var arr = [1,2,3,4,5,6,7]  

var result = arr.unshift(9)console.log(result, arr) // 8 [9, 1, 2, 3,4, 5, 6, 7]

  • push()方法
    • 用于向数组尾部加入一个值，并返回加入值后数组的长度

var arr = [1,2,3,4,5,6,7]  

var result = arr.push(9)console.log(result, arr) // 8 [1, 2, 3,4, 5, 6, 7, 9]

  • pop()方法
    • 用于弹出数组尾部的值，并返回弹出的值

var arr = [1,2,3,4,5,6,7]  

var result = arr.pop()console.log(result, arr) // 7 [1, 2, 3,4, 5, 6]

  • every()方法
    • 接收一个回调函数，在回调函数中返回一个判断条件，只要有一个是false，那么就都为false

var arr = [1,2,3,4,5,6,7]  

var result = arr.every((item, index, arr) => item>2)console.log(result) // false

  • some()方法
    • 接收一个回调函数，在回调函数中返回一个判断条件，只要有一个是true，那么就都为true

var arr = [1,2,3,4,5,6,7]  

var result = arr.some((item, index, arr) => item>2)console.log(result) // true


avatar
文章
阅读
粉丝