zoukankan      html  css  js  c++  java
  • 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

     

  • 相关阅读:
    【Azure Redis 缓存】Azure Redis 功能性讨论二
    【Azure Developer】如何用Microsoft Graph API管理AAD Application里面的Permissions
    【Azure 环境】通过Python SDK收集所有订阅简略信息,例如订阅id 名称, 资源组及组内资源信息等,如何给Python应用赋予相应的权限才能获取到信息呢?
    【Azure 应用服务】App Service与APIM同时集成到同一个虚拟网络后,如何通过内网访问内部VNET的APIM呢?
    【Azure 云服务】如何从Azure Cloud Service中获取项目的部署文件
    【Azure Redis 缓存】Azure Redis 异常
    【Azure 微服务】基于已经存在的虚拟网络(VNET)及子网创建新的Service Fabric并且为所有节点配置自定义DNS服务
    【Azure Redis 缓存】遇见Azure Redis不能创建成功的问题:至少一个资源部署操作失败,因为 Microsoft.Cache 资源提供程序未注册。
    【Azure Redis 缓存】如何得知Azure Redis服务有更新行为?
    【Azure API 管理】在 Azure API 管理中使用 OAuth 2.0 授权和 Azure AD 保护 Web API 后端,在请求中携带Token访问后报401的错误
  • 原文地址:https://www.cnblogs.com/elink/p/13747130.html
Copyright © 2011-2022 走看看