Javascript Array对象详解

一、数组的定义

1.1、一维数组

方法1:

    var myCars = new Array();        
    myCars[0] = "Benz";
    myCars[1] = "BMW";
    myCars[2] = "Saab";

方法2:

定义和初始化一起:

    var myCars = new Array("Benz","BMW","Saab");

    或者另一种写法:

    var myCars = ["Benz","BMW","Saab"]; //推荐         

1.2、二维数组

方法1、

    var arr = new Array(['a','b'],['c','d']);

    arr[0]返回第一个一维数组,arr[0][0]返回第一个一维数组的第一个元素'a'

方法2、

      var arr = new Array();
      for(var i=0;i<10;i++){
          arr[i] = new Array(i);
      }    

二、常用属性和方法详解

length
设置或返回数组中元素的数目

注意:设置length属性可改变数组的大小。如果设置的值比当前值小,数组将被截断。其尾部的元素即将丢失。如果设置的值比它当前值大,新的元素被添加到数组尾部,它们的值为undefined。所以length不一定代表数组元素的个数。

    var arr = new Array("John","Andy","Wendy");

    console.log(arr);// ["John","Andy","Wendy"]
    console.log(arr.length);// 3

    arr.length = 2;

    console.log(arr);// ["John","Andy"]
    console.log(arr.length);// 2

    arr.length = 5;

    console.log(arr);// ["John","Andy","undefined","undefined","undefined"]
    console.log(arr.length);// 5  

concat()
concat()方法用于连接两个或多个数组。该方法不会改变现有的数组,仅仅返回被连接数组的一个副本。

arrayObject.concat(array1,array2,…,arrayn);

注意:参数是必须的。可以是具体的值,也可以是数组对象,可以任意多个。结果返回一个新的数组

    var a = [1,2,3];

    var b = a.concat(4,5);

    var c = a.concat(4,5,[6,7],8,"9");  

    console.log(a);// [1,2,3]
    console.log(b);// [1,2,3,4,5]
    console.log(c);// [1,2,3,4,5,6,7,8,"9"]

join()
join()方法用于把数组的所有元素放入一个字符串,元素通过指定的分隔符进行分隔。

arrayObject.join(separator)

注意:参数代表分隔符,是可选的,默认是半角逗号。返回值是字符串不是数组。

    var arr = new Array("John","Andy","Wendy");

    console.log(arr);// ["John","Andy","Wendy"]
    console.log(arr.join());// "John,Andy,Wendy"
    console.log(arr.join(" & "));//"John & Andy & Wendy"  

现代的主流浏览器,都对+运算符做了很好的优化,所以建议使用+运算符代替join()方法,参考 array join vs string connect

pop()
pop()方法用于删除并返回数组的最后一个元素。

注意:pop()方法将改变数组(删除数组的最后一个元素,把数组长度减1),并返回删除的元素值。如果数组已经为空,则pop()不改变数组,并返回undefined。

    var arr = new Array("John","Andy","Wendy");

    console.log(arr);// ["John","Andy","Wendy"]
    console.log(arr.pop());// "Wendy"
    console.log(arr);// ["John","Andy"]
    console.log(arr.pop());// "Andy"
    console.log(arr);// ["John"]
    console.log(arr.pop());// "John"
    console.log(arr);// []
    console.log(arr.pop());// undefined
    console.log(arr);// []          

push()
push()方法可以向数组的末尾添加一个或多个元素,并返回新的长度,也就是添加元素后数组的长度。

arrayObject.push(element1,element2,…,elementn);

注意:push()方法至少需要一个参数。push()方法可把它的参数按顺序添加到arrayObject的尾部。它直接修改arrayObject,而不是创建一个新的数组。push()方法和pop()方法使用数组提供的后进先出栈的功能。push()方法中额参数不管是什么类型(数组、对象),参数将会被作为一个整体插入到arrayObject的尾部,不做拆分。

    var a = ["a","b"];
    var b = {name : "Sem"};
    var c = [1,2,3];

    console.log(a);// ["a","b"]
    console.log(a.push(b));// 3
    console.log(a);    // ["a","b",[object Object]{ name : "Sem"}]
    console.log(a.push(c));// 4
    console.log(a);// ["a", "b", [object Object] { name: "Tom"}, [1, 2, 3]]  

reverse()
reverse() 方法用于颠倒数组中元素的顺序。

注意:该方法会改变原来的数组,而不会创建新的数组。reverse()并非效率最高的数组倒序排列方法,如果你对效率要求更高,可以参考JS: Array.reverse() vs. for and while loops

    var a = ["a","b","c"];
    var b = ["你","我","他"];

    console.log(a.reverse());  //["c", "b", "a"]
    console.log(b.reverse());  //["他", "我", "你"]

shift()
shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

注意:如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值。请注意,该方法不创建新数组,而是直接修改原有的数组。shift() 方法通常比 pop() 方法要慢很多。

     var arr = ["George", "John", "Thomas"];

    console.log(arr);          // ["George", "John", "Thomas"]
    console.log(arr.shift());  // "George"
    console.log(arr);          // ["John", "Thomas"]
    console.log(arr.shift());  // "John"
    console.log(arr);          // ["Thomas"]
    console.log(arr.shift());  // "Thomas"
    console.log(arr);          // []
    console.log(arr.shift());  // undefined  

slice()
slice() 方法可从已有的数组中返回选定的元素。

arrayObject.slice(start, end)

注意:
参数start是必需的,规定从何处开始选取,如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。

参数end是可选的,规定从何处结束选取,该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

该方法并不会修改数组,方法会返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。

slice()和splice()的区别:slice意思是切片,即把数组切出来一段;splice意思是绞接,就像我们平时接两根绳子一样,需要把原来的绳子切下来一段,然后再和新绳子接在一起。如果想删除数组中的一段元素,并向数组添加新元素,应该使用方法 Array.splice()。

