关于JS中常用的数组方法

JS中数组方法的总结与运用

数组中常用的方法

push( )

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

返回值:增加后的数组的长度

pop( )

删除数组的最后一个元素,并将该元素吐出来

返回值:删除的元素

unshift( )

向数组的开头添加一个或多个元素

返回值:增加后的数组的长度

shift( )

删除数组的第一个元素,并将该元素吐出来

返回值:删除的元素

reverse( )

将数组中的元素顺序颠倒,是对原数组的操作

返回值:倒序之后的原数组

sort( )

对数组的元素从大到小排列,是对原数组的操作

返回值:重新排序后的的原数组

split( )

将一个字符串分割成一个数组,每一个字符就是数组中的一个元素

参数:

  1. separator(可选),为字符串或正则表达式,从该参数指定的地方分割。如果没有默认返回的数组中只有一个元素,该元素的值就是原字符串
  2. limit(可选),该参数可指定返回的数组的最大长度,如果没有默认不限制返回的数组长度

返回值:不改变原字符串,返回创建好的新数组

join( )

用于将数组中的所有元素放入一个字符串

参数:该参数作为指定的分隔符将将这些元素隔开

返回值:不改变原数组,返回创建好的字符串如果没有默认分隔符为逗号

concat( )——数组的拼接

用于连接两个或多个数组

参数:若干个数组,如果参数中含有数值,会直接将该数值push进创建好的数组里

返回值:不改变原数组,会创建一个新的数组返回

注意:concat( )不能拼接多维数组

slice( )——数组的删改

数组的截取,从已有的数组中返回指定的元素

参数:

  1. 没有参数,则默认不执行截取操作,截取的数组包含原数组中的所有内容
  2. 只有一个参数,且该参数大于等于0,则截取的部分是以参数为下标的元素开始算起(包含该元素)的后半段数组
  3. 只有一个参数x,且该参数小于0,取x的绝对值-x,则截取的部分是倒数第-x个元素算起(包含该元素)的后半段数组
  4. 存在两个参数,且都大于0,且第一个参数小于第二个参数,截取时遵循“左闭右开”原则:从以第一个参数为下标的元素算起(包含该元素)以第二个参数为下标的元素截至(不包含该元素)
  5. 存在两个参数,且都大于0,且第一个参数大于第二个参数,则无法截取,返回值是一个空数组
  6. 存在两个参数,参数一x小于参数二y,且都小于0,取两个数的绝对值-x和-y,则截取的部分是从倒数第-x个元素算起(包含该元素)到倒数第-y个元素截至(不包含该元素)
  7. 存在两个参数,参数一大于参数二,且都小于0,则截取的结果为空数组

返回值:截取下来的新数组,不会改变原数组

除此之外,将类数组转化为数组也可以用slice方法:

let str='123456'
let arr=(Array.prototype.slice.call(str))
console.log(arr)//输出结果为数组[1,2,3,4,5,6]

//还有一种操作:
function test(){
 return Array.prototype.slice.call(arguments)
}
let arr1=test(1,2,3,4,5)
console.log(arr1)//打印结果为数组[1,2,3,4,5]

注意:这种方法不改变原字符串

splice( )——数组的删改

用于添加或删除数组中的元素

参数:

  1. 没有参数,则默认不执行截取,返回空数组

  2. 只有一个参数,且该参数大于等于0,则截取的部分是以参数为下标的元素开始算起(包含该元素)的后半段数组

  3. 只有一个参数x,且该参数小于0,取x的绝对值-x,则截取的部分是倒数第-x个元素算起的后半段数组

  4. 存在两个参数,且都大于零,则第一个参数为开始截取的位置,第二个参数X指定删除元素的个数,则截取的范围是以第一个参数为下标的元素算起(包含该元素)直到截取X个元素为止

    注意:当第二个参数不合法时,如传入了负数、undefined或NaN,则不会截取,返回空数组

  5. 存在三个或更多参数,则执行给原数组插入操作。会将第三个以及后面所有的参数直接插入到原数组的指定位置,返回值是一个空数组

返回值:返回的是由删除元素组成的数组

注意:splice与slice的最大区别就是splice会影响原数组,而slice不会

indexOf( )

查找指定的元素在数组中首次出现(检索方向:从左至右)的位置(索引),如果数组中不存在该元素,则返回-1

