请选择 进入手机版 | 继续访问电脑版
查看: 69|回复: 0

JavaScript之对象Array

[复制链接]
  • TA的每日心情
    开心
    前天 19:06
  • 签到天数: 1469 天

    [LV.10]以坛为家III

    1177

    主题

    3082

    帖子

    9万

    积分

    管理员

    IBC编程社区-原道楠

    Rank: 9Rank: 9Rank: 9

    积分
    94058

    推广达人突出贡献优秀版主荣誉管理论坛元老

    发表于 2019-8-17 13:56:39 | 显示全部楼层 |阅读模式

    马上加入IBC,查看更多教程

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
      数组Array是JavaScript中最常用的类型之一,同一数组中可以保存任意类型的数据,并且它的长度是动态的,会随着数组中数据的加减自动变化。每个数组都有一个表示其长度(数组元素的个数)的length属性。并且数组元素的索引(下标)是从0开始的,所以数组最后一个元素的索引永远等于length – 1;

    一     创建数组
             1,使用new关键字创建
    1. 1 var arr = new Array();
    复制代码
          可以向Array构造函数传递参数以实现创建包含特定数据的数组,多个参数使用逗号隔开。
      需要注意的是:当参数只有一个数字时,构造函数创建的不是包含该数字的字符串,而是一个长度为该数字的空数组,即arr.length = 数字。
             2,使用字面量形式创建
    1. 1 var arr = [1,2,3];
    复制代码
          数组元素被包含在一对“[]”中括号内,数组的每个元素之间用逗号隔开,最后一个元素背面不需要逗号。
      别的,上面已经讲过,数组的长度是动态的,它体现在可以手动的修改其length的值,以到达删除或增加数组长度的目的。
    1. 1 var arr = [1,2,3];2 console.log(arr.length);//33 arr.length = 2;4 console.log(arr.length);//25 console.log(arr);//[1,2]6 arr.length = 3;7 console.log(arr.length);//38 console.log(arr);//[1,2,empty ]
    复制代码
      3,数组元素的访问
             我们使用中括号[]加数字的形式访问数组元素。      
    1. 1 var arr = [1,2,3];2 console.log(arr[0]);//1
    复制代码
            通过这种方式我们也可以动态的修改某一位置的值,或向某一位置插入一个新值。   
    1. 1 var arr = [1,2,3];2 arr[0] = 4;3 console.log(arr);//[4,2,3]4 arr[4] = 0;5 console.log(arr);//[4,2,3,[i]empty[/i],0];
    复制代码
           可以看到,原本arr的长度是3,但我们向下标4的位置插入了一个新值,于是数组的长度变成了5,由于下标为3的位子原来并没有值,并且我们也没有新插入,所以JavaScript自动向该位置添加了一个空值占位符。
    二     数组的遍历
             1,普通for循环    
    1. 1 var arr = [1,2,3];2 for(var i = 0,len = arr.length;i < len;i++){3     console.log(arr[i]);4     //some code;5 }   
    复制代码
          服从最高的遍历数组方式。
       2,forEach   
    1. 1 var arr= [1,2,3];2 arr.forEach(function (item, index, array) {3     console.log(index + ":" + item + ":" + array);4 });5 /*6 0:1:[1,2,3]7 1:2:[1,2,3]8 2:3:[1,2,3]9 */
    复制代码
      函数接受3个参数,第一个是当前处理元素的值,第二个是当前处理元素的下标,第三个是当前遍历的数组,第二三个参数是可选的。
             3,map   
    1. 1 var arr = [1,2,3];2 var newArr = arr.map(function (item, index, array) {3     return item * item;4 }5 console.log(newArr);//[1,4,9]
    复制代码
           函数的参数和forEach方法一致。它会把函数作用到每个遍历到的数组元素上,并返回一个新值,最终得到一个新数组并返回。
       4,for…in  
    1. 1 var arr = [1,2,3];2 for(var index in arr){3     console.log(index + ":" + arr[index]);4 }5 /*6 0:17 1:28 2:39 */
    复制代码
          for...in更适合遍历对象,而不是数组,而且使用它遍历数组的服从并不高。
      5,for…of
    1. 1 var arr = [1,2,3];2 for(var item of arr){3     console.log(item);4 }5 //16 //27 //3
    复制代码
      for...of是ES6的新方法,用它遍历数组比for...in稍快一点。
    三   数组常用方法
      1,  toString(),valueOf()和join()
      数组调用toString()和valueOf()一般返回由逗号隔开的所有数组元素组成字符串。 
    1. 1 var arr = [“hello”,”world”];2 console.log(arr.toString());//”hello,world”3 console.log(arr.valueOf());//”hello,world”
    复制代码
      join()方法和他们不同,它可以接受一个字符串作为参数,用这个字符串作为分隔符。
    1. 1 var arr = [”hello”,”world”];2 console.log(arr.join());//”hello,join”3 console.log(arr.join(“”));//”helloworld”4 console.log(arr.join(“&&”));//”hello&&world”
    复制代码
      2,  push()和pop(),unshift()和shift()
      push()接受任意个参数,依次添加到数组的末尾,返回修改后数组的长度。
      pop()从数组末尾删除一项,返回被删除的元素。
      unshift()从数组开头插入任意个元素,返回插入后数组的长度。
      shift()从数组开头删除一个元素,返回被删除的元素。
    1. 1 var colors = ["red","blue","pink","white"];2 colors.push("black");//53 console.log(colors);//["red","blue","pink","white","black"]4 colors.pop();//"black"5 console.log(colors);//["red","blue","pink","white"]6 colors.unshift("green");//57 console.log(colors);//["green","red","blue","pink","white"]8 colors.shift();//"green"9 console.log(colors);//["red","blue","pink","white"]
    复制代码
      3,  reverse()和sort()
      reverse()会翻转数组元素的顺序。
    1. 1 var arr = [1,2,3];2 arr.reverse();3 console.log(arr);//[3,2,1]
    复制代码
      sort()默认根据数组元素的字符编码排序。可以接受一个函数作为参数,该函数接受两个参数,如果第一个参数应该在第二个之后,那么返回一个正数,如果第一个和第二个位置不变,则返回0,如果第一个应该在第二个之前,那么返回一个负数。
    1. 1 var colors = ["red","blue","pink","white"]; 2 colors.sort(function(val1,val2){ 3     if(val1 < val2){ 4         return -1; 5     }else if(val1 == val2){ 6         return 0; 7     }else{ 8         return 1; 9     }10 });11 console.log(colors);["blue","pink","red","white"]
    复制代码
      如果想实现倒序排列,可以设置当val1小于val2时返回1,最后返回-1;如果比较的是数字,可简写为:
    1. 1 var arr = [3,51,55,23,-1,-50,0.2];2 arr.sort(function(val1,val2){3     return val1 - val2;4 });5 console.log(arr);//[-50, -1, 0.2, 3, 23, 51, 55]
    复制代码
      如果想实现倒序排列,则return val2 - val1 即可;
      sort()方法在接受到函数作为参数后,会把数组的每一个值依次当做函数的参数传给它,第一次是arr[0]和arr[1],比较完后会把排在背面的那个值作为函数的第一个参数,arr[2]作为第二个参数再传给函数,依次类推,直到最后一个数组元素。
      4,  concat()
      接受一个或多个数组作为参数,把这些参数数组与原数组连接,形成一个新数组并返回。如果不是数组,也会被简单的连接到一起形成新数组。
    1. 1 var arr = [1,2,3];2 var otherArr = ["hello","world"];3 console.log(arr.concat(otherArr));//[1,2,3,"hello","world"]
    复制代码
      5,  slice()
      接受两个数字作为参数,返回数组下标在他们之间的元素(不包含下标为第二参数的元素)组成的新数组,该方法不会改变原数组。
    1. 1 var arr = [1,2,3,4,5];2 var newArr = arr.slice(0,4);3 console.log(newArr);//[1,2,3,4]
    复制代码
      6,  splice()
      该方法功能强大,有以下三种使用方法:
        A:删除
               接受两个数字参数,第一个表示需要被删除的第一项的下标,第二个表示续保被删除的元素个数。
        B:插入
               接受3个或多个参数,第一个是插入元素的起始位置,第二个是0,表示不删除原数组的任何元素,第三个是要被插入的元素,如果有多个元素需要被插入,可以继承在背面添加其他参数。
        C:更换
               接受3个或多个参数,第一个是要被更换的元素的起始位置,第二个是需要被更换的元素个数,其他的的参数是更换的内容。如果想保持原数组长度不变,则更换内容的个数必须和第二个参数相等。
    1. var arr = [1,2,3,4,5];arr.splice(0,3);//从第一个元素开始删除3个元素console.log(arr);//[4,5]arr.splice(0,0,1,2,3);//从第一个元素开始删除0个,并添加1,2,3这3个元素console.log(arr);[1,2,3,4,5]arr.splice(2,2,5,5);//从第三个元素开始删除2个,并在该位置添加两个5,从结果看就像是用5更换了原数组中的3和4console.log(arr);//[1,2,5,5,5]
    复制代码

      数组还有很多有用的方法,这里只列举了比较常用的一些方法,了解详细请移步MDN的标准内置对象Array;




    来源:https://www.cnblogs.com/ruhaoren/archive/2019/08/17/11368205.html
    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则