溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本文實例講述了JavaScript數組特性與實踐應用。分享給大家供大家參考，具體如下：
JavaScript 提供了一種類似數組特性的對象，它把數組的下標變為字符串，作為對象的屬性。雖然它比一個真正的數組來的慢，但是使用起來很方便。
1 數組字面量
數組字面量是在一對方括號中包圍零個或多個用逗號分隔的值的表達式：
var empty = []; var numbers = [ 'zero', 'one', 'two', 'three' ]; console.log(empty[1]);//undefined console.log(numbers[1]);//one console.log(empty.length);//0 console.log(numbers.length);//4
數組對象繼承自 Array.prototype，所以 numbers 繼承了大量有用的方法。
JavaScript 允許數組包含任意混合類型的值：
var misc = [
'string', 11.3, false, true, null, undefined, ['nested', 'array'], {object: true}, NaN, Infinity
];
console.log(misc.length);//10
2 長度
數組有一個 length 屬性，但它是沒有上界的。如果用大等于當前 length 的數字作為下標來存儲元素，那么 length 屬性值會被增大以便容納新的元素，而不會發生數組越界現象哦O(∩_∩)O~
length 屬性的值很詭異，它是數組最大整數屬性名加 1，即它不一定等于數組的元素個數：
var myArray = []; console.log(myArray.length);//0 //myArray 只包含一個屬性，但 length 的值等于這個數組最大整數的屬性名加 1 myArray[100000] = true; console.log(myArray.length);//100001
[] 后置運算符會把它包含的表達式轉換為字符串，如果表達式有 toString() 方法，那么就會調用它。這個字符串被當做屬性名，如果這個字符串是一個大等于當前 length 值而且小于 4294967295 的正整數，那么這個數組的 length 就會被重置為新的下標加 1。
可以直接設置 length 的值。設置更大的 length 值不會為數組分配更多的空間；而把 length 設小則會導致所有下標大等于新的 length 的屬性被刪除：
//刪除元素 numbers.length = 3; console.log(numbers);//[ "zero", "one", "two" ]
把下標指定為數組的當前 length，就可以把一個新元素附加到數組的尾部：
//新增元素 numbers[numbers.length] = 'four'; console.log(numbers);//[ "zero", "one", "two", "four" ]
使用 push() 可以更方便地實現同樣的功能：
//新增元素（push）
numbers.push('good');
console.log(numbers);//[ "zero", "one", "two", "four", "good" ]
3 刪除
JavaScript 數組就是對象，所以可以用 delete 移除元素：
delete numbers[2]; console.log(numbers);//[ "zero", "one", <1 個空的存儲位置>, "four", "good" ]
可惜的是，這會在數組中留下一個空洞！而我們希望的是：刪除后，被刪除元素的后續元素會自動地往前移動。
JavaScript 數組提供了 splice() 方法，它接受下列參數：
①. 數組的索引。
②. 要刪除的元素個數。
③. 其他參數（多個）- 把這些參數依次插入到索引位置。
//第一個參數是索引號，第二個參數是要刪除的元素個數 numbers.splice(2, 1); console.log(numbers);// [ "zero", "one", "four", "good" ]
4 枚舉
JavaScript 數組是對象，所以可以用 for in 語句來遍歷數組的所有屬性。可是 for in 語句無法保證屬性的順序，而且可能從原型鏈中得到意外的屬性。
可以使用 for 來避免上述的問題：
var i,
myArray = numbers;
for (i = 0; i < myArray.length; i += 1) {
console.log(myArray[i]);
}
5 數組與對象
如何在這兩者進行選擇？當屬性名是小而連續的整數時，使用數組；否則使用對象。
JavaScript 的 typeof 會認為數組是 object，這沒有意義！
我們可以定義一個函數來檢測數組：
var is_array = function (value) {
return value && typeof value === 'object' &&
value.constructor === Array;
};
這個方法在不同窗口(window)或框架(frame) 里構造的數組會失敗。所以請用下面的這個更好的方法：
var is_array = function (value) {
return Object.prototype.toString.apply(value) === '[object Array]';
};
console.log(is_array(myArray));//true
6 方法
JavaScript 提供了一些對于數組可用的方法，它們被存儲在 Array.prototype 中。我們可以為數組增加一個對數組進行計算的方法：
//新增可以對數組中的元素進行計算的方法
Array.method('reduce', function (f, value) {
var i;
for (i = 0; i < this.length; i += 1) {
value = f(this[i], value);
}
return value;
});
這樣所有的數組都繼承了這個方法。它接受一個函數與初始值為參數。然后遍歷數組，并通過函數計算出新值，最后返回這個值。
//創建數字數組
var data = [9, 16, 32, 192, 8];
//定義加法與乘法函數
var add = function (a, b) {
return a + b;
};
var mult = function (a, b) {
return a * b;
};
console.log(data.reduce(add, 0));//257
console.log(data.reduce(mult, 1));//7077888
因為數組就是對象，所以也可以直接給數組添加方法：
data.total = function () {
return this.reduce(add, 0);
};
console.log(data.total());//257
因為字符串 “total” 不是整數，所以不會改變數組的 length 值。當屬性名是字符串時，它就會成為數組的屬性。
7 指定初始值
如果使用 [] 得到的新數組，它將是空的。這是如果訪問它，將會得到 undefined。我們可以實現一個可以初始化數組元素值的方法：
//為每一個元素指定初始值
Array.dim = function (dimension, initial) {
var a = [], i;
for (i = 0; i < dimension; i += 1) {
a[i] = initial;
}
return a;
};
//創建包含 10 個 0 的數組
var myArray = Array.dim(10, 0);
console.log(myArray);//[ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ]
JavaScript 數組的元素可以是數組，通過這種方式來實現多維數組功能：
//數組的數組 var matrix = [ [0, 1, 2], [3, 4, 5] ]; console.log(matrix[1][0]);//3
可以擴展 Array 方法，讓它可以初始化矩陣：
/**
*
* @param m 第一維個數
* @param n 第二維個數
* @param initial 初始值
*/
Array.matrix = function (m, n, initial) {
var a, i, j, mat = [];
for (i = 0; i < m; i += 1) {
a = [];
for (j = 0; j < n; j += 1) {
a[j] = initial;
}
mat[i] = a;
}
return mat;
};
//構造 0 填充的 4*4 矩陣
console.log(Array.matrix(4, 4, 0));
//構造單元矩陣
Array.identity = function (n) {
var i, mat = Array.matrix(n, n, 0);
for (i = 0; i < n; i += 1) {
mat[i][i] = 1;
}
return mat;
};
var myMatrix = Array.identity(4);
console.log(myMatrix);
console.log(myMatrix[3][3]);//1
感興趣的朋友還可以使用本站在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行結果。
更多關于JavaScript相關內容還可查看本站專題：《JavaScript數組操作技巧總結》、《JavaScript字符與字符串操作技巧總結》、《JavaScript遍歷算法與技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript數學運算用法總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript錯誤與調試技巧總結》
希望本文所述對大家JavaScript程序設計有所幫助。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
