数组的方法

77 阅读4分钟

push

// 向数组的最后的一个位置添加一个数据
const arr = [1,2,3,4,5]
arr.push(6) //[1,2,3,4,5,6]

unshift

// 向数组的最前面的一个位置添加一个数据
const arr = [1,2,3,4,5]
arr.unshift(0) //[0,1,2,3,4,5]

pop

// 移除数组的最后的元素,返回移除的元素
const arr = [1,2,3,4,5]
const item = arr.pop() 
console.log(item)//5
console.log(arr)//[1,2,3,4]

shift

// 移除数组的第一个的元素,返回移除的元素
const arr = [1,2,3,4,5]
const item = arr.shift() 
console.log(item)//1
console.log(arr)//[2,3,4,5]

splice

// 移除数组指定的元素,返回移除的元素,会修改原数组
const arr = [1,2,3,4,5]
// 从删除下标为1,开始删除两个元素,并将删除位置的元素加上333和444的元素
const item = arr.splice(1,2,333444) 
console.log(item)//[2,3]
console.log(arr)//[1,666,4,5]

slice

// 移除数组指定的元素,返回移除的元素,不会修改原数组
const arr = [1,2,3,4,5]
// 从删除下标为1,开始删除两个元素
const item = arr.splice(1,2) 
console.log(item)//[2,3]
console.log(arr)//[1,2,3,4,5]

concat

// 数组的拼接 
const arr = [1,2,3,4,5]
// 从数组的最后面开始拼接,返回一个新数组,不修改原数组
const item = arr.concat(4466) 
console.log(item)//[1,2,3,4,5,6,44,66]
console.log(arr)//[1,2,3,4,5]

reverse

// 数组的反转
const arr = [1,2,3,4,5]
// 反转数组,返回新数组,改变原数组
const item = arr.reverse() 
console.log(item)//[5,4,3,2,1]
console.log(arr)//[5,4,3,2,1]

sort

// 数组的反转
const arr = [3,1,2,5,4]
// 数组的排序,返回新数组,改变原数组,默认根据满减进行排序
const item = arr.sort() 
console.log(item)//[1,2,3,4,5]
console.log(arr)//[1,2,3,4,5]
const arr = [3,1,2,5,4]
const item = arr.sort(function(a,b){
   return a-b
}) // a-b是小到大,b-a大到小
const arrs = [{name:'林',age:18},{name:'杨',age:16},{name:'张',age:22}];
function compare(age){
    return function (a,b){
       let value1 = a[age]
       let value2 = a[age]
       return value1 - value2
       }
   }
const data = arrs.sort(compare('age')); 
console.log(data)// 这样写代码就会按照 arrs中的age从小到大

       

join

// 数组用符号拼接,返回新的字符串,不改变原数组
const arr = [1,2,3,4,5]
const item = arr.join('-') 
console.log(item)//1-2-3-4-5
console.log(arr)//[1,2,3,4,5]

toString

// 数组用符号拼接,返回新的字符串
const arr = [1,2,3,4,5]
const item = arr.toString() 
console.log(item)//1,2,3,4,5

indexOf

// 查找对应数据下面的索引,如果没有这个数据返回-1,如果有相同的数,只能找到第一个元素索引
const arr = [55,22,4,3,9]
const item = arr.indexOf(22) 
console.log(item)//1

lastIndexOf

// 查找对应数据下面的索引,如果没有这个数据返回-1,如果有相同的数,只能找到第一个元素索引
const arr = [55,22,4,3,9,22]
const item = arr.lastIndexOf(22) 
console.log(item)//5

includes

// 判断某个元素是否存在,存在返回true,不存在返回false
const arr = [55,22,4,3,9,22]
const item = arr.includes(22) 
console.log(item)//true

map

 // map 有返回值 并且原数组不会被影响,可以安装自己的需求改变需要的数据结构
 // map因为无论加不加return都会生成一个新数组,生成的新数组需要分配额外的内存存储,这导致map性能  //比foreach性能低
        const arr = [{name:'林',age:18},{name:'杨',age:16}];
        const arr1 = arr.map((item, index) => {
            return item.name
        })
        console.log(arr1) // ['林','杨']
        // 如果需要一个新数组,使用map

farEach

// forEach 没有返回值
// forEach比map性能高
        const arr = [1, 2, 3, 4, 5];
        const arr2 = arr.forEach((item, index) => {
            console.log(item, index, 'forEach')
        })
        console.log(arr2) // undefined
        // 如果不需要新数组使用forEach
        

filter

        const arr = [1, 2, 3, 4, 5];
        // filter  有返回值 筛选出符合条件的元素  并且不影响原数组
        const arr2 = arr.filter((item,index,arr)=>{
            // 只有大于3的元素才会被返回
            return item > 3
        })
        console.log(arr2);//[4,5]

some

        const arr = [1, 2, 3, 4, 5];
        // some  有返回值  
        const arr3 = arr.some((item,index,arr)=>{
            // 数组中只要有一个元素大于5,那么返回true,一旦发现条件符合true的元素,停止遍历
            return item > 5
        })
        console.log(arr3);//false

every

        const arr = [1, 2, 3, 4, 5];
        const arr4 = arr.every((item,index,arr)=>{
           // 数组中必须所有元素都大于5,才会返回true,一旦发生条件符合false的元素,停止遍历
            return item > 5
        })
        console.log(arr4);//false

find

        const arr = [1, 2, 3, 4, 5];
        const arr4 = arr.find((item,index,arr)=>{
           // 查找是否有元素大于3,找到了返回这个元素,一旦找到了符合条件的元素,停止遍历
            return item > 3
        })
        console.log(arr4);//4,5//如果没有符合的元素返回 undefined

findindex

        const arr = [1, 2, 3, 4, 5];
        const arr4 = arr.findindex((item,index,arr)=>{
           // 查找是否有元素大于3,找到了返回这个元素的索引,一旦找到了符合条件的元素,停止遍历
            return item > 3
        })
        console.log(arr4);//3,4//如果没有符合的元素返回 -1

reduce