数组,对于每一个前端人员来说是非常常见且重要的数据结构之一,也是面试常常出现的题目,掌握数组的方法能帮助我们更高效地处理问题。不过在数组的学习中,我们常常会混淆数组本身的方法和Javascript提供的数组的方法,在这里只简单归纳一下。

常用的数组方法

1、pop()

删除数组的最后一个元素,返回被删除的元素,原数组长度减1。原数组发生了变化,但没有创建新的数组。

clipboard.png

2、shift()

删除数组的第一个元素,返回被删除的元素,原数组长度减1。原数组发生了变化,但没有创建新的数组.

clipboard.png

3、unshift()

添加元素到数组的第一位,返回添加后的数组的长度,可见,原数组长度加1。原数组发生了变化,但没有创建新的数组。

clipboard.png

4、push()

添加元素到数组的最后,返回添加后的数组的长度,可见,原数组长度加1。原数组发生了变化,但没有创建新的数组。

clipboard.png

5、sort()

将指定数组进行排序,返回排好序的数组。改变了数组。

clipboard.png

6、reverse()

颠倒数组元素的顺序,返回逆序后的数组。改变了数组。

clipboard.png

7、join(separator)

返回字符串值,不影响原数组。

clipboard.png

8、toString()

将数组转为字符串,与join()的默认效果一致

clipboard.png

9、splice(start, end)

返回被删除的元素,从start开始删,删end个(包含start)。

clipboard.png

splice(start, end, item):返回被删除的元素,并插入新的元素item(从被删的位置插入)

clipboard.png

10、concat()

拼接两个或多个数组,返回新数组,对原数组没有影响

clipboard.png

clipboard.png

11、slice(start, end)

返回截取的新数组,从start开始截取,截end个,但截取的元素不包含第end个的元素,即截取end-1个。
slice(0):复制旧数组,生成新数组。

clipboard.png

ES5新增的方法

1、indexOf()

返回查找项第一次在数组中出现的位置,第一个参数为查找项,第二个参数可选,为查找开始的位置。如果查找不到,则返回 -1。这常常应用在数组去重的案例中。

clipboard.png

2、lastindexOf()

从后往前找,查找方向与 indexOf 相反。

clipboard.png

3、every(callback, [this.Arg])

当数组的所有元素都满足条件时,返回 true,否则返回false。

clipboard.png

条件是item>3,只有4,5,6,7大于3,返回false

4、some(callback, [this.Arg])

只要数组有一项元素满足条件,就返回 true,否则返回false。

clipboard.png

条件是item>3,4,5,6,7大于3,返回true

5、filter(callback, [this.Arg])

满足条件的元素组成新的数组

clipboard.png

条件是item>3,4, 5, 6, 7大于3,返回[4, 5, 6, 7]

6、map(callback, [this.Arg])

每次调用函数处理后的值组成新的数组

var arr = [{"name": "Amy", age: 20}, {"name": "Sheldon"}, age: 22];
var result = map(function(item, index, array){
  return item.age   //返回[20, 22]
})

7、forEach()

循环遍历,与for循环差不多,适用于循环次数未知,缺点是不能中断循环


默默
252 声望5 粉丝