参数

  1. 参数一(必备参数),规定需要查找的元素
  2. 参数二(可选参数),规定在数组中开始检索的位置,如果没有则从数组的第一个元素开始检索

lastIndexOf( )

查找指定的元素在数组中首次出现(检索方向:从右至左)的位置(索引),如果数组中不存在该元素,则返回-1

参数

  1. 参数一(必备参数),规定需要查找的元素
  2. 参数二(可选参数),规定在数组中开始检索的位置,如果没有则从数组的最后一个元素开始检索

Array( )——数组的创建

用于创建数组

参数:

  1. 只有一个参数则会创建一个长度为三的数组,但是没有任何元素
  2. 参数个数大于一则所有参数都将作为创建好的数组中的元素

返回值:创建好的数组

Array.of( )——数组的创建

由于Array( )方法容易引起歧义,所以引入了Array.of( )方法

用于创建数组

参数:若干个参数,所有的参数会成为创建好的数组中的元素

返回值:创建好的新数组

Array.from( )——数组的创建

将类数组对象转化为真正的数组对象

slice( )方法也可以将类数组转化为数组,但是较为麻烦:

let str='123456'

let arr=Array.prototype.slice.call(str)

参数:类数组,比如字符串

返回值:创建好的新数组

includes( )

判断一个数组是否包含一个指定的值

参数:需要查找的元素

返回值:如果数组中包含该元素则返回true,否则返回false

fill( )——数组的填充

将一个固定值替换原数组的元素,修改的是原数组

参数:

  1. 只有一个参数,则原数组中的所有元素都会被该参数替换
  2. 若存在三个参数,则从原数组中下标为第二个参数的元素开始(包含该元素)至下标为第三个参数的元素(不包含该元素)都将被替换

返回值:更改后的原数组

isArray( )

判断一个对象是否为数组

返回值:如果该对象是数组,则返回true,否则返回false

find( )

在数组中寻找第一个满足测试条件的元素并返回

参数:形如item => {return item=>4}的函数

let arr=[1,2,3,4,5,6]
console.log(arr.find(item=>{
    return item>4//返回arr中第一个大于4的元素
}))

返回值:第一个符合条件的元素

findIndex( )

在数组中寻找第一个符合条件的元素并返回该元素的索引

参数:形如item => {return item=>4}的函数

let arr=[1,2,3,4,5,6]
console.log(arr.findIndex(item=>{
    return item>4//返回arr中第一个大于4的元素的索引
}))

返回值:第一个符合条件的元素的索引

遍历、迭代数组常用的方法

arr.keys( )

用于对数组或对象键名的遍历

执行arr.keys( )返回值是一个可迭代对象

let arr=[1,2,3,4,5]
for(let key of arr.keys()){
    console.log(key)
}

arr.values( )

执行arr.values( )返回值是一个可迭代对象

用于对数组或对象键值的遍历

let arr=[1,2,3,4,5]
for(let value of arr.values()){
    console.log(value)//会依次打印出数组中的元素
}

arr.entries( )

执行arr.entries( )返回值是一个可迭代对象

用于对数组或对象键值对的遍历

let arr=[1,2,3,4,5]
for(let [key,value] of arr.entries()){
    console.log(key,value)
}

此方法以及arr.values( )、arr.keys( )不仅适用于数组,也适用于对象,但调用方式不同

//但是对于对象而言,调用的方式与数组不一致:
let obj={a:1,b:2,c:3}
console.log(Object.keys(obj))//打印的是一个由对象中所有键名组成的数组,且该数组中的元素顺序是确定的
console.log(Object.values(obj))//打印的是一个由对象中所有键值组成的数组,且该数组中的元素顺序是确定的
console.log(Object.entries(obj))//打印的数组中的元素是对象中所有的键值对,是一个二维数组


//用for...of...可以遍历对象上的键值、键名、键值对:
for(let key of Object.keys(obj)){
	console.log(key)
}
for(let value of Object.values(obj)){
	console.log(value)
}
for(let [key,value] of Object.entries(obj)){
	console.log([key,value])
}

forEach( )

调用数组中的每一个元素,并将元素传递给回调函数

参数:

  1. 参数一,处理函数,该函数有三个形参:item、index、arr,分别代表当前调用的元素、该元素的下标以及数组本身
  2. 参数二(可选),指定处理函数中的this指向
