数组中的方法总结

150 阅读5分钟

1.arr.join():将数组中的元素拼接成字符串(默认以逗号拼接),返回的是拼接后的字符串

let arr=[1,2,3,4,5,6,7]
console.log(arr.join()) //1,2,3,4,5,6,7
console.log(arr.join("")) //1234567
console.log(arr.join("-")) //1-2-3-4-5-6-7

2.arr.push():在数组最后面添加若干个元素,返回的是新数组的长度

let arr=[1,2,3,4,5,6,7]
console.log(arr.push(1))//8
console.log(arr.push(1,2,3))//10
let arr2=[
    {id:1,title:"标题一",content:"内容一"},
    {id:2,title:"标题二",content:"内容二"},
    {id:3,title:"标题三",content:"内容三"},
    {id:4,title:"标题四",content:"内容四"},
]

arr2.push({
    id:5,
    title:"标题五",
    content:"内容五"
})
console.log(arr2)//[{id: 1, title: "标题一", content: "内容一"}, {id: 2, title: "标题二", content: "内容二"},{id: 3, title: "标题三", content: "内容三"},{id: 4, title: "标题四", content: "内容四"},{id: 5, title: "标题五", content: "内容五"}]

改变原数组

let arr2=[
    {id:1,title:"标题一",content:"内容一"},
    {id:2,title:"标题二",content:"内容二"},
    {id:3,title:"标题三",content:"内容三"},
    {id:4,title:"标题四",content:"内容四"},
]

arr2.push({
    id:5,
    title:"标题五",
    content:"内容五"
})
console.log(arr2)//[{id: 1, title: "标题一", content: "内容一"}, {id: 2, title: "标题二", content: "内容二"},{id: 3, title: "标题三", content: "内容三"},{id: 4, title: "标题四", content: "内容四"},{id: 5, title: "标题五", content: "内容五"}]

3.arr.unshift():在数组前面添加若干个元素,返回新数组的长度,改变原数组

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

4.arr.pop():在数组最后删除一个元素,返回删除的那个元素,改变原数组

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

5.arr.shift():在数组最前面删除一个元素,返回删除的那个元素,改变原数组

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

6.arr.reverse():数组翻转,返回的结果是翻转后的数组,原数组也会改变为翻转后的数组

let arr=[1,2,3,4,5,6,7]
let arr = [1, 2, 3, 4, 5, 6, 7]
console.log(arr)//[1, 2, 3, 4, 5, 6, 7]
console.log(arr.reverse())//[7, 6, 5, 4, 3, 2, 1]
console.log(arr)//[7, 6, 5, 4, 3, 2, 1]

7.arr.sort():数组排序

let arr1 = [7, 6, 5, 4, 3, 2, 1]
// 默认从小到大
console.log(arr1.sort())// [1, 2, 3, 4, 5, 6, 7]
// 从大到小排序
arr.sort(function (a, b) {
    return b - a
})
console.log(arr1)// [7, 6, 5, 4, 3, 2, 1]

let arr = ["abcd","efghi","djfgdfgdh","h","fd","fhdfdgfjdgc"]
console.log(arr.sort())// ["abcd", "djfgdfgdh", "efghi", "fd", "fhdfdgfjdgc", "h"]
let newArr=arr.sort(function (a, b) {
    return a.length-b.length
})
console.log(newArr)// ["h", "fd", "abcd", "efghi", "djfgdfgdh", "fhdfdgfjdgc"]
console.log(arr)// ["h", "fd", "abcd", "efghi", "djfgdfgdh", "fhdfdgfjdgc"]
arr.sort(function (a, b) {
    return b.length-a.length
})
console.log(arr)// ["fhdfdgfjdgc", "djfgdfgdh", "efghi", "abcd", "fd", "h"]

8.arr1.concat(arr2)合并多个数组,返回合并后的新数组

let arr1=[1,2,3]
let arr2=[4,5,6]
let arr3=arr1.concat(arr2)
console.log(arr1)// [1,2,3]
console.log(arr2)// [4,5,6]
console.log(arr3)// [1,2,3,4,5,6]

