JavaScript之數組

  1、數組的定義

       數組是按次序排列的一組值，單個值稱爲元素，他們的位置都有編號，從 0 開始，整個數組用方括號表示。  

var arr = [ 12, 34, 56 ];

上面代碼就表示，建立了一個數組，12是0號位置，34是1一號位置，56是2號位置，和Java中的數組下標是同樣的，都是從0 開始。

        除了定義時賦值，數組也能夠先定義，後賦值。

var arr;
arr[0] = 12;
arr[1] = 34;
arr[2] = 56;

        任意一種數據類型均可以放入數組，

var arr = [12,3.14,'a',"123",null,undefined, function (){return true;} ];

上面分別放入了 ×××，浮點型，字符型，字符串，null，undefined，函數。

數組也能夠放進去，若是放進去數組的話，就構成了多維數組。

    2、數組與對象的關係

        本質上數組也屬於對象，是字典結構的一個變種。

console.log( typeof [1,2,3] ) //object

        上面代碼說明數組是一種特殊的對象，全部typeof運算符，返回數組的類型是object。

 

    數組的特殊性體如今，它的鍵默認是按次序排列的整數（1,2,3,4....），全部數組不用爲每一個元素指定鍵名，而對象的每一個成員都必須指定鍵名，另外，數組以字符串來識別鍵名，非字符串的鍵名會被轉化爲字符串，因此數值或字符串做爲鍵名，都能讀取數組的成員。

var arr = [12, 34, 56];
arr['0'] // 12
arr[0] // 12

    上面代碼分別用數值或字符串做爲鍵名，都能讀取數組。

    需喲注意的是，上面的一條規定在賦值時也成立，若是一個值能夠被轉化爲整數，則以該值爲鍵名，等於以對應的整數爲鍵名，

    var a = [];
    a['1000'] = 'abc';
    a[1000] // 'abc'
    
    a[1.00] = 6;
    a[1] // 1

    經過上面代碼能夠看到，'1000'和 1.00均可以被轉化爲整數。

    對象有兩種讀取成員的方法：點結構（object.key）和方括號結構（object[key]），可是對於數組的鍵名不能使用點結構，arr.0是非法的，由於單獨的數字不能做爲標示符，因此數組成員只能經過 方括號結構來讀取成員。arr[0]（方括號是運算符，能夠接受數值）。

    3、length屬性

        數組的length屬性，返回的是數組成員的數量。

var arr = [12,34,56];
console.log(arr.length); //3

    JavaScript使用一個32位整數保存數組的元素個數，這意味着，這組成員最多有 2的32次方-1（4294967295），也就是說length屬性的最大值就是4294967295。

    

    數組的length屬性和對象的length屬性是有區別的，主要是數組，就必定有length屬性，而對象不必定有。並且，數組的length屬性是一個動態的值，等於鍵名中最大整數加1。

var arr = ['a', 'b'];
arr.length // 2

arr[2] = 'c';
arr.length // 3

arr[9] = 'd';
arr.length // 10

arr[1000] = 'e';
arr.length // 1001

    上面代碼也表示，數組的鍵值不須要連續，length屬性的值老是比最大的那個整數加 1，另外，這也代表數組是一種動態的數據結構，能夠隨時的增減成員。

    

    length屬性是可寫的，若是人爲設置一個小於當前成員個數的值，該數組的成員就會自動縮減到length設置的值。

var arr = [ 'a', 'b', 'c' ];
arr.length // 3

arr.length = 2;
alert(arr); // ["a", "b"]

上面代碼，length屬性被設置爲 2，則數組下標的最大值只能是 1，因此arr[2]這個值被刪除了。

    經過這個咱們能夠找到一個清空數組元素的一個最簡單的方法，就是將length屬性設置爲0。

var arr = [ 'a', 'b', 'c' ];
arr.length = 0;
alert(arr); // []

    反過來，若是將length值設置爲大於當前元素的個數，則數組的成員數量會增長到這個值，新的位置填入空元素（undefined）。

		var arr = [1,2];
		arr.length = 3;
		for(var i=0; i<arr.length; i++){
			console.log(arr[i]);
		}
		//打印 1 2 undefined

    上面代碼表示，當length屬性的值設爲大於數組個數時，新增的位置都填充爲undefined。

    

    若是設置length爲不合法的值，JavaScript會報錯。

// 設置負值
[].length = -1
// RangeError: Invalid array length