let arr=[1,2,3,4,5,6]
arr.forEach(function(item,index,arr){
    console.log(item,index)
})
//下面的方法也能达到相同的效果:
Array.prototype.forEach.call(arr,function(item,index,arr){
    console.log(item,index)
 })

返回值:undefined

注意:当数组为空时,不会执行操作

map( )

返回一个新数组,新数组中的元素为原数组中的元素经过处理函数处理后的值

参数:

  1. 参数一,处理函数,该函数有三个形参:item、index、arr,分别代表当前调用的元素、该元素的下标以及数组本身
  2. 参数二(可选),指定处理函数中的this指向

注意,map()方法中的处理函数是有返回值的该返回值就是创建好的新数组当前位置的元素

let arr=[1,2,3,4,5]
let arr1=arr.map(function(item,index,arr){
 return item*2
})
console.log(arr1)//打印的结果为新数组[2,4,6,8,10]

返回值:创建好的新数组,新数组中的元素和原数组的元素存在一一映射的关系

filter( )——过滤器

创建一个新数组,新数组中的元素是原数组中符合条件的元素

参数:

  1. 参数一,处理函数,该函数有三个形参:item、index、arr,分别代表当前调用的元素、该元素的下标以及数组本身,filter( )的处理函数需要返回一个布尔值该布尔值决定了当前元素是否通过过滤
  2. 参数二(可选),指定处理函数中的this指向

返回值:创建好的新数组

//去掉数组中的undefined和null
let arr=[1,2,3,undefined,45,null,0]
let arr1=arr.filter(function(item,index,arr){
    return item!=undefined
})

some( )

检验数组中的元素是否符合条件

参数:

  1. 参数一,处理函数,该函数有三个形参:item、index、arr,分别代表当前调用的元素、该元素的下标以及数组本身,some( )的处理函数需要返回一个布尔值,若当前元素符合条件,则该布尔值为true且剩余的元素不会再检验;若没有满足条件的元素,则返回false
  2. 参数二(可选),指定处理函数中的this指向

返回值:布尔值

every( )

检验数组中的元素是否符合条件

参数:

  1. 参数一,处理函数,该函数有三个形参:item、index、arr,分别代表当前调用的元素、该元素的下标以及数组本身,every( )的处理函数需要返回一个布尔值,若所有元素都符合条件,则该布尔值为true反之则返false
  2. 参数二(可选),指定处理函数中的this指向

返回值:布尔值

reduce( )——归纳函数、累加器

参数
  1. callback(回调函数)执行数组中每个值(如果没有提供initalValue则第一个值除外)的函数,包含四个参数:

    1. accumulator

      累加器累计回调的返回值;它是上一次调用回调时返回的累积值,或initalValue

    2. currentValue

      数组中正在处理的元素

    3. index(可选)

      数组中正在处理的当前元素的索引。如果提供了initalValue,则起始索引号为0,否则索引从1开始

    4. array(可选)

      调用reduce( )的数组

  2. initalValue(可选)

    作为第一次调用callback函数时的第一个参数的值。如果没有提供初始值,则将使用数组中的第一个元素

在没有初始值的空数组上调用reduce将报错

reduce的使用场景
数组里所有值的和
let sum=[1,2,3,4,5,6].reduce(function(accumulator,currentValue){
    return accumulator+currentValue
},0)
//和为6

也可以写成箭头函数的形式:

let total=[1,2,3,4,5,6].reduce((accumulator,currentValue)=>{
   	return  accumulator+currentValue
},0)
累加对象数组(数组里的元素为对象)里的值
let initalValue=0
let sum=[{x:1},{x:2},{x:3}].reduce(function(accumulator,currentValue){
    return initalValue+currentValue.x
},initalValue)
将二维数组转化为一维数组
let arr=[[0,1],[2,3],[4,5]].reduce(function(accumulator,currentValue){
    return [].concat(currentValue)
},[])
计算数组中每个元素出现的次数
let name=['a','b','t','b','a']
//计算name中各个元素出现的次数:
let result=name.reduce(function(accumulator,currentValue){
   if(currentValue in accumulator){
       accumulator[currentValue]++
   }else{
       accumulator[currentValue]=1
   }
    return accumulator
},{})
console.log(result)
//打印结果为:
//{'a':2,'b':2,'t':1}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值