zoukankan      html  css  js  c++  java
  • js 数组常用功能小总结


    一、数组的基本使用方法
    1、数组的创建
    var arrayObj = [];
    var arrayObj = new Array(); //创建一个数组
    var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度
    var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); 创建一个数组并赋值
    要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规定长度以外的,注意:这时长度会随之改变。

    2、数组的元素的访问

    var testGetArrValue=arrayObj[1]; //获取数组的元素值
    arrayObj[1]= "这是新值"; //给数组元素赋予新的值
     
    a[-1.23]=true;//这将创建一个名为“-1.23”的属性
    a["1000"] = 0;这是数组覅1001个元素
    a[2.00]  //和a[2]相等

    数组遍历
    var obj = { title : '对象的标题', type : 'primitive' , releaseDate : new Date(2012,03,1) }; var keys = Object.keys(obj);keys//获取obj对象属性名组成的数组
    ["title", "type", "releaseDate"]

    第一种 for(var i=0,len =a.length;i<len;i++){
         if(!a[i])continue;//跳过null,undifined和不存在的元素

          if(a[i]=== undefined)continue;//跳过undifined和不存在的元素
     
          if(!(i in a))continue;//跳过不存在的元素
     
    }
     
    //循环每次将一个可枚举的属性名(包括数组索引)赋值给循环变量,不存在的索引将不会遍历到
    第二种 for(var index in array){
         var value = array[index];
    }
     
    3、数组元素的添加

    arrayObj. push([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组结尾,并返回数组新长度,如果插入的是多个元素,是一次性插入的,插入的元素顺序不会变化
    arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);// 将一个或多个新元素添加到数组开始,数组中的元素自动后移,返回数组新长度
    //shift 英文意思 移动
    var a= [1,2,3,4,5,6,7,8,9,10];var len=a.push(11,13);len
    12
    a
    [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 13]
    a.unshift(10,11)
    14
    a
    [10, 11, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 13]
    //splice 英文翻译 拼接 
    arrayObj.splice(insertPos,0,[item1[, item2[, . . . [,itemN]]]]);//将一个或多个新元素插入到数组的指定位置,插入位置的元素自动后移,返回""。
    a.splice(3,0,"a","b");a
    [10, 11, 1, "a", "b", 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 13]
    arrayObj.splice(deletePos,deleteCount,arraydata);如果deleteCount为0,代表插入元素,大于1插入同时删除
    var a= [1,2,3,4,5,6,7,8,9,10];a.splice(3,4,12,13);a
    [1, 2, 3, 12, 13, 8, 9, 10]
    注释:splic(3,4,12,13)中3代表从开始位置开始算的在0,1,2,即坐标a[3]前插入数据,4代表删a[3](包含a[3])后面的4个数据,12,13分别要插入的数据数据;
    var a= [1,2,3,4,5,6,7,8,9,10];a.splice(3);a
    [1, 2, 3]
    如果不指定删除的元素位置,默认全部删除;

    4、数组元素的删除

    arrayObj.pop(); //移除最后一个元素并返回该元素值
    arrayObj.shift(); //移除最前一个元素并返回该元素值,数组中元素自动前移
    arrayObj.splice(deletePos,deleteCount); //删除从指定位置deletePos开始的指定数量deleteCount的元素,数组形式返回所移除的元素

    5、数组的截取和合并

    arrayObj.slice(start, [end]); //以数组的形式返回数组的一部分,注意不包括 end 对应的元素,如果省略 end 将复制 start 之后的所有元素
    arrayObj.concat([item1[, item2[, . . . [,itemN]]]]); //将多个数组(也可以是字符串,或者是数组和字符串的混合)连接为一个数组,返回连接好的新的数组

    eg:
    var a= ["a","b",1,2,3,4,5,6,7,8,9,10];var b = a.slice(1);b
    ["b", 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
    var b= a.slice(1,4);b
    ["b", 1, 2]

    var a= [1,2,3,4,5,6,7,8,9,10];var b = a.concat(11,12);b;
    [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
    var a= [1,2,3,4,5,6,7,8,9,10];var b = a.concat(11,12);a;
    [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

    6、数组的拷贝

    arrayObj.slice(0); //返回数组的拷贝数组,注意是一个新的数组,不是指向
    arrayObj.concat(); //返回数组的拷贝数组,注意是一个新的数组,不是指向

    7、数组元素的排序

    arrayObj.reverse(); //反转元素(最前的排到最后、最后的排到最前),返回数组地址
    arrayObj.sort(); //对数组元素排序,返回数组地址

    var a= [1,2,3,6,5,4];var b = a.reverse();a
    [4, 5, 6, 3, 2, 1]
    var a= [1,2,3,6,5,4];var b = a.sort();a
    [1, 2, 3, 4, 5, 6]

    8、数组元素的字符串化

    arrayObj.join(separator); //返回字符串,这个字符串将数组的每一个元素值连接在一起,中间用 separator 隔开。
    toLocaleString 、toString 、valueOf:可以看作是join的特殊用法,不常用
    var a= [1,2,3,6,5,4];var b = a.join("");b
    "123654"
    var a= [1,2,3,6,5,4];var b = a.join(",");b
    "1,2,3,6,5,4"
    var a= [1,2,3,6,5,4];var b = a.join("-");b
    "1-2-3-6-5-4"
    var a= [1,2,3,6,5,4];var b = a.join("");b
    "123654"

    var a= [1,2,3,6,5,4];var b = a.toString();b
    "1,2,3,6,5,4"
    var a= [1,2,3,6,5,4];var b = a.valueOf();b
    [1, 2, 3, 6, 5, 4]
    var a= [1,2,3,6,5,4];var b = a.toLocaleString();b
    "1,2,3,6,5,4"



    二、数组对象的3个属性

    1、length 属性

        Length属性表示数组的长度,即其中元素的个数。因为数组的索引总是由0开始,所以一个数组的上下限分别是:0和length-1。和其他大多数语言不同的是,JavaScript数组的length属性是可变的,这一点需要特别注意。当length属性被设置得更大时,整个数组的状态事实上不会发生变化,仅仅是length属性变大;当length属性被设置得比原来小时,则原先数组中索引大于或等于length的元素的值全部被丢失。下面是演示改变length属性的例子:

        var arr=[12,23,5,3,25,98,76,54,56,76];

    //定义了一个包含10个数字的数组

    alert(arr.length); //显示数组的长度10
    arr.length=12; //增大数组的长度

    alert(arr.length); //显示数组的长度已经变为12


    alert(arr[8]); //显示第9个元素的值,为56

    arr.length=5; //将数组的长度减少到5,索引等于或超过5的元素被丢弃

    alert(arr[8]); //显示第9个元素已经变为"undefined"

    arr.length=10; //将数组长度恢复为10

    alert(arr[8]); //虽然长度被恢复为10,但第9个元素却无法收回,显示"undefined"

        由上面的代码我们可以清楚的看到length属性的性质。但length对象不仅可以显式的设置,它也有可能被隐式修改。JavaScript中可以使用一个未声明过的变量,同样,也可以使用一个未定义的数组元素(指索引超过或等于length的元素),这时,length属性的值将被设置为所使用元素索引的值加1。例如下面的代码:

    var arr=[12,23,5,3,25,98,76,54,56,76];

    alert(arr.length);

    arr[15]=34;

    alert(arr.length);

        代码中同样是先定义了一个包含10个数字的数组,通过alert语句可以看出其长度为10。随后使用了索引为15的元素,将其赋值为15,即arr[15]=34,这时再用alert语句输出数组的长度,得到的是16。无论如何,对于习惯于强类型编程的开发人员来说,这是一个很令人惊讶的特性。事实上,使用new Array()形式创建的数组,其初始长度就是为0,正是对其中未定义元素的操作,才使数组的长度发生变化。

        由上面的介绍可以看到,length属性是如此的神奇,利用它可以方便的增加或者减少数组的容量。因此对length属性的深入了解,有助于在开发过程中灵活运用。

    2、prototype 属性

    返回对象类型原型的引用。prototype 属性是 object 共有的。

    objectName.prototype

    objectName 参数是object对象的名称。

    说明:用 prototype 属性提供对象的类的一组基本功能。 对象的新实例“继承”赋予该对象原型的操作。

        对于数组对象,以以下例子说明prototype 属性的用途。

        给数组对象添加返回数组中最大元素值的方法。要完成这一点,声明一个函数,将它加入 Array.prototype, 并使用它。

    function array_max( )

    {

       var i, max = this[0];

       for (i = 1; i < this.length; i++)

       {

       if (max < this[i])

       max = this[i];

       }

       return max;

    }

    Array.prototype.max = array_max;

    var x = new Array(1, 2, 3, 4, 5, 6);

    var y = x.max( );

    该代码执行后,y 保存数组 x 中的最大值,或说 6
     

    判断这个对象是否是数组类型:
    var isArray = Function.isArray || function(o){ 
    return typeof o === "object" && Object.prototype.toString.call(o) ==="[object Array]"; 
    };
    x =[];
    var t = isArray(x);
    t
    true
     
     
    数组深度克隆
    var a =[],b=[];
    a[0]={name:'w',text:2};
    a[1]={name:'a',text:3};
    a[2]={name:'b',text:4};
    b =a.cloneArray();
    function objClone(myObj){
        if(typeof(myObj) != 'object') return myObj;
        if(myObj == null) return myObj;
        var myNewObj = new Object();
        for(var i in myObj)
        myNewObj[i] = objClone(myObj[i]);
        return myNewObj;
    }
      Array.prototype.cloneArray=function(){//为数组添加克隆自身方法,使用递归可用于多级数组
        var newArr=new Array();
        for(var i=0;i<=this.length-1;i++)
        {
           var itemi=this[i];
           if(itemi.length && itemi.push) itemi= itemi.cloneArray();//数组对象,进行递归
           else if(typeof(itemi)=="object") itemi=objClone(itemi);//非数组对象,用上面的objClone方法克隆
           newArr.push(itemi);
        }
        return newArr;
      }
  • 相关阅读:
    vue 把后端返回的图片和url链接生成的二维码用canvas 合成一张图片
    Dart和JavaScript对比小结
    webgl学习,知识储备
    nightwatch+selenium做e2e自动化测试采坑小计
    linux centos7 环境变量设置
    ES6学习笔记
    SQLserver数据库还原语句
    AngularJs的那些坑(持续更新...)
    Hosting socket.io WebSocket apps in IIS using iisnode
    mongodb 数据库操作--备份 还原 导出 导入
  • 原文地址:https://www.cnblogs.com/liwei45212/p/3042697.html
Copyright © 2011-2022 走看看