码迷，mamicode.com
首页 > 编程语言 > 详细

javas入门04——数组的创建及方法

时间：2019-12-02 00:59:03      阅读：84      评论：0      收藏：0      [点我收藏+]

标签：哪些   如何   副本   实现类   遇到   迭代   有一个   demo1   unshift   

数组的概念及定义

数组的概念：
        一组数据，数据的组和
        哪些数据的组和，只要是数据（所有数据），就可以放在数组中
数组的意义：
        可以同时操作多个数据

 数组的创建方式

  var arr1 = [1,2,3];           //字面量方式
    var arr2 = new Array(1,2,3)   //构造函数方式

    注意：当只有一个数据时，两种创建方式的不同。

    var arr1 = [5]             //表示有一个数组元素5
    var arr2 = new Array(5)    //表示有5个数组元素，值全部为undefined

 数组的操作-索引

索引操作：
        增：给并不存在的索引，赋值
        arr[5] = 1;
        console.log(arr[5]);
        console.log(arr)
        删
        console.log(arr.length)
        arr.length = 1;
        console.log(arr)
        改
        console.log(arr[0]);
        arr[0] = "hahahah";
        console.log(arr)
        查：数组的遍历
        console.log(arr[0])
        for(var i=0;i<arr.length;i++){
            console.log(arr[i])
        }

数组的操作-方法

        增
        在末尾添加元素               arr.push
        arr.push("gg");
        console.log(arr)
        var c = arr.push("gg")          //返回值是所增值的位置
        console.log(c)
        在开始添加元素               arr.unshift
         var a = arr.unshift("mm");
        console.log(a)
        删
        在末尾删除最后一位           arr.pop
        arr.pop()
        console.log(arr)
        删除第一个                   arr.shift
        arr.shift()
        console.log(arr)
        
        替换
        从第n个项目开始删除，一共删除m个，再删除的位置加入a.....     arr.splice（n,m,a...）
        console.log(arr)
        arr.splice(1,2,"pop","mmp")      从第二个数开始，删除两个（第二个和第三个）加入两个
        var b = arr.splice(1,2,"pop","mmp")          //返回被删除/替换的元素。
        console.log(b)
        console.log(arr)            

        截取
        返回一个新数组，从下标n的位置取到m"前一个"             arr.slice(n,m)
        arr.slice(2,4);
        console.log(arr);      // 不改变原数组
        var a = arr.slice(2,4);     截取第三到第四个，不包括第五个
        console.log(a)
　　　　　补充：可从已有的数组中返回选定的元素。
        该方法接收两个参数slice(start,end)，strat为必选，表示从第几位开始；
        end为可选，表示到第几位结束(不包含end位)，省略表示到最后一位；
        start和end都可以为负数，负数时表示从最后一位开始算起，如-1表示最后一位
        var arr = ["Tom","Jack","Lucy","Lily","May"];
        console.log(arr.slice(1,3));        //["Jack","Lucy"]       //返回值是截取的数组
        console.log(arr.slice(1));          //["Jack","Lucy","Lily","May"]
        console.log(arr.slice(-4,-1));      //["Jack","Lucy","Lily"]
        console.log(arr.slice(-2));         //["Lily","May"]
        console.log(arr.slice(1,-2));       //["Jack","Lucy"]
        console.log(arr);                   //["Tom","Jack","Lucy","Lily","May"]---原数组未改变

        排序
        var arr2 = [11,3,25,35,67]
        arr2.sort()
        console.log(arr2)       //按照字符方式排序
        arr2.sort(function(a,b){
            return a-b
        })
        var a = arr2.sort(function(a,b){
            return a-b
        })
        console.log(a)
        console.log(arr2)        //按照数字排序需要函数

        toString();
        转换成字符串，类似于没有参数的join()。
        该方法会在数据发生隐式类型转换时被自动调用，如果手动调用，就是直接转为字符串。
        var arr = [1,2,3];
        console.log(arr.toString());     //1,2,3
        console.log(arr);                //[1,2,3]---原数组未改变
    
concat()
        用于连接两个或多个数组，该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
        var arr1 = [1,2,3]
        var arr2 = arr1.concat();
        console.log(arr1);           //[1,2,3]---原数组
        console.log(arr1 === arr2);  //false
        console.log(arr2);           //[1,2,3]---原数组的副本

        console.log(arr1.concat("hello","world"));           //[1,2,3,"hello","world"]
        console.log(arr1.concat(["a","b"],[[3,4],{"name":"admin"}]));   //[1,2,3,"a","b",[3,4],{"name":"admin"}]
        // data为数组时，将data合并到原数组；data为具体数据时直接添加到原数组尾部；省略时创建原数组的副本。

        console.log(arr1);           //[1,2,3]---原数组未改变
