js中常用的数组方法

1,032 阅读5分钟

数组方法

1.push方法

将数组的元素末尾添加一个或多个元素,

语法:数组.push(元素,元素,......)-返回数组长度,改变原数组

let arr = ['a', 'b', 'c']
arr.push('b')
let b = arr.push('d', 'e')
console.log(arr);//['a', 'b', 'c', 'b', 'd', 'e']
console.log(b);//6
2.pop方法

将数组的最后一个元素删除,若该数组为空,则返回undefined

语法:数组.pop()-返回被删掉的元素,改变原数组


    let arr = ['a', 'b', 'c']
    let b = arr.pop()
    console.log(arr);//['a', 'b']
    console.log(b);//返回被删的'c'
3.splice方法

给数组的任意一个位置添加、修改、删除 1个或多个元素

语法:数组.splice(开始下标, 删除个数, 新元素, 新元素, ...) - 返回所有被删掉的元素组成的新数组,改变元素组


    let arr = ['a', 'b', 'c']
    let b = arr.splice(1, 2)
    console.log(arr);//输出新数组['a']
    console.log(b);//返回被截取的数组
4.sort方法

对数组中元素进行排序

语法:数组.sort() - 不是按照数字大小排序的,按照字符串大小进行排序的 ,原数组改变


    let arr = [3, 2, 4, 2, 3]
    let brr = arr.sort()
    console.log(brr);//返回从小到大的排序数组[2, 2, 3, 3, 4]
    let c = arr.sort(function (a, b) {
        // return a - b //升序
        // return b - a//降序
    })
    console.log(c);//[2, 2, 3, 3, 4]
    console.log(c);//[4, 3, 3, 2, 2]
5.reverse方法

翻转数组

语法:数组.reverse()-返回当前数组,原数组改变


    let arr = [1, 2, 3, 4]
    let brr = arr.reverse()
    console.log(brr);//[4, 3, 2, 1]
    console.log(arr);//[4, 3, 2, 1]
    console.log(arr === brr);//true
6.join方法

将数组中所有元素通过指定的连接符,连接成一个字符串

语法:数组.join(连接符) - 返回连接后的字符串,改变原数组


    let arr = ['a', 'b', 'c']
    let brr = arr.join('-')
    let str = arr.join() // 如果省略连接符,默认使用逗号连接
    console.log(brr);//a-b-c
    console.log(str);//a,b,c
7.concat方法

将1个或多个元素或数组 跟 当前数组组合成一个更大的数组

语法:数组.concat(1个或多个元素或数组) - 返回组合后的更大的数组,原数组不变


    let arr = ['a', 'b', 'c']
    let brr = arr.concat('c')
    console.log(brr);//['a', 'b', 'c', 'c']
8.slice方法

按照条件查找出其中的部分内容

语法:数组.slice(开始下标, 结束下标) - 返回被截取出来的一段组成的数组,结果不包含结束下标对应的字符,不改变原数组


    let arr = ['a', 'b', 'c', 'd']
    let brr = arr.slice(0, 3)
    let brr_1 = arr.slice(1)
    let brr_2 = arr.slice(0)
    let brr_3 = arr.slice(-3, -1)
    console.log(brr);//从索引0查找到索引3(不包含3),['a', 'b', 'c']
    console.log(brr_1);//从当前索引一直查找到最后一个返回,['b', 'c', 'd']
    console.log(brr_2);//原样输出内容,可以实现数组克隆['a', 'b', 'c', 'd']
    console.log(brr_3);//slice支持负参数,从最后一项开始算起,-1为最后一项,-2为    倒数第二项['b','c'] 
9.indexOf方法

检测当前值在数组中第一次出现的位置索引

语法:数组.indexOf(item,start) item:查找的元素 start:字符串中开始检索的位置,找到元素就返回对应的下标,找不到元素就返回-1


    let arr = ['a', 'b', 'c', 'd', 'c', 'c']
    let ab = arr.indexOf('e')
    let ac = arr.indexOf('c')
    let ad = arr.indexOf('c', 3)
    console.log(ab);//-1
    console.log(ac);//2
    console.log(ad);//4
10.lastIndexOf方法

查找某个元素在数组中最后一次出现的下标

语法:数组.lastIndexOf()


    let arr = ['a', 'b', 'c', 'd', 'c', 'c']
    let ab = arr.lastIndexOf('c')
    console.log(ab);//5
