全方位总结:数组的方法有哪些?

  1. unshift()——(在开头)向数组添加一或多个元素,返回新数组长度,会改变数组的长度

let arr=[0,1,2,3,4]
arr.unshift(2,99)
console.log(arr);//[2, 99, 0, 1, 2, 3, 4]
  1. push()——(在结尾)向数组添加一或多个元素,返回新数组长度,会改变数组的长度

let arr=[0,1,2,3,4]
arr.push(99)
console.log(arr);// [0, 1, 2, 3, 4, 99]
  1. shift()——删除数组的第一位数据,并且返回新数组的长度,会改变原来的数组。不接受参数,且每次只能删除数组第一个(写了参数也不生效)

let arr=[0,1,2,3,4]
arr.shift()
console.log(arr);// [1, 2, 3, 4]
  1. pop()——删除数组的最后一位,并且返回删除的数据,会改变原来的数组。不接受参数,且每次只能删除最后一个

let arr=[0,1,2,3,4]
arr.pop()
console.log(arr);// [0,1, 2, 3]
  1. splice(开始位置,删除个数/0代表添加,添加内容)—— 在指定位置删除指定个数元素再增加任意个数元素 (实现数组任意位置的增删改),返回删除的数据,会改变原来的数组,产生新数组

let arr=[0,1,2,3,4]
arr.splice(1,2,99)//在下标为1的位置删除两个并添加99进去
console.log(arr);// [0, 99, 3, 4]

arr.splice(1,0,99)//在下标为1的位置添加99进去
console.log(arr);// [0, 99, 1, 2, 3, 4]

数组转字符串的方法

  1. toString()——将数组转换为字符串,并且返回转换后的新数组,不改变原数组

let arr=["a","b","c","d","e"]
let str=arr.toString()
console.log(str)//a,b,c,d,e
  1. join()——分隔符(默认",") ,将数组拼接形成字符串 (“”是把什么都分开)返回拼接后的新数组,不会改变原数组

let arr=["a","b","c","d","e"]
let str=arr.join("-")//以join里面的格式进行拼接
console.log(str)//a-b-c-d-e

字符串转为数组的方法

  1. split()——拆分(默认为整个字符串),用过指定的分隔符,将字符串分割成数组,会返回一个新数组,不会改变原数组

let str="ab&bcd&d"
let arr=str.split()
console.log(arr)//["ab&bcd&d"]

let arr=str.split("")
console.log(arr)// ["a", "b", "&", "b", "c", "d", "&", "d"]

let arr=str.split("&")
console.log(arr)//["ab", "bcd", "d"]

数组的查找方法

  1. indexof(要查找的元素,开始要查找的位置)——(不写第二个参数默认就是从下标0开始查找) 查询某个元素在数组中第一次出现的位置存在该元素,返回下标,不存在就返回 -1 (可以通过返回值:变相的判断是否存在该元素)

对数组:
let arr=["a","b","c","a","d","i","a","d"]
let index=str.indexOf("i")//默认就是从下标0开始
console.log(index)//5

let index=str.indexOf("a",3)//从下标3开始进行查找
console.log(index)//3

也针对字符串:
let str="abc&audij-jlaccd"
let index=str.indexOf("u")//默认就是从下标0开始
console.log(index)//5

let index=str.indexOf("a",3)//从下标3开始进行查找
console.log(index)//4
  1. lastindexof(ele,startindex)—— 查询某个元素在数组中最后一次出现的位置 (或者理解为反向查询第一次出现的位置) 存在该元素,返回下标,不存在则返回 -1 (可以通过返回值:变相的判断是否存在该元素)

对数组:
let arr=["a","b","c","a","d","i","a","d"]
let index=arr.lastIndexOf("a")
console.log(index)//6

let index=arr.lastIndexOf("d",3)//从下标为3的地方网下标为0的地方查找
console.log(index)//-1

也针对字符串:
let str="abc&audij-jlaccd"
let index=str.indexOf("a")//默认就是从最后的开始下标0进行数
console.log(index)//12

let index=str.indexOf("d",3)
console.log(index)//-1
  1. reverse()——反转数组中的元素,返回反转后数组,会改变原数组

let arr=["a","b","c","a","d","i","a","d"]
let revarr=arr.reverse()
console.log(revarr)//["d", "a", "i", "d", "a", "c", "b", "a"]
  1. sort(function(a,b){return a-b})——以字母顺序(字符串Unicode码点)对数组进行排序,返回新数组,会改变原数组(a-b是从小到大,b-a是从大到小)

let arr=[1,6,0,5,8,4,2]
arr.sort(function(a,b){
        return a-b
})
console.log(arr)//[0, 1, 2, 4, 5, 6, 8]

let arr=[{name:"haha",age:12},{name:"momo",age:10},{name:"xixi",age:16}]
arr.sort(function(a,b){
     return a.age-b.age
})
console.log(arr)// [{name:"momo",age:10}, {name:"haha",age:12}, {name:"xixi",age:16}]
  1. concat()——连接多个数组,通过合并(连接)现有数组来创建一个新数组,返回合并之后的数组,不会改变原数组

如果拼接的是数组 则将数组展开,之后将数组中的每一个元素放到新数组中;