// 數組元素個數大於等於2的32次方
[].length = Math.pow(2,32)
// RangeError: Invalid array length

// 設置字符串
[].length = 'abc'
// RangeError: Invalid array length

    值得注意的是，因爲數組本質上也是一種對象，因此咱們能夠爲數組添加屬性，可是這並不影響length屬性的值。

var a = [];
a["p"] = "abc";
a.length // 0

a[2.1] = "abc";
a.length // 0

    很奇怪吧，由於length屬性的值等於最大的整數鍵加 1，這個數組中沒有整數鍵，因此length屬性的值保持爲 0。

    4、數組的空位

        當數組的某個位置是空元素（好比，兩個逗號之間沒有任何值，或者值爲undefined），咱們就稱該數組存在空位（hole）。

var a = [1,,1];
a // [1, undefined, 1]
a.length // 3

    須要注意的是，若是最後一個元素後面還有逗號的話，並不會產生空位。也就是說，有沒有這個逗號，結果都是同樣的，IE8如下的版本除外。

var a = [1,2,3,];
a.length // 3
a // [1, 2, 3]

上面代碼能夠看出，有沒有逗號，結果都是同樣的。

    使用delete命令刪除一個值，會造成空位。

                var a = [1,2,3,];
                delete arr[1];
		for(var i=0; i<arr.length; i++){
			console.log(arr[i]);
		}
		console.log(a.length);// 3
		//打印  1 undefined 3

    須要注意的是，使用delete命令並不會改變數組length屬性。

    使用delete命令時，只是把值變爲 undefined，也就是說，length屬性不會過濾undefined的值，因此使用length屬性便利書組的時候，必定要當心。

    空位經過空值生成仍是經過顯式設置爲undefined生成，有一個細微的差異，若是經過空值生成，使用數組的forEach方法或者for...in...變量數組時，空位就會被跳過。

                var arr = [,,];
		for( var i in arr ){
			console.log(arr[i]);
		}  //不產生任何輸出
		
		arr.forEach( function (x,i){console(i+" "+x);})
		//一樣沒有任何輸出

    若是空位經過顯示的undefined生成的話，則不會被跳過。

                var arr = [undefined,undefined,undefined];
		for( var i in arr ){
			console.log(arr[i]);
		}  //undefined,undefined,undefined
		
		arr.forEach( function (x,i){console(i+" "+x);})
		//undefined,undefined,undefined

    5、in運算符，for...in循環

        檢查某個鍵是否存在運算符in，使用與對象，也使用與數組。

console.log( 4 in [1,2,3,4] ); //false
console.log( 3 in [1,2,3,4] ); //true

    上面代碼，能夠看到，下標 4不存在，由於下標最大爲3，因此是false。

    使用for...in 循環能夠遍歷數組中的全部元素，須要注意的是，for...in會遍歷全部的鍵，即便是非數字鍵。

var a = [1,2,3];
a.foo = true;

for (var key in a) { 
    console.log(key); 
}
// 0
// 1
// 2
// foo

 上面代碼在遍歷數組時，也遍歷到了非整數鍵foo。因此，使用for-in遍歷數組的時候，必定要當心。

    另外一種遍歷的作法是用for循環或者while循環結合length屬性。

var a = [1,2,3];
for(var i = 0; i < a.length; i++){
    console.log(a[i]);
}

// or
var i = 0;
while (i< a.length){
    console.log(a[i]);
    i++;
}

// or
var l = a.length;
while (l--){
    console.log(a[l]);
}

    

  上面代碼是三種遍歷數組的寫法。最後一種寫法是逆向遍歷，即從最後一個元素向第一個元素遍歷。

    6、Array的構造方法

        除了直接使用方括號建立，數組還可使用JavaScript內置的Array構造函數建立。

var a = new Array();
a // []
a.length // 0

var a = new Array(1);
a // [undefined × 1]
a.length // 1

var a = new Array(2);
a // [undefined × 2]
a.length // 2

var a = new Array(1,2);
a // [1,2]
a.length // 2

    上面代碼說明，Array構造函數的用法不符合直覺。沒有參數時，返回一個空數組；使用一個參數時，返回一個指定長度的空數組；使用多個參數，返回一個指定成員的數組。因此，建議老是直接採用方括號建立數組。Array構造函數的詳細介紹，參見個人另外一篇博文：JavaScript之Array對象