join()
        根据指定分隔符将数组中的所有元素放入一个字符串，并返回这个字符串。
        参数：join(str);参数可选，默认为","号，以传入的字符作为分隔符。
        var arr = [1,2,3];
        console.log(arr.join());         //1,2,3
        var a = arr.join();
        console.log(a);                 //1,2,3     返回值是这个字符串
        console.log(arr.join("&"))
        console.log(arr.join("-"));      //1-2-3
        console.log(arr);                //[1,2,3]---原数组未改变
reverse()
        颠倒数组中元素的顺序
        var arr = [1,2,3];
        console.log(arr.reverse());     //[3,2,1]
        console.log(arr);               //[3,2,1]---原数组改变
        var a = arr.reverse();
        console.log(a)                  //返回值是改变后的数组
valueOf()
        返回数组的原始值（一般情况下其实就是"数组自身"），一般由js在后台调用，并不显式的出现在代码中
        var arr = [1,2,3];
        console.log(arr.valueOf());         //[1,2,3]
        console.log(arr);                   //[1,2,3]
        //为了证明返回的是数组自身
        console.log(arr.valueOf() == arr);  //true
indexOf()
        根据指定的数据，从左向右，查询在数组中出现的位置，如果不存在指定的数据，返回-1。
        该方法是查询方法，"""不会对数组产生改变"""。
        indexOf(value, start);value为要查询的数据；start为可选，表示开始查询的位置，
        当start为负数时，从数组的尾部向前数；如果查询不到value的存在，则方法返回-1
        var arr = ["h","e","l","l","o"];
        console.log(arr.indexOf("l"));        //2
        console.log(arr.indexOf("l",3));      //3
        console.log(arr.indexOf("l",4));      //-1
        console.log(arr.indexOf("l",-1));     //-1
        console.log(arr.indexOf("l",-3));     //2
lastIndexOf()
        根据指定的数据，从右向左，查询在数组中出现的位置，如果不存在指定的数据，返回-1。
        该方法是查询方法，不会对数组产生改变。
        lastIndexOf(value, start);value为要查询的数据；start为可选，表示开始查询的位置，
        当start为负数时，从数组的尾部向前数；如果查询不到value的存在，则方法返回-1
        var arr = ["h","e","l","l","o"];
        console.log(arr.lastIndexOf("l"));        //3
        console.log(arr.lastIndexOf("l",3));      //3
        console.log(arr.lastIndexOf("l",1));      //-1
        console.log(arr.lastIndexOf("l",-3));     //2
        console.log(arr.lastIndexOf("l",-4));     //-1
forEach()
        ES5新增方法，用来遍历数组，该方法没有返回值。
        forEach接收的回调函数会根据数组的每一项执行，该回调函数默认有三个参数，
        分别为：遍历到的数组的数据，对应的索引，数组自身。
        forEach(callback);callback默认有三个参数，分别为value，index，self。
        var arr = ["Tom","Jack","Lucy","Lily","May"];
        var a = arr.forEach(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr === self));
        })
        // 打印结果为：
        // Tom--0--true
        // Jack--1--true
        // Lucy--2--true
        // Lily--3--true
        // May--4--true
        console.log(a);     //undefined---forEach没有返回值
        //该方法为遍历方法，不会修改原数组
16.map()
        同forEach功能；2.map的回调函数会将执行结果返回，最后map将所有回调函数的返回值组成新数组返回。
        map(callback);callback默认有三个参数，分别为value，index，self。
        功能1：同forEach
        var arr = ["Tom","Jack","Lucy","Lily","May"];
        var a = arr.map(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr === self))
        })
        // 打印结果为：
        // Tom--0--true
        // Jack--1--true
        // Lucy--2--true
        // Lily--3--true
        // May--4--true

        //功能2：每次回调函数的返回值被map组成新数组返回
        var arr = ["Tom","Jack","Lucy","Lily","May"];
        var a = arr.map(function(value,index,self){
            return "hi:"+value;
        })
        console.log(a);     //["hi:Tom", "hi:Jack", "hi:Lucy", "hi:Lily", "hi:May"]
        console.log(arr);   //["Tom", "Jack", "Lucy", "Lily", "May"]---原数组未改变