如果是其他类型, 直接放到新数组中;

另外,如果不给该方法任何参数,将返回一个和原数组一样的数组(复制数组)

let arr1=[1,2,3]
let arr2=["a","b","c"]
let arr3=[23,56,89]
let newarr=arr3.concat(arr2,arr1)
console.log(newarr)//[23, 56, 89, "a", "b", "c", 1, 2, 3]
  1. slice(startindex,endindex)——截取字符串, 裁切指定位置的数组,被裁切的元素形成的新数组,不会改变原数组

参数描述:startIndex 起始下标,默认值 0

endIndex 终止下标 默认值 length,可以接收负数,(倒着数)

注意!起始下标和终止下标的区间是 左闭右开 [ a ,b) 能取到起始,取不到终止

slice() 如果不传参数,会使用默认值,得到一个与原数组元素相同的新数组 (复制数组)

let arr3=[23,56,89]
let newarr=arr3.slice(0,2)
console.log(newarr)//[23, 56]

ES5新增的遍历数组方法

  1. forEach()—— (迭代) 遍历数组,每次循环中执行传入的回调函数 。(注意: forEach() 对于空数组是不会执行回调函数的。) 没有返回值,或理解为返回值为undefined,不改变原数组.

forEach和map最大的区别就是:forEach没有返回值,不会生成新数组,而map有返回值,会产生新数组

arr.forEach(function(item,index,arr){
//里面的function是一个回调函数,
//item: 数组中的每一项;
//index:item 对应的下标索引值
//arr: 就是调用该方法的数组本身
})
  1. map()——(迭代)遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 ,同forEach() 方法,但是map()方法有返回值,可以return出来;

let arr = [1,32,54,6,543];
let res = arr.map(function(item,index,arr){
    return item*2;   //让每一个元素都乘2
})
console.log(res)// [2, 64, 108, 12, 1086]
  1. filter()——(迭代) 遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中 满足条件的元素组成的新数组

参数: item:每次循环的当前元素, index:当前项的索引, array:原始数组;

var list = [32, 93, 77, 53, 38, 87];
var resList = list.filter(function (item, index, array) {
    return item >= 60; // true || false
});
console.log(resList);//[93, 77, 87]
  1. every()—— (迭代) 判断数组中所有的元素是否满足某个条件,全都满足返回true,只要有一个不满足返回false,不会改变原数组,相当于逻辑与

var list = [32, 93, 77, 53, 38, 87];
var result = list.every(function (item, index, array) {
     return item >= 50;
});
 console.log(result);//false
  1. some()—— (迭代) 判断数组中是否存在,满足某个条件的元素 只要有一个元素满足条件就返回true,都不满足返回false ,相当于逻辑或

var list = [32, 93, 77, 53, 38, 87];
var result = list.some(function (item, index, array) {
     return item >= 50;
});
 console.log(result);//true
  1. reduce()——遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中, 返回最终操作的结果;

语法: arr.reduce(function(prev,item,index,array){})

参数:prev 初始值 (类似求和是 sum=0) 可以设置初始值( 参数),如果不设置初始值默认是数组中的第一个元素,遍历时从第二个元素开始遍历

item 每次循环的当前元素

index 每次循环的当前下标

array 原数组

  1. 求和计算
第一次:pre–>1     next–>2     index–>1
pre+next=1+2=3
第二次:pre–>3     next–>3     index–>2
pre+next=3+3=6
第三次:pre–>6     next–>4     index–>3
pre+next=6+4=10
第四次:pre–>10     next–>5     index–>4

var arr1 = [1,2,3,4,5] ;
var new1 = arr1.reduce(function(pre,next,index){
        return pre+next ;
       //pre+next=10+5=15
})
 console.log(new1);//15
  1. 扁平化数组(拼接数组)——一次reduce只能扁平化一层数组
var arr2 = [[1,2,3],[4,[5,9,10]],[6,7]] ;
var new2 = arr2.reduce(function(pre,next,index){
     console.log(pre);//[1, 2, 3]      [1, 2, 3, 4, Array(3):[5,9,10]]
     return pre.concat(next);    //前数组拼接后数组 .concat()
})
 console.log(new2);//[1, 2, 3, 4, [5,9,10], 6, 7]
  1. 对象数组叠加计算
var arr3 = [{price:10,count:1},{price:15,count:2},{price:10,count:3}];
var new3 = arr3.reduce(function(pre,next,index){
            return pre+next.price*next.count;
 },0)    //在原数组第一项添加为0,不改变原数组,则可不操作第一项
console.log(new3);//70
  1. 应用 : 计算数组中每个元素出现的次数(例如:投票板)
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice','Bob', 'Alice'];
var countedNames = names.reduce(function (allNames, name) {
    // console.log(allNames, '|' + name);
   if (name in allNames) {
        allNames[name]++;
    } else {
         allNames[name] = 1;
    }
    return allNames;
}, {});//最先给定一个空数组
 console.log(countedNames);//{Alice: 3, Bob: 2, Tiff: 1, Bruce: 1}

猜你喜欢

转载自blog.csdn.net/qq_64180670/article/details/129483798