在使用slice()时,如果参数start超过了数组的起点,则会从数组头部开始;如果参数end超过了数组的结尾,则会从数组的尾部结束;如果start和end中的范围不在数组中,或者end小于start,则会返回空数组;如果start和end不为数字,则会进行转换,转换失败的话,start默认为0,end默认为0。

    var arr = ["George", "John", "Thomas", "James", "Adrew", "Martin"];

    console.log(arr); // ["George", "John", "Thomas", "James", "Adrew", "Martin"]
    console.log(arr.slice(2,4));      // ["Thomas", "James"]
    console.log(arr.slice(-3,4));     // ["James"]
    console.log(arr.slice(-10,4));    // ["George", "John", "Thomas", "James"]
    console.log(arr.slice(-10,-4));   // ["George", "John"]
    console.log(arr.slice(4,3));      // []
    console.log(arr.slice(-20,-10));  // []
    console.log(arr.slice("2","4"));  // ["Thomas", "James"]
    console.log(arr.slice("a","4"));  // ["George", "John", "Thomas", "James"]
    console.log(arr.slice("a","b"));  // []
    console.log(arr.slice("2a","4a"));// []
    console.log(arr.slice("",""));    // []  

sort()
sort() 方法用于对数组的元素进行排序(从小到大)。

arrayObject.sort(sortby)

注意:
数组在原数组上进行排序,不生成副本。参数sortby是可选的,是自定义的函数,规定排序方法。

如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:

  • 若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
  • 若 a 等于 b,则返回 0。
  • 若 a 大于 b,则返回一个大于 0 的值。

      var arr = ["10", "5", "40", "25", "1000", "1"];
    
      function sortNumber(a,b){
            return a - b;
      }
    
      console.log(arr);  // ["10", "5", "40", "25", "1000", "1"]
      console.log(arr.sort());  // ["1", "10", "1000", "25", "40", "5"]
      console.log(arr.sort(sortNumber));  // ["1", "5", "10", "25", "40", "1000"]  
    

splice()
splice() 方法用于插入、删除或替换数组的元素。

arrayObject.splice(index, howmany, element1, ….., elementX)

注意:

参数index是必需的。规定从何处添加/删除元素,该参数是开始(包含)插入和(或)删除的数组元素的下标,必须是数字。

参数howmany是必需的。规定应该删除多少元素。必须是数字,但可以是 “0″。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。

参数element1…elementX是可选的。规定要添加到数组的新元素,从 index 所指的下标处开始插入。

splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多个值来替换那些被删除的元素。如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。splice()会直接对原数组进行修改。

如果参数index不为数字,则会自动转换。

    var arr = ["George", "John", "Thomas", "James", "Adrew", "Martin"];

        console.log(arr);  // ["George", "John", "Thomas", "James", "Adrew", "Martin"]
        console.log(arr.splice(2,1));  //["Thomas"]
        console.log(arr);  // ["George", "John", "James", "Adrew", "Martin"]
        console.log(arr.splice(2,2,"William"));  // ["James", "Adrew"]
        console.log(arr);  // ["George", "John", "William", "Martin"]
        console.log(arr.splice(2,1,"Tom","Jerry"));  // ["William"]
        console.log(arr);  // ["George", "John", "Tom", "Jerry", "Martin"]
        console.log(arr.splice(2));  // ["Tom", "Jerry", "Martin"]
        console.log(arr);  // ["George", "John"]
        console.log(arr.splice("2"));  // []
        console.log(arr);  // ["George", "John"]
        console.log(arr.splice("a"));  // ["George", "John"]
        console.log(arr);  // []  

如果index为负数,则会从数组尾部算起;howmany为负数,则不删除。

        var arr = ["George", "John", "Thomas", "James", "Adrew", "Martin"];

        console.log(arr);  // ["George", "John", "Thomas", "James", "Adrew", "Martin"]
        console.log(arr.splice(-2,1));  // ["Adrew"]
        console.log(arr);  // ["George", "John", "Thomas", "James", "Martin"]
        console.log(arr.splice(-2,-1));  // []
        console.log(arr);  // ["George", "John", "Thomas", "James", "Martin"]  

对于大型数组,splice()的效率会比较低,参考Splicing a single value

toString()
toString() 方法可把数组转换为字符串,并返回结果。

注意:Array.toString() 相当于 Array.join() ,返回值与没有参数的 join() 方法返回的字符串相同。

unshift()
unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。

arrayObject.unshift(newelement1, newelement2, …., newelementX)

注意:

参数newelement1……X至少要有一个。unshift() 方法将把它的参数插入 arrayObject 的头部,并将已经存在的元素顺次地移到较高的下标处,以便留出空间。该方法的第一个参数将成为数组的新元素 0,如果还有第二个参数,它将成为新的元素 1,以此类推。

unshift() 方法不创建新的数组,而是直接修改原有的数组。在IE6与IE7中,unshift()会返回 underfined!

    var arr = ["George", "John", "Thomas"];

    console.log(arr);  // ["George", "John", "Thomas"]
    console.log(arr.unshift("William"));  // 4
    console.log(arr.unshift("Tom","Jerry"));  // 6
    console.log(arr);  //["Tom", "Jerry", "William", "George", "John", "Thomas"]  

三、总结

1、改变原数组的方法: pop() 、push()、reverse()、shift()、sort()、splice()、unshift()

2、不改变原数组的方法: concat()、join()、slice()、toString()

3、JavaScript里面,没有好的机制来区别Array和Object,一般可以通过下面的方法来识别数组:

      var isArray = function(value){
            return Object.prototype.toString.apply(value) === '[object Array]';
     }
Fork me on GitHub