• JavaScript数组总结 Minoz


       

       一直都在拜膜各为大神的博客,总以为写博客是一件很简单的事情,结果今天想写一篇总结性的博客,就不知从何处下笔了。

    这才知道原来写博客也是技术活,写得不好处请多多指教,嘿嘿~~~~

       这几天一直都在看js数组,总结了以下内容:

     

      ECMAScript数组长度是可以动态调整的,并且数组里每一项可以保存任何类型数组,

      如:var arr = [1, 'str', [1, 2],  ,]; //数值,字符串,数组,undefined等。

     

      一.创建数组方式

     

     

           1.使用Array构造函数

              var colors = new Array();  

              var colors = new Array(20);  //预先保存数组长度

              var colors = Array();   //省略new

     

           2.数组字面量  (注:推荐使用)

             var colors = ['red', 'blue'];

             var name = [];

             var values = [1,2,];   //不推荐使用   IE8之前元素含有3项,主流浏览器元素含有2项

             var values = [,,,];   //不推荐使用   IE8之前元素含有4项,主流浏览器元素含有3项undefined

     

     二.数组操作

     

         1.增加数组元素

            var arr = [1, 3, 4, 6];

            arr[arr.length] = 'str';

            arr.push(4, 5);   //在尾部添加

            arr.unshift(9, 7);    //在头部添加

     

          2.删除数组元素

            delete arr[0];

            arr.length -= 1;

            b.pop(); //删除尾部

            b.shift(); //删除头部

     

          3.遍历数组

            1> for循环

                for(var i = 0, len = arr.length; i < len; i++) {

                    console.log(arr[i]);
                }

            2> for-in

                for(var i in arr) { 

                     console.log(arr[i]);
                }

            注:for-in在遍历数组顺序不定

             此方法有些不足,由于Array是对象,会继承原型上的属性,

             添加代码   Array.prototype.x = "inherit";

             再试试上述遍历方法,结果是  // 1 3 4 6 inherit

             为了避免上述情况,添加元素判断就ok啦!

             for(var i in arr) { 

                 if(arr.hasOwnProperty(i)) {
                 console.log(arr[i]);
                }
             }

     

      三.数组方法

     

          1.栈方法

             push()  //进栈        pop()  //出栈   上面代码已应用到此两种方法

     

          2.队列方法

             unshift()  //进队列       shift()   //出队列   上面代码已应用到此两种方法

     

          3.排序方法

             var b = [1, 2, 6, 8, 10, 9];

             1> reverse()   逆序   原数组值改变

                 b.reverse();   // [9, 10, 8, 6, 2, 1]

                但此方法不够灵活,因此,有了下面的方法

             2> sort()  升序         原数组值改变

                 sort()方法是调用每个数组的toString()转型方法,然后比较首字母得到字符串,例如:

                 var arr = [1, 6, 4, 30];

                 arr.sort();     //[1, 30, 4, 6]  30虽然小于4,6,但按字符串"30"则在"4"和"6"之前

     

                 var arr1 = ['db', 'cb', 'ca', 'ab'];

                 arr1.sort();    // ["ab", "ca", "cb", "db"]

     

                 由于不能将数值进行升序或降序操作,因此用sort()方法接受一个比较函数作为参数。例如:

                 var arr = [2, 6, 90, 4, 9, 10];

                 arr.sort(function(a, b) {   //升序
                      return a - b;
                 });
                 console.log(arr);  //[2, 4, 6, 9, 10, 90]

                

                 arr.sort(function(a, b) {   //升序
                     return b - a;
                 });
                 console.log(arr);  //[90, 10, 9, 6, 4, 2]

     

          4.操作方法

     

            1> concat()  原数组值不变

                 var arr = [2, 6, 90, 4, 9, 10];

                 arr.concat();   // [2, 6, 90, 4, 9, 10]   无参数,复制原数组

                 arr.concat(2,3);  // [2, 6, 90, 4, 9, 10, 2, 3]   有参数,将参数项添加至末尾

                 arr.concat([2,3]);  //[3, 4, 6, 7, 8, 2, 3]   参数为数组,则将数组中每一项添加至末尾

     

            2> slice() 原数组值不改变

                 var arr = [2, 6, 90, 4, 9, 10];     

                 arr.slice(2);   // [90, 4, 9, 10]    从索引值为2处至最后选取      

                 arr.slice(2, 4);  //[90, 4]  从索引值为2处至4选取,不包括结束位置的项

                 arr.slice(-4, -2);  //[90, 4]  参数为负数,则将负数加数组长度,即相当于slice(2, 4)

                 注: 结束位置小于起始位置,则返回空数组

     

           3> splice() 数组中最强大的方法     原数组值改变

                 删除:         

                 var arr = [3, 4, 6, 7, 8];
                 arr.splice(2,1);           //从索引为2处,删除1项
                 arr;      //[3, 4, 7, 8]

                 插入:

                 arr.splice(2,0,'g');      //从索引为2处,插入'g'

                 arr;     //[3, 4, "g", 6, 7, 8]

                 替换:

                 arr.splice(1,2,'a','b');  //从索引为1删除2项,并添加'a','b'   

                 arr;     //[3, "a", "b", 7, 8]

                 注:以下方法只用ECMAScript5支持

     

         5. 位置方法

             两个方法都接受两个参数1.查找项,2.查找起始处,并返回索引值。查找元素必须严格相等(即值和类型都相等)

     

             1> indexOf()   从数组开始处查找   原数组不改变

                 var arr = [1,2,3,4,1,2];

                 arr.indexOf(1);            //0

                 arr.indexOf(10);          //找不到返回-1

                 arr.indexOf(1, 2);        //4

                 arr.indexOf(2, -1);       //5

     

             2> lastIndexOf()   从数组末尾查找    原数组不改变

                arr.lastIndexOf(1);        //4

                arr.lastIndexOf(1, 2);    //0

                arr.lastIndexOf(2, -2);   //1

     

         6.迭代方法

           以下5个函数都接收两个参数,1.在每一项运行的函数  2.运行该函数的作用域对象(影响this值)

           其中,传入的函数有三个参数 1. 数组每一项项的值 2.索引值  3.数组对象本身

            var arr = [3, 5, 7, 9, 0];

     

           1> every()     数组中每一项满足给定函数,则返回true

                arr.every(function(item, index, array) {

                    return x === 3;     

                });           // false;

     

            2> some()     数组中任意一项满足给定函数,则返回true

                 arr.some(function(item, index, array) {

                    return x === 3;   

                });           //true

     

            3> filter()    对数组中每一项进行给定函数操作,将返回结果为true的项组成数组返回

                arr.filter(function(item, index, array) {

                    return index % 2 === 0;

                });           //[3, 7, 0]

     

            4> forEach()   对数组中每一项进行给定函数操作,没有返回值,相当于for循环

                arr.forEach(function(item, index, array){

                    return console.log(item);

                 });         // [3, 5, 7, 9, 0]

     

            5> map()   对数组中每一项进行给定函数操作,并将函数调用结果组成数组返回       

               console.log(arr.map(function(item, index, array){
                   return item + 1;
               }));         //[4, 6, 8, 10, 1]

     

            

         7.归并方法

            以下两种方法都是迭代数组的所有项,并接受两个参数1.每一项调用的函数 2.作为归并基础的初始值(可选)

            其中,每一项调用的函数支持4个参数,1.前一个值,2.当前值,3.项的索引,4.数组对象

            1> reduce()  从数组开始处迭代   不改变原数组

                 var arr = [1, 2, 3];

                 var sum = arr.reduce(function(prev, cur, index, array){
                      return prev + cur;
                 }, 0);
                 sum;     // 6

     

            2> reduceRight()  从数组末尾处迭代   不改变原数组

                 代码与上述相同,只不过换一个函数名啦!

     

       好了,第一篇博客完成了,肯定有很多不足,有什么不对的地方求指教,以后会多多努力的!走在热爱前端的路上。。。。。。

     

  • 相关阅读:
    gearman任务分发改进
    gearman实现任务分发
    BeanStalkd 做队列服务
    Tomcat各种日志的关系与catalina.out文件的分割
    数据库系统原理-关系数据库的规范化理论总结
    MySQL配置参数innodb_flush_log_at_trx_commit
    gRPC快速入门
    使用vagrant和kubeadm搭建k8s集群
    VS项目属性中的C/C++运行库:MT、MTd、MD、MDd
    消除C++中警告代码
  • 原文地址:https://www.cnblogs.com/nalixueblog/p/4366047.html
Copyright © 2020-2023  润新知