js常用API集合

170 阅读3分钟

1.concat

用于合并两个或多个数组,不会修改原数组,而返回一个新数组。

   const arr = [1, 2, 3]
   const arr1 = arr.concat(4, 5)
   console.log(arr1) // [1, 2, 3, 4, 5]

2.join

把数组转化成字符串 如果数组只有一个项目,那么将返回该项目而不使用分隔符。

    const arr = [1, 2, 3]
    console.log(arr.join())     //1, 2, 3
    console.log(arr.join(""))   //123

3.slice

选取数组的一部分截取,并返回一个新数组。 参数1,从下标x开始包含; 参数2,截取到下标x结束不包含 不改变原数组

    const arr = [1,2,3,4,5,6,7,8,9]
    console.log(arr.slice(1,6)) // 从下标1到数字6的内容,输出[2, 3, 4, 5, 6]
    console.log(arr.slice(0)) // 返回原素组

4.find

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

const arr = [
    { id: 1, name: '张三'},
    { id: 2, name: '张三'},
    { id: 3, name: '李四'}
];
const res = arr.find((item) => {
  return item.name
})
console.log(res) // 输出 {id: 1, name: '张三'}

5.findIndex

返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1

    const arr = [
    { id: 1, name: '张三'},
    { id: 2, name: '张三'},
    { id: 3, name: '李四'}
];
const res = arr.findIndex((item) => {
    return item.name
})
console.log(res) // 输出 0

6.includes

用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回true, 否则返回false.

    const arr = ['a','b','c','d']
    console.log(arr.includes('c')) // true
    console.log(arr.includes(2)) // false

7.indexOf

返回数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1.

    const arr = ['a','b','c','d','e','a','f']
    console.log(arr.indexOf('c')) // 2
    console.log(arr.indexOf('a', 3)) // 5

8.pop

从数组中删除最后一个元素,并返回该元素的值。方便更改数组的长度。

    const arr = [20, 30, 50]
    arr.pop()  // 删除的最后一项 50
    console.log(arr) // 输出 [20, 30]

9.unshift

将一个或多个元素加到数组的开头,并返回该数组的新长度。该方法修改原有数组。

    const arr = ['c','d']
    arr.unshift('a','b')
    console.log(arr) // 输出 ["a", "b", "c", "d"]

10.reverse

将数组中元素的位置颠倒,并返回该数组。该方法会改变原数组。

    const arr = [2, 4, 6, 8, 10]
    console.log(arr.reverse()) // [10, 8, 6, 4, 2]

11.push

在数组的末尾加元素,返回新数组的长度,追加进去的数组不会被打散

    const arr = [20, 30, 50]
    arr.push(100)  // 返回一个新的长度
    console.log(arr)  // 结果为 [20, 30, 50, 100]

12.sort

对数组的元素进行排序,并返回数组。 sort在不传递参数情况下,只能处理10以内(个位数)数字排序

    const arr = [20, 45, 35, 80, 1, 60]
    
    arr.sort((a,b) => {
        return a-b 
     })
     console.log(arr) //[1, 20, 35, 45, 60, 80]

13.every

方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。 它返回一个布尔值。

    const arr = [
      { name: "张三", age: 18, done: false },
      { name: "李四", age: 19, done: true },
      { name: "王五", age: 20, done: true }
    ]
    const res = arr.every((item) => {
        return item.done
    })
    console.log(res) // 输出 false

14.find

找到第一个符合条件的数组成员,没找到返回undefined

    const arr = [
        { id: 1, name: '张三'},
        { id: 2, name: '张三'},
        { id: 3, name: '李四'}
    ];
    const res = arr.find((item) => {
      return item.name
    })
    console.log(res) // 输出 {id: 1, name: '张三'}

15.map

映射,该方法使用和forEach大致相同,但是该方法有返回值,返回一个新数组, 新的长度和原数组长度相同。

    const arr = [1, 3, 5, 7, 9]
    const res = arr.map((item, index) => {
        return item
    })
    console.log(res) // [1, 3, 5, 7, 9]

16.shift

从数组中删除第一个元素,并返回该元素的值。会更改数组的长度

    const arr = [20, 30, 50]
    arr.shift()  // 删除的第一项 20
    console.log(arr) // 输出 [30, 50]