filter()
        1.同forEach功能；2.filter的回调函数需要返回布尔值，当为true时，
        将本次数组的数据返回给filter，最后filter将所有回调函数的返回值组成新数组返回（此功能可理解为“过滤”）。
        filter(callback);callback默认有三个参数，分别为value，index，self。
          功能1：同forEach
        var arr = ["Tom","Jack","Lucy","Lily","May"];
        var a = arr.filter(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr === self))
        })
        // 打印结果为：
        // Tom--0--true
        // Jack--1--true
        // Lucy--2--true
        // Lily--3--true
        // May--4--true

        //功能2：当回调函数的返回值为true时，本次的数组值返回给filter，被filter组成新数组返回
        var arr = ["Tom","Jack","Lucy","Lily","May"];
        var a = arr.filter(function(value,index,self){
            return value.length > 3;
        })
        console.log(a);         //["Jack", "Lucy", "Lily"]
        console.log(arr);       //["Tom", "Jack", "Lucy", "Lily", "May"]---原数组未改变
every()
        判断数组中每一项是否都满足条件，只有所有项都满足条件，才会返回true。
        every()接收一个回调函数作为参数，这个回调函数需要有返回值，every(callback);
        callback默认有三个参数，分别为value，index，self
        当回调函数的返回值为true时，类似于forEach的功能，遍历所有；
        如果为false，那么停止执行，后面的数据不再遍历，停在第一个返回false的位置。
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.every(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr == self))
        })
        打印结果为：
        Tom--0--true
        因为回调函数中没有return true，默认返回undefined，等同于返回false

        demo2:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.every(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr == self))
            return value.length < 4;
        })
        打印结果为：
        Tom--0--true
        abc--1--true
        Jack--2--true
        因为当遍历到Jack时，回调函数到return返回false，此时Jack已经遍历，但是后面数据就不再被遍历了

         demo3:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.every(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr == self))
            return true;
        })
        // 打印结果为：
        // Tom--0--true
        // abc--1--true
        // Jack--2--true
        // Lucy--3--true
        // Lily--4--true
        // May--5--true
        //因为每个回调函数的返回值都是true，那么会遍历数组所有数据，等同于forEach功能

        功能2：当每个回调函数的返回值都为true时，every的返回值为true，只要有一个回调函数的返回值为false，every的返回值都为false

         demo1:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.every(function(value,index,self){
            return value.length > 3;
        })
        console.log(a);           //false

        //demo2:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.every(function(value,index,self){
            return value.length > 2;
        })
        console.log(a);           //true
 some()
        功能：判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。
        参数：some()接收一个回调函数作为参数，这个回调函数需要有返回值，some(callback);
        callback默认有三个参数，分别为value，index，self。

        功能1：因为要判断数组中的每一项，只要有一个回调函数返回true，some都会返回true，所以与every正好相反，当遇到一个回调函数的返回值为true时，可以确定结果，
　　　　　　那么停止执行，后面都数据不再遍历，停在第一个返回true的位置；当回调函数的返回值为false时，需要继续向后执行，到最后才能确定结果，所以会遍历所有数据，实现类似于forEach的功能，遍历所有。

         demo1:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.some(function(value,index,self){
            console.log(value + "--" + index + "--" + (arr == self))
            return value.length > 3;
        })
        // 打印结果为：
        // Tom--0--true
        // abc--1--true
        // Jack--2--true

        功能2：与every相反，只要有一个回调函数的返回值都为true，some的返回值为true，所有回调函数的返回值为false，some的返回值才为false
        demo1:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.some(function(value,index,self){
            return value.length > 3;
        })
        console.log(a);             //true

        //demo2:
        var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
        var a = arr.some(function(value,index,self){
            return value.length > 4;
        })
        console.log(a);             //false