9.arr.slice(开始位置的下标,结束位置的下标-不包含):截取数组中的一部分放在新数组中,返回截取后的数组,不改变原数组

// 截取位置从0开始
let arr=[1,2,3,4,5,6,7]
console.log(arr.slice(2,6))// [3, 4, 5, 6]
console.log(arr)// [1,2,3,4,5,6,7]

10.arr.splice(开始位置,删除几个,要增加哪些元素):在数组中任意位置删除或添加元素,返回删除掉的元素的数组,改变原数组

let arr=[1,2,3,4,5,6,7,8,9]
console.log(arr.splice(1,5)) //[2, 3, 4, 5, 6]
console.log(arr) //[1, 7, 8, 9]
console.log(arr.splice(1,2,12,314,1,3)) // [7, 8]
console.log(arr) //[1, 12, 314, 1, 3, 9]

11.arr.indexOf(值):获取值在数组中第一次出现的位置-------如果没有这个元素就返回-1

// indexOf可以用于判断数组中是否包含某个值
let arr=[1,2,3,1,2,3,4,5]
console.log(arr.indexOf(3)) //2
console.log(arr.indexOf(13)) //-1
console.log(arr)//  [1, 2, 3, 1, 2, 3, 4, 5] 

12.arr.lastIndexOf():从后面查找,查找值在数组中第一次出现的位置

let arr=[1,2,3,1,2,3,4,5]
console.log(arr.lastIndexOf(3)) //5
console.log(arr.lastIndexOf(13)) //-1
console.log(arr)//  [1, 2, 3, 1, 2, 3, 4, 5] 

13.arr.filter():返回元素中满足条件的元素组成的新数组,不改变原数组

let arr=[1,2,3,4,6,7,8,9]
let result=arr.filter(item=>{
    return item>5
})
console.log(result)//[6,7,8,9]

14.arr.map():返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。不会改变原数组

let arr=[1,2,3,4,6,7,8,9]
let result=arr.map((item,i)=>{
    console.log(item)//1,2,3,4,6,7,8,9
    console.log(i)//0,1,2,3,4,5,6,7
    return item+i
})
console.log(result)//[1, 3, 5, 7, 10, 12, 14, 16]

15.arr.every():对于数组中的每一项给定的函数都返回true整体返回true

let arr=[1,2,3,4,6,7,8,9]
let result=arr.every(item=>item>0)
console.log(result)//true

16.arr.some():对于数组中的每一项给定的函数只要有一个返回true,整体返回true

let arr=[1,2,3,4,6,7,8,9]
let result=arr.some(item=>item>5)
console.log(result)//true

17.arr.forEach():对数组的每一个元素执行一次提供的函数

let arr = [1, 2, 3, 4, 6, 7, 8, 9]
let newArr=[]
let result = arr.forEach(item => {
    console.log(item * 2)//2,4,6,8,12,14,16,18
    newArr.push(item*2)
})
console.log(result)// undefined
console.log(newArr)// [2, 4, 6, 8, 12, 14, 16, 18]

18.arr.find():返回数组中第一个满足条件的值,否则返回undefined

let arr=[1,2,3,4,6,7,8,9]
let result=arr.find(item=>item>2)
let result1=arr.find(item=>item<-1)
console.log(result)//3
console.log(result1)//undefined

19.arr.findIndex():返回数组中第一个满足条件的值的索引(下标),没有则返回-1

let arr=[1,2,3,4,6,7,8,9]
let result=arr.findIndex(item=>item>2)
let result1=arr.findIndex(item=>item<-1)
console.log(result)//2
console.log(result1)//-1

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

let arr=[1,2,3,4,6,7,8,9]
let arr1=["a","b","c","d"]
console.log(arr.includes(7))//true
console.log(arr1.includes("b"))//true
console.log(arr1.includes("e"))//false

21.arr.isArray():用于判断一个值是否为数组,是数组返回true,否则返回false

Array.isArray([1, 2, 3]);  // true
Array.isArray({foo: 123}); // false
Array.isArray("foobar");   // false
Array.isArray(undefined);  // false