JavaScript数组API大合集

JavaScript数组知识点整理

1.jion()

将数组转换为字符串，()中放连接符，默认为逗号，该方法不会改变原数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryJoin = ary.join();
        console.log(ary); //输出原数组
        console.log(aryJoin); //1,2,3,4,5,6,7,8,9

2.push()

给数组末尾添加新内容，可以添加多个，用逗号隔开，不可以添加数组，添加数组会变成多维数组。返回值为新数组的长度，会将原数组改变为新数组。

   　　 var ary = [1,2,3,4,5,6,7,8,9];
        var aryPush = ary.push(10,11,12);
        console.log(ary);  //数组[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
        console.log(aryPush); //12

3.pop()

用于删除数组的最后一个元素，返回值为删除的元素，会将原素组改变为新数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryPop = ary.pop();
        console.log(ary); //[1,2,3,4,5,6,7,8]
        console.log(aryPop); // 9

4.shift()

用于删除数组的第一个元素，返回值为删除的元素，会将原数组改变为新数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryShift = ary.shift();
        console.log(ary); //[2,3,4,5,6,7,8,9]
        console.log(aryShift); // 11

5.unshift()

用于给数组开头添加元素，与pop()相反，返回值为新数组的长度，会将原数组改变为新数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryUnshift = ary.unshift(0,1);
        console.log(ary); // [0,1,1,2,3,4,5,6,7,8,9]
        console.log(aryUnshift); //11

6.sort()

用于给数组中的元素排序。但是sort()方法是按照字符的Unicode进行排序的。因此不能直接用来对数值进行排序 ，如果需要从小到大或者从大到小排序需要给sort()一个参数。sort()方法会改变原数组，原数组变为排序后的数组，返回值为新数组。

        var ary = [567,135,103,21,351,40,73,89,9];
        var arySort = ary.sort();
        console.log(ary); //[103, 135, 21, 351, 40, 567, 73, 89, 9]
        console.log(arySort); //[103, 135, 21, 351, 40, 567, 73, 89, 9]
        //从小到大 因为sort()会改变原数组，所以重新赋值
        ary = [567,135,103,21,351,40,73,89,9];
        var arySortA_B = ary.sort((a,b)=>a-b);
        console.log(arySortA_B); //[9, 21, 40, 73, 89, 103, 135, 351, 567]
        //从大到小 因为sort()会改变原数组，所以重新赋值
        ary = [567,135,103,21,351,40,73,89,9];
        var arySortB_A = ary.sort((a,b)=>b-a)
        console.log(arySortB_A);  //[567, 351, 135, 103, 89, 73, 40, 21, 9]

7.reverse()

用于颠倒数组，返回值是颠倒过后的新数组，会改变原数组，原数组变为改变过后的新数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryReverse = ary.reverse();
        console.log(ary); //[9,8,7,6,5,4,3,2,1]
        console.log(aryReverse); //[9,8,7,6,5,4,3,2,1]

8.concat()

该方法用来拼接字符串，可以直接将数组作为参数，也可以直接将新元素作为参数，若有多个新元素时用逗号隔开。该方法返回值为新数组，不会改变原数组。

        var aryOne = [1,2,3,4,5];
        var aryTwo = [6,7,8,9];
        var aryConcatOne = aryOne.concat(aryTwo);
        var aryConcatTwo = aryOne.concat(6,7,8,9);
        console.log(aryOne); //[1,2,3,4,5]
        console.log(aryTwo); //[6,7,8,9]
        console.log(aryConcatOne); // [1,2,3,4,5,6,7,8,9]
        console.log(aryConcatTwo); // [1,2,3,4,5,6,7,8,9]

9.slice()

该方法用来截取数组。可以写一个参数，也可以写两个参数。写一个参数时就是从第几个开始截取到最后一个。两个参数时就是从第几个截取到第几个的前一个，即 [ ) 前闭后开。只有一个值时返回值为截取下来的新数组，有两个参数时返回值也是截取下来的新数组。该方法不会改变原数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var arySliceOne = ary.slice(3);
        var arySliceTwo = ary.slice(5,8);
        console.log(ary); //[1,2,3,4,5,6,7,8,9]
        console.log(arySliceOne); //[4,5,6,7,8,9]
        console.log(arySliceTwo); // [6,7,8]

10.splice()

①删除

只有一个参数时是从开头删除若干项。有两个参数时是删除从哪里到哪里。该方法会改变原数组为删除指定项之后的数组。返回值为删除的元素组成的数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var arySplice = ary.splice(1);
        console.log(ary); //[1]
        console.log(arySplice);// [2,3,4,5,6,7,8,9]

        var ary = [1,2,3,4,5,6,7,8,9];
        var arySplice = ary.splice(1,3);
        console.log(ary);//[1,5,6,7,8,9,]
        console.log(arySplice); // [2,3,4]

②替换

有三个参数，第一个参数表示起始位置，第二个参数表示要删除的项数，第三个参数为要插入的项数。会改变原数组为新数组，返回值为被替换掉的元素。

        var ary = [1,2,3,4,5,6,7,8,9];
        var arySplice = ary.splice(1,5,2,3);
        console.log(ary); //[1,2,3,7,8,9]
        console.log(arySplice); //[2,3,4,5,6]

③插入

只需要将要删除的项数改为0就可以变为插入。会改变原数组为新数组，返回值为空数组。

        var ary = [1,2,3,4,5,6,7,8,9];
        var arySplice = ary.splice(2,0,5,1);
        console.log(ary); //[1,2,5,3,4,5,6,7,8,9]
        console.log(arySplice); //[]

