前言
在日常的代码逻辑中,我们少不了对数组进行一些操作,但是,你真的清楚地了解数组的每个方法嘛?
举个栗子
有一个小小的需求,写一个方法,有两个参数,一个是数组,另一个是需要添加到数组里面的元素。
function arrPush(arr, target) {
return arr.push(target);
}
var arr_1 = [1, 2, 3];
console.log(arrPush(arr_1, 4));
我们的需求就是把[1, 2, 3]变成[1, 2, 3, 4],看起来好像没有错诶~那最后的console.log()结果是什么呢?
最后的结果是4,如果你还没有看出来,那可能是没有真正地了解push()这个数组方法。
引玉
那我们就来整理一些常用的数组方法api吧,方便日常的简单查阅
array.push()
作用:在调用数组中尾部添加一个或多个元素,并且返回数组的新长度 这也就能解释,为什么上面的栗子最后的结果是4,而不是我们想要的[1, 2, 3, 4]了。那么改写一下上面的栗子,如下:
function arrPush(arr, target) {
arr.push(target)
return arr;
}
var arr_1 = [1, 2, 3];
console.log(arrPush(arr_1, 4));
这个时候结果才是我们最后想要的[1, 2, 3, 4],顺便就说说push方法可以同时接收多个参数,像这样arr.push(1, 2, 3, 4),返回结果当然还是数组的新长度啦。
array.pop()
作用:与array.push()相反,它是删除调用数组的最后一个元素,减小数组的长度并返回它删除的值
let a = [1,2,3,4,5,6]
a.pop() //a = [1,2,3,4,5] 返回 6
let b = [1,2,3,4,[5,6]]
b.pop() //b = [1,2,3,4] 返回 [5,6]
array.unshift()
作用:在调用数组中头部添加一个或多个元素,并且返回数组的新长度
let a = [1,2,3]
a.unshift(5) //a = [5,1,2,3] 返回 4
let b = [1,2,3,4]
b.unshift([5,6]) //b = [[5,6],1,2,3,4] 返回 5
array.shift()
作用:与array.unshift()相反,删除调用数组的第一个元素,并且返回它删除的值
let a = [1,2,3]
a.shift() //a = [2,3] 返回 1
let b = [[5,6],1,2,3,4]
b.shift() //b = [1,2,3,4] 返回 [5,6]
array.join()
作用:将数组中所有的元素都转化为字符串并连接在一起,返回最后生成的字符串
let a = [1,2,3]
a.join() //返回 1,2,3
a.join("") //返回 123
a.join(" ") //返回 1 2 3
a.join(",") //返回 1,2,3
array.reverse()
作用:将数组中的元素颠倒顺序,返回逆向数组
let a = [1,2,3]
a.reverse() //返回 [3,2,1]
array.concat()
作用:创建并返回一个新数组,它的元素包含调用concat()的原始数组的元素和concat()的每个参数。如果这些参数中任何一个自身是数组,则连接的是数组的元素,而非数组本身。
let a = [1,2,3]
a.concat(4,5) //返回 [1,2,3,4,5]
a.concat([4,5]) //返回 [1,2,3,4,5]
a.concat([4,5],[6,7]) //返回 [1,2,3,4,5,6,7]
a.concat(4,[5,[6,7]]) //返回 [1,2,3,4,5,[6,7]]
array.map()
作用:将调用数组中每一项进行操作后返回新的数组,且不修改调用的数组
let a = [1,2,3]
let b = a.map(function(x){return x*x})
console.log(b) //b=[1,4,9]
array.filter()
作用:返回调用数组中满足条件的元素组成的新数组
let a = [1,2,3,4,5,6]
let b = a.filter(function(x){return x < 3})
console.log(b) //b=[1,2]
总结
以上是我在工作中有用到的数组方法,我对他们集中罗列了一下,也算是自我复习一下,以防自己在日后的工作中使用不当,数组方法还有很多,希望小伙伴们在使用前认真查阅文档,正确使用方法。最后贴图一张,日后继续整理归纳。