11.shift方法

删除数组的第一项,并返回第一个元素的值。若该数组为空,则返回undefined。原数组改变

语法:数组.shift() - 返回被删掉的元素


    let arr = ['a', 'b', 'c']
    let ab = arr.shift()
    console.log(ab);//a
    console.log(arr);//['b', 'c']
12.unshift方法

向数组的开头添加一个或多个元素,并返回新的数组长度。原数组改变

元素

语法:数组.unshift(元素, 元素, ...) - 返回新数组的长度


    let arr = ['a', 'b', 'c']
    let ab = arr.unshift('e', 'a')
    console.log(ab);//5
    console.log(arr);//['e', 'a', 'a', 'b', 'c']
13.map方法

原数组的每一项执行函数后,返回一个新的数组。原数组不变

语法:数组.map(function(value,indedx){})

    let arr = ['a', 'b', 'c']
    let ab = arr.map(function (value, index) {
        console.log(value);//输出每个元素 a,b,c
        console.log(index);//输出每个元素的下标 0, 1, 2
        return 'a'//返回新元素
​
    })
    console.log(ab);//['a', 'a', 'a']
14.filter方法

过滤数组中,符合条件的元素并返回一个新的数组

语法:数组.filter(callback(element[, index[, selfArr]])[, thisArg])

callback:循环数组是执行的回调函数,回调函数返回true表示保留该函数,false则不保留。接收三个参数:

element:数组中当前正在处理的元素。

index:正在处理的元素的索引。

selfArr可选:调用了filter方法数组本身。


 let arr = [5, 3, 2, 3, 4, 1]
    let ab = arr.filter(x => x > 2)
    let ac = arr.filter(function (element, index, selfArr) {
        return element >= 2
    })
    console.log(ab);//[5, 3, 3, 4]
    console.log(ac);//[5, 3, 2, 3, 4]
15.some方法

判断数组中是否至少有一个元素是满足指定条件的 - 返回布尔值

语法:数组.some(function(item,index,arr){},this.Value)

function:必须,数组中的每个元素都会执行这个函数

item:当前元素的值;index:当前元素的索引值;arr:当前元素属于的对象


    let arr = [5, 3, 2, 3, 4, 1]
    let ab = arr.some(function (item, index) {
        console.log(item, index);
        return item > 6
    })
    console.log(ab);//false
16.every方法

判断数组中是否全部元素都满足指定条件----返回布尔值

语法:

布尔值 = 数组.every(function(value, index) {

​ return 条件

})


    let arr = [5, 3, 2, 3, 4, 1]
    let ab = arr.every(function (item, index) {
        // return item > 6
    })
    console.log(ab);//false
17.find方法

查找数组中第一个满足条件的元素,找到了就会返回元素,找不到就返回undefined

语法:元素 = 数组.find(function(value, index) {

​ return 条件

})


    let arr = [3, 2, 3, 6, 4, 1]
    let ab = arr.find(function (item, index) {
        console.log(item, index);
        // return item > 4
        return item > 7
    })
    console.log(ab);//6
    console.log(ab);//undefined
18.findIndex 方法

查找数组中满足指定条件的第一个元素对应的下标,找到了就会返回下标,找不到就返回-1

语法:下标 = 数组.findIndex(function(value, index) {

​ return 条件

})


    let arr = [3, 2, 3, 6, 4, 1]
    let ab = arr.findIndex(function (item, index) {
        // return item > 3
        return item > 6
    })
    // console.log(ab);//3
    console.log(ab);//-1
19,reduce方法

归并数组 - 数组求和

语法:数组.reduce(function(a, b) {

​ // reduce遍历数组,会少遍历一次

​ // a第一次遍历,代表第一个元素,第二次开始,就代表上次遍历return的结果

​ // b第一次遍历,代表第二个元素,第二次遍历,代表第三个元素,第三次遍历,代表第4个元素...

})


let arr = [3, 2, 3, 6, 4, 1]
    let ab = arr.reduce(function (a, b) {
        console.log(a);//3,5,8,14,18
        console.log(b);//2,3,6,4,1
        return a + b
    })
    console.log(ab);//19
20.forEach()方法

使用方法:数组.forEach(function(item, index, arr){

​ function是一个回调函数,

​ item:数组中的每一项;

​ index:item对应的下标的索引值

​ arr:调用该方法的数组本身

})