js数组常用方法总结

js数组常用方法

前言：最近工作不忙，抽出了很多时间思考，觉得需要把学到的东西用自己的话总结出来，这样一来，或许能内化为自己真正的东西，所以我打算写博客把js数组中常用的方法总结出来，如果写的不正确，欢迎各位指责。

1、push

---

作用：在数组末尾添加一项或多项

参数：要添加的项

返回值：新数组的长度

是否改变原数组：是  

var arr = [1,2,3,4]
var res = arr.push(5, 6)
console.log(arr) // [1,2,3,4,5,6]
console.log(res) // 6

2、pop

---

作用：删除数组尾项

参数：无

返回值：删除的项

是否改变原数组：是

var arr = [1,2,3,4]
var res = arr.pop()
console.log(arr) // [1,2,3]
console.log(res) // 4

3、unshift

---

作用：在数组开头添加一项或多项

参数：要添加的项

返回值：新数组的长度

是否改变原数组：改变

var arr = [1,2,3,4]
var res = arr.unshift(5,6)
console.log(arr) // [5,6,1,2,3,4]
console.log(res) // 6

4、shift

---

作用：删除数组首项

参数：无

返回值：删除的项

是否改变原数组：改变

var arr = [1,2,3,4]
var res = arr.shift()
console.log(arr) // [2,3,4]
console.log(res) // 1

5、splice

---

作用：增删改

参数：ary.splice(index, howmany, item1, ....., itemX)

返回值：删除的项（数组）

是否改变原数组：是

1. 增加：ary.splice(index, 0, item1, ....., itemX)

2. 删除：ary.splice(index, howmany) 

3. 修改：ary.splice(index, howmany, item1, ....., itemX)

ary.splice(n)  // 表示从索引n开始删除到末尾
ary.splice(0)  // 删除整个数组 有克隆数组的效果，利用返回值

6、slice

---

作用：截取（复制）数组

参数：ary.slice(start, end)

返回值：截取的新数组

是否改变原数组：否

var ary = [1,2,3,4,5]
var res = ary.slice(1,3)
var res2 = ary.slice(-3,-1)
console.log(ary)  // [1,2,3,4,5]
console.log(res)  // [2,3]
console.log(res2)  //[3,4] slice支持负参数，从最后一项开始算起，-1为最后一项，-2为倒数第二项

slice(n) //从索引n开始复制到最后一项
slice()、 slice(0)  //复制整个数组

7、join

---

作用：用指定的分隔符将数组每一项拼接为字符串

参数：指定的分隔符，如果省略该参数，则使用逗号作为分隔符

返回值：拼接好的字符串

是否改变原数组：否

var ary = [1,2,3,4,5]
var res = ary.join('-')
console.log(ary)  // [1, 2, 3, 4, 5]
console.log(res)  // 1-2-3-4-5

8、concat

---

作用：用于连接两个或多个数组

参数：可以是具体的值，也可以是数组对象。可以是任意多个

返回值：返回连接后的新数组

是否改变原数组：否

​
var ary = [1,2,3,4,5]
var res = ary.concat(6,7)
var res2 = ary.concat(6,[7,8])
var res3 = ary.concat(6,[7,[8,9]])
var res4 = ary.concat()
console.log(ary)  // [1, 2, 3, 4, 5]
console.log(res)  // [1, 2, 3, 4, 5, 6, 7]
console.log(res2)  //[1, 2, 3, 4, 5, 6, 7, 8] 参数是数组，那么添加的是数组中的元素，而不是数组
console.log(res3)  // [1, 2, 3, 4, 5, 6, 7, [8,9]] 二维数组只拆一层 
console.log(res4) // [1, 2, 3, 4, 5] 克隆数组
​

9、sort

---

作用：对数组元素进行排序

参数：可选(函数) 规定排序规则 默认排序顺序为按字母升序

返回值：排序后的原数组

是否改变原数组：是

var ary = [1,5,7,9,12,24,56,87,92]
var ary2 = [1,5,7,9,12,24,56,87,92]
var ary3 = [1,5,7,9,12,24,56,87,92]
var res = ary.sort()
var res2 = ary2.sort(function(a,b){
    return a-b
})
var res3 = ary3.sort(function(a,b){
    return b-a
})
// sort的参数函数总的形参a,b就是数组排序时候的相邻比较的两项
console.log(res)  // [1, 12, 24, 5, 56, 7, 87, 9, 92]
console.log(res2) // [1, 5, 7, 9, 12, 24, 56, 87, 92]
console.log(res3) // [92, 87, 56, 24, 12, 9, 7, 5, 1]

10、reverse

---

作用：倒序数组

参数：无

返回值：倒序后的原数组

是否改变数组：是

var ary = [1,2,3,4,5]
var res = ary.reverse()
console.log(ary)  // [5, 4, 3, 2, 1]
console.log(res)  // [5, 4, 3, 2, 1]

11、indexOf

---

作用：查找指定元素的位置

参数：array.indexOf(item, start)  item：查找的元素  start：字符串中开始检索的位置

返回值：返回第一次查到的索引，未找到返回-1

是否改变原数组： 否

var ary = [1,2,3,4,5]
var res = ary.indexOf(3);
console.log(ary);  // [1,2,3,4,5]
console.log(res);  // 2
var ary = ['a','b','c','d','c'];
var res = ary.indexOf('c',3);
console.log(res) // 4

12、lastIndexOf

---

作用：查找指定元素最后出现的位置

参数：array.indexOf(item, start)  item：查找的元素  start：字符串中开始检索的位置

返回值：返回查到的元素的索引，未找到返回-1

是否改变原数组：否

var ary = ['a','b','c','d','c'];
var res = ary.lastIndexOf('c',3);
var res2 = ary.lastIndexOf('c',1);
console.log(res); // 2
console.log(res2); // -1

13、forEach

---

作用：循环遍历数组每一项

参数：函数 ary.forEach(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组

返回值：无

是否改变原数组： 否

var ary = ['a','b','c']
var res = ary.forEach(function(item,index,ary){
    console.log(item,index,ary);
/*  a 0 ["a", "b", "c"]
    b 1 ["a", "b", "c"]
    c 2 ["a", "b", "c"]
*/  
    return item;
})
console.log(res)  // undefined  无返回值

14、map

---

作用：数组中的元素为原始数组元素调用函数处理后的值

参数：函数 ary.map(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组

返回值：新数组

是否改变原数组：否

var ary = ['a','b','c']
var res = ary.map(function(item,index,ary){
    return item+1;
})
console.log(res)  // ["a1", "b1", "c1"]

15、filter

---

作用：创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

参数：函数 ary.filter(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组

返回值：新数组

是否改变原数组：否

var ary = [1,2,3,4,5,6]
var res = ary.filter(function(item){
    return item<3;
})
console.log(res)  // [1,2]

16、every

---

作用：检测数组所有元素是否都符合指定条件

参数：函数 ary.every(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组

返回值：布尔值

是否改变原数组： 否

var ary = [1,2,3,4,5,6]
var res = ary.every(function(item){
    return item<3;
})
var res2 = ary.every(function(item){
    return item<7;
})
console.log(res)  // false;
console.log(res2)  // true;
1 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。
2 如果所有元素都满足条件，则返回 true。

17、some

---

作用：检测数组中的元素是否满足指定条件

参数：函数 ary.some(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组

返回值：布尔值

是否改变原数组：否

var ary = [1,2,3,4,5,6]
var res = ary.some(function(item){
    return item<3;
})
console.log(res)  // true;
1 如果有一个元素满足条件，则表达式返回 true , 剩余的元素不会再执行检测。
2 如果没有满足条件的元素，则返回 false。