js的数组方法整理

这几天发现自己对js的数组方法有点生疏，这里整理一下，方便后期查看

首先看一下汇总：

1.join()

2.push()

3.pop()

4.unshift()

5.shift()

6.reverse()

7.sort()

8.concat()

9.slice()

10.splice()

下面是ES5新增

1.indexOf()

2.forEach（）

3.map()

4.filter()

5.every()

6.some()

接下来我们来看详解：

1.join()：将数组转换成对应的字符串。参数就是连接符。（不改变原数组）

var arr=["a", "b", "c", "d", "e", "f", "g"];
console.log(arr.join('#'));  //a#b#c#d#e#f#g
console.log(arr.join(''));   //abcdefg
console.log(arr.join(','));  //a,b,c,d,e,f,g
console.log(arr);   //["a", "b", "c", "d", "e", "f", "g"]

2.push()：可以接受任意数量的参数，把他们逐个添加到数组末尾，返回的是数组修改后的长度，改变原数组

var arr=["a","b","c","d"];
console.log(arr.push("e","f","g"));  //7
console.log(arr)；  //["a", "b", "c", "d", "e", "f", "g"]

3.pop()：从数组末尾移除最后一项，返回的是移除的那一项

var arr=["a","b","c","d"];
console.log(arr.pop());  //d
console.log(arr)；  //["a", "b", "c"]

4.unshift()：接受任意数量的参数，把他们逐个添加到数组前面，并返回修改后数组的长度

var arr=["a","b","c","d"];
console.log(arr.push("e","f","g"));  //7
console.log(arr)；  //["e", "f", "g","a", "b", "c", "d" ]

5.shift()：移除数组中的第一项，返回的是移除的哪一项

var arr=["a","b","c","d"];
console.log(arr.shift());  //a
console.log(arr);  //["b", "c", "d"]

6.reverse()：反转数组项的顺序，会改变原数组

var arr=["a","b","c","d"];
console.log(arr.reverse());  //["d", "c", "b", "a"]
console.log(arr);  //["d", "c", "b", "a"]

7.sort()：按字母表升序排列数组项，会改变原数组，如果要按照其他方式而非字母表顺序进行数组排列，必须给sort方法传递一个比较函数

var arr=["c","b","a","d"];
console.log(arr.sort());  //["a", "b", "c", "d"]
console.log(arr);  //["a", "b", "c", "d"]

var arr1= ["orange", "pear", "banana", "apple"];
console.log(arr1);  //["orange", "pear", "banana", "apple"]
console.log(arr1.sort());  //["apple", "banana", "orange", "pear"]

var arr2 = [9,5,1,7,3,4,2,8,6];
console.log(arr1.sort());  //[1, 2, 3, 4, 5, 6, 7, 8, 9]
var arr3 = [39,95,100,7,3,4,2,800,6];
console.log(arr1.sort());  //[100, 2, 3, 39, 4, 6, 7, 800, 95]

var arr4 = [39,95,100,7,3,4,2,800,6];
console.log(arr4);  //[39,95,100,7,3,4,2,800,6]
arr1.sort(function(a,b){
    return a-b;
 });
console.log(arr4);  //[2, 3, 4, 6, 7, 39, 95, 100, 800]

8.concat()：可以基于当前数组中的所有项创建一个新数组，参数可以是任意个数组项或数组，不会改变原数组

var arr=['a','b','c'];
var arrnum=[1,2,3];
var newarr=arr.concat();  //浅拷贝
console.log(newarr);  //["a", "b", "c"]
var newarr2=arr.concat("d",arrnum);  //参数可以是数组项或数组
console.log(newarr2);  //["a", "b", "c", "d", 1, 2, 3]

9.slice()：基于的当前数组中的一项或多个项创建一个新数组。可以接受一或两个参数，即要返回的起始和结束索引位置，包括开始位置，不包括结束位置。

var arr=["a", "b", "c", "d", "e", "f", "g"];
console.log(arr.slice());//全部截取
console.log(arr.slice(3));//3 开始位置--->后面的所有项。
console.log(arr.slice(3,6));//["d", "e", "f"]开始位置3---结束位置6,不包括结束位置
console.log(arr.slice(1,-2));//["b", "c", "d", "e"]负数，从后往前数-1开始(截取顺序一定是从前往后)
console.log(arr.slice(1,5));//["b", "c", "d", "e"]
console.log(arr.slice(-6,-2));//["b", "c", "d", "e"]
console.log(arr.slice(-250,-15));//[]
console.log(arr);//["a", "b", "c", "d", "e", "f", "g"]

10.splice()：对数组进行删除、插入、替换，是最强大的数组方法，返回值是数组（删除的项）

//删除
var arr=["a", "b", "c", "d", "e", "f", "g"];
console.log(arr.splice(2,4));  //["c", "d", "e", "f"] 
//参1：开始索引位置  参2：删除的长度  参3开始....代表添加的数组项
console.log(arr);  //["a","b","g"]

//插入
var arr=["a", "b", "c", "d", "e", "f", "g"];
console.log(arr.splice(3,0,'hehe','xixi'));   //[]
console.log(arr);    //["a", "b", "c", "hehe", "xixi", "d", "e", "f", "g"]

//替换
var arr=["a", "b", "c", "d", "e", "f", "g"];
console.log(arr.splice(3,2,'hehe'));   //["d", "e"]
console.log(arr);  //["a", "b", "c", "hehe", "f", "g"]

接下里我们来看ES5新增的方法

1.indexOf()：接收两个参数，分别为要查找的字符串值和起始查找的索引（可选的），若能找到返回字符串首次出现的位置的索引，否则返回-1

var arr=["a","b","c","d"];
console.log(arr.indexOf("c"));  //2
console.log(arr.indexOf("d",2));  //3
console.log(arr.indexOf("e"));  //-1

2.forEach()：对数组进行遍历循环，对数组的每一个元素只执行一次提供的函数。该方法没有返回值，参数都是function类型，默认有传参，参数分别为：遍历的数组内容，对应的数组索引，数组本身

var arr=["a","b","c","d"];
arr.forEach(function(x,index,a){
     console.log(x,index,a===arr)
})
//输出：
//a 0 true
//b 1 true
//c 2 true
//d 3 true

3.map()：返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值，该方法会按照原始数组元素顺序依次处理函数，不会对空数组进行检测，不会改变原数组

var arr=[1,2,3,4];
var newarr=arr.map(function(item){
      return item*2
});
console.log(arr);  //[1, 2, 3, 4]
console.log(newarr);  //[2, 4, 6, 8]

 4.filter()：对数组中的每一项运行给定的函数，对数组进行过滤，返回满足过滤条件的函数

var arr=[1,2,3,4];
var newarr=arr.filter(function(item,index){
      return item%2===0&&item>3
});
console.log(arr);  //[1, 2, 3, 4]
console.log(newarr);  //[4]

5.every()：判断数组中的每一项是否满足条件，只有所有的项满足条件，才会返回true，否则放回false

var arr=[1,2,3,4];
var newarr1=arr.every(function(item){
     return item<5;
});
var newarr2=arr.every(function(item){
     return item>5;
});
console.log(newarr1);  //true
console.log(newarr2);  //false

6.some()：判断数组中是否有满足条件的项，只要有一项满足条件，就会返回true

var arr=[1,2,3,4];
var newarr1=arr.some(function(item){
    return item===1;
});
var newarr2=arr.some(function(item){
     return item===5;
});
console.log(newarr1);  //true
console.log(newarr2);  //false

文章部分参考：https://www.cnblogs.com/zyfeng/p/10541133.html