reduce()
        功能：从数组的第一项开始，逐个遍历到最后，迭代数组的所有项，然后构建一个最终返回的值。

        参数：reduce()接收一个或两个参数：第一个是回调函数，表示在数组的每一项上调用的函数；
        第二个参数（可选的）作为归并的初始值，被回调函数第一次执行时的第一个参数接收。
        reduce(callback,initial);callback默认有四个参数，分别为prev，now，index，self。
        callback返回的任何值都会作为下一次执行的第一个参数。
        如果initial参数被省略，那么第一次迭代发生在数组的第二项上，因此callback的第一个参数是数组的第一项，第二个参数就是数组的第二项。
         demo1:不省略initial参数，回调函数没有返回值
    var arr = [10,20,30,40,50];
    arr.reduce(function(prev,now,index,self){
        console.log(prev + "--" + now + "--" + index + "--" + (arr == self))
    }, 2019)
    // 打印结果为：
    // 2019--10--0--true
    // undefined--20--1--true
    // undefined--30--2--true
    // undefined--40--3--true
    // undefined--50--4--true
    // 此时回调函数没有return，所以从第二次开始，prev拿到的是undefined

    //demo2:省略initial参数，回调函数没有返回值
    var arr = [10,20,30,40,50];
    arr.reduce(function(prev,now,index,self){
        console.log(prev + "--" + now + "--" + index + "--" + (arr == self))
    })
    打印结果为：第一次，回调函数的第一个参数是数组的第一项。第二个参数就是数组的第二项
    10--20--1--true
    undefined--30--2--true
    undefined--40--3--true
    undefined--50--4--true
    此时回调函数没有return，所以从第二次开始，prev拿到的是undefined

    demo3:不省略initial参数，回调函数有返回值
    var arr = [10,20,30,40,50];
    arr.reduce(function(prev,now,index,self){
        console.log(prev + "--" + now + "--" + index + "--" + (arr == self));
        return "hello";
    }, 2019)
    打印结果为：
    2019--10--0--true
    hello--20--1--true
    hello--30--2--true
    hello--40--3--true
    hello--50--4--true
    此时回调函数有return，所以从第二次开始，prev拿到的是回调函数return的值

    demo4:省略initial参数，回调函数有返回值
    var arr = [10,20,30,40,50];
    arr.reduce(function(prev,now,index,self){
        console.log(prev + "--" + now + "--" + index + "--" + (arr == self));
        return "hello";
    })
    // 打印结果为：第一次，回调函数的第一个参数是数组的第一项。第二个参数就是数组的第二项
    // 10--20--1--true
    // hello--30--2--true
    // hello--40--3--true
    // hello--50--4--true
    // 此时回调函数有return，所以从第二次开始，prev拿到的是回调函数return的值

    //demo5：使用reduce计算数组中所有数据的和
    var arr = [10,20,30,40,50];
    var sum = arr.reduce(function(prev,now,index,self){
        return prev + now;
    })
    console.log(sum);      //150
    // 回调函数的最后一次return的结果被返回到reduce方法的身上

    //demo6：使用reduce计算数组中所有数据的和
    var arr = [10,20,30,40,50];
    var sum = arr.reduce(function(prev,now,index,self){
        return prev + now;
    }, 8)
    console.log(sum);      //158
    // 回调函数的最后一次return的结果被返回到reduce方法的身上
    // 因为reduce有第二个参数initial，在第一次执行时被计算，所以最终结果被加上8
reduceRight()
    功能：（与reduce类似）从数组的最后一项开始，向前逐个遍历到第一位，迭代数组的所有项，然后构建一个最终返回的值。
    参数：同reduce。
    demo：同reduce
是否改变原数组
    pop,shift; push,unshift; reverse; sort; splice—— yes。
 
功能方法没有必要关注返回值，但是功能方法可以有返回值

 数组的遍历(获取数组中的每个元素)

 数组元素的获取：
       索引，数组元素的下标，表示数组元素在数组中的顺序，从0开始，到arr.length-1
 
    利用循环，配合索引

整数数组／字符串数组／对象数组／二维数组

     整数数组：arr = [1,2,3,4,5,6,7]
        数组的元素为整数

    字符串数组：arr = ["h","e","l","l","o”]
        数组的元素为字符串

    json对象数组：arr = [{name:"Lisa"},{name:"Jack"},{name:"Loss"}]
        数组的元素为对象
        如何获取对象数组内的元素：arr[1].name;    //Jack

    二维数组：arr = [[1,"a",3],["hello",6,8],["color","width"]]
        数组的元素为数组
        如何获取而为数组内的元素：arr[2][1];      //width

 

 

 

javas入门04——数组的创建及方法

标签：哪些   如何   副本   实现类   遇到   迭代   有一个   demo1   unshift   

原文地址：https://www.cnblogs.com/wuziqiang/p/11968404.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！