11.indexOf()

查找。第一个参数为要查找的项，第二个参数为起始位置，如果没有就默认从头开始。如果查找到了返回该元素的位置，若没有查找到返回-1；不会改变原数组。

            var ary = [1, 2, 3, 4, 5, 6, 7, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1];
            var aryIndexOfOne = ary.indexOf(3);
            console.log(ary); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1]
            console.log(aryIndexOfOne); // 2
            var aryIndexOfTwo = ary.indexOf(10, 1);
            console.log(ary); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1]
            console.log(aryIndexOfTwo); // -1

12.lastIndexOf()

查找。与indexOf()不同的是indexOf()为从头开始查找，lastIndexOf()是从后往前查找。参数一样，但是，虽然是从后开始查找，返回值却是数组正向时的索引。

            var ary = [1, 2, 3, 4, 5, 6, 7, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1];
            var aryLastIndexOfOne = ary.lastIndexOf(3);
            console.log(ary); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1]
            console.log(aryLastIndexOfOne); // 14
            var aryLastIndexOfTwo = ary.lastIndexOf(10, 1);
            console.log(ary); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 8, 7, 6, 5, 4, 3, 2, 1]
            console.log(aryLastIndexOfTwo); // -1

13.forEach()

用来遍历数组，参数为函数，可以传参，第一个参数为当前元素，第二个参数为当前索引，第三个参数为原数组。

        var arr = [1,2,3,4,5,6,7,8,9];
        var arrForEach = arr.forEach(function(a,b,c){
            console.log(a);  //输出遍历的元素
            console.log(b);  //输出索引
            console.log(c)   //输出原数组
        });

14.map()

map()的作用也是遍历数组，但是可以对数组中的每一项元素进行操作，然后返回一个新的数组。map()中的参数也是一个函数。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryMap = ary.map(function(item){
            return item+1;
        })
        console.log(ary);//[1, 2, 3, 4, 5, 6, 7, 8, 9]
        console.log(aryMap);//[1, 2, 3, 4, 5, 6, 7, 8, 9]

15.fllter()

过滤器。遍历每一项元素，检测其中符合要求的元素放入新元素。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryFilter = ary.filter(function(currentValue,index,arr){ //currentValue当前元素的值，index索引，arr当前元素属于的数组对象
            console.log(currentValue); //输入当前值
            console.log(index); //输出索引
            console.log(arr); //输出数组ary
            return currentValue%2==0;
            
        });
        console.log(ary);//[1,2,3,4,5,6,7,8,9]
        console.log(aryFilter); //[2, 4, 6, 8]

16.every()

同样为遍历，参数为一个函数。不同的是只有每一项元素都满足要求时才会返回true,否则就返回false.

        //15.every()
        var ary = [1, 2, 3, 4, 5, 6, 7, 8, 9];
        var aryEveryOne = ary.every(function(currentValue) { //currentValue当前元素的值(必选)，index索引，arr当前元素属于的数组对象    
            return currentValue > 0;
        })
        var aryEveryTwo = ary.every(function(currentValue) {
            return currentValue > 5;
        })
        console.log(aryEveryOne); //true
        console.log(aryEveryTwo); //false

17.some()

some()和every()差不多,唯一不同的是，some()只要有一个满足要求就会返回true

        var ary = [1,2,3,4,5,6,7,8,9];
        var arySomeOne = ary.some(function(currentValue){
            return currentValue <0;
        })
        var arySomeTwo = ary.some(function(currentValue){
            return currentValue > 5;
        })
        console.log(arySomeOne); //false
        console.log(arySomeTwo); //true

18.for..in

for..in 在遍历数组时遍历的为数组的索引。

        var ary = [1,2,3,4,5,6,7,8,9];
        for(var index in ary){
            console.log(index); //依次输入 0 1 2 3 4 5 6 7 8
            console.log(ary[index]); //依次输出  1 2 3 4 5 6 7 8 9
        }

for..in 一般用来遍历对象的键名

        var Obj = {
            name:"saoge",
            age:18
        }
        for(var index in Obj){
            console.log(index); //依次输出 name  age 
            console.log(Obj[index]); //依次输出 saoge  18
        }

19.for..of

for..of在遍历数组时遍历的为数组的元素。但是不能遍历对象。

        var ary = [1,2,3,4,5,6,7,8,9];
        for(var index of ary){
            console.log(index) //依次输出 1 2 3 4 5 6 7 8 9
        }

20.reduce()

reduce()用于接收一个函数作为累加器。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryReduce = ary.reduce(function(total,currentValue){
            //total 必需，初始值或计算结束后返回值
            //currentValue 必须，当前元素
            // currentIndex 可选,当前元素的索引
            // arr 可以选,当前元素所属的数组对象
            console.log(total); //依次输出 1 3 6 10 15 21 28 36
            console.log(currentValue);//依次输出 2 3 4 5 6 7 8 9
            return total+currentValue;
        });
        console.log(aryReduce) //45

21.reduceRight()

作用同reduce()一样，只不过是从右往左。

        var ary = [1,2,3,4,5,6,7,8,9];
        var aryReduceRight = ary.reduceRight(function(total,currentValue){
            //total 必需，初始值或计算结束后返回值
            //currentValue 必须，当前元素
            // currentIndex 可选,当前元素的索引
            // arr 可以选,当前元素所属的数组对象
            // console.log(total); //依次输出 9 17 24 30 35 39 42 44
            console.log(currentValue);//依次输出 8 7 6 5 4 3 2 1
            return total+currentValue;
        });
        console.log(aryReduceRight) //45

数组知识点小总结  2020-09-28 21:50:17