Javascript數組詳解

數組的定義

• 數組是按序號排列的一組值，每個值的位置都有編號（從 0 開始）。數組本質上是一種特殊的對象。它的鍵名是按（ 0，1，2... ）排列的一組數字

創建數組

var arr = new Array(values);
var arr = [vaules];

判斷比是否是個數組

• Array.isArray(arr)

• arr instanceof Array

增加數組元素

• push() 方法 在數組的末尾增加一個或多個元素，并返回數組的新長度。
• unshift() 方法 在數組的開頭增加一個或多個元素，并返回數組的新長度。
• length 屬性

var arr = [1, 2, 3]
arr.push(4)
arr  // 1, 2, 3, 4
arr.unshift(6)
arr  // 6, 1, 2, 3, 4
arr[arr.length] = 7  // 與push()方法類似
arr  // 6, 1, 2, 3, 4, 7

刪除數組中的元素

• delete 運算符，可以刪除數組中的某個元素，但這不會改變 length 屬性的值.
• pop() 方法 刪除數組的最后一個元素，并返回這個元素
• shift() 方法 刪除數組的第一個元素，并返回這個元素

var arr = [1,2,3];
delete arr[0];
arr   // [undefined,2,3]
arr.length  // 3
var last = arr.pop()
var first = arr.shift()
last // 3
first // undefined
arr //2

類數組對象

• 在 js 中，有些對象被叫做“類數組對象 ”（array-like object） ，因為這些對象看起來很像數組，可以使用 length 屬性，但是無法使用數組的方法。
• 典型的類數組對象是函數的 arguments 對象，以及大多數 DOM 元素集，還有字符串

// arguments對象
functionargs(){return arguments; }
var arraylike = args('a','b')
arrayLike[0]  // 'a'
arrayLike.length // 2
arrayLike instanceof Array // false
Array.isArray(arrayLike)  // false

// DOM元素集
var elts = document.getElementsByTagName('p');
elts.length  // 3
eles instanceof Array  // false
//字符串
'abc'[1]  // 'b'
'abc'.length  // 3
'abc' instanceof Array  // false
</code></pre> 
  
數組的遍歷
 
  
for…in 循環
 
  
var a =[1, 2, 3];
a.other = 'other';
for (var i in arr){
    console.log( arr[i]);
}
// 1, 2, 3, other
 
  
 
   
從上面的輸出結果可以看出，利用 for..in 循環會將動態添加的非數字鍵的值遍歷出來，因此需要使用的時候需要注意
 
  
 
  
for 循環和 while 循環
 
  
var a = [1, 2, 3];

// for循環
for(var i = 0; i < a.length; i++) {
  console.log(a[i]);
}
// while循環
var i = 0;
while (i < a.length) {
  console.log(a[i]);
  i++;
}
var l = a.length;
while (l--) {
  console.log(a[l]);
}
</code></pre> 
  
forEach()方法
 
  
//array.forEach(callback[, thisArg])
//callback 在數組的每一項上執行的函數，接受三個參數：item: 數組當前項的值，index: 當前項的索引，arr:數組本身。
var arr = [1, 2, 3]
arr.forEach(function(item, index, arr){
    console.log(item, index);
});
//1 0
//2 1
//3 2
 
  
數組常用的方法
 
  
 
  
join() 將數值轉換為字符串
 
  
var arr = [1, 2, 3];
arr.join(); // "1,2,3"
arr.join("_"); // "1_2_3"
 
  
reverse() 將數組逆序
 
  
// 原數組會被修改
var arr = [1, 2, 3];
arr.reverse(); // [3, 2, 1]
arr; // [3, 2, 1]
 
  
sort() 數組排序
 
  
 
   
默認情況下是升序排列的，底層是調用了每個數組項的 toString() 方法，然后比較得到字符串，即使每個數組項的數值是數字，比較的也是字符串
 
  
 
  
// 原數組會被修改
var arr = [1, 12, 213, 1432, 'a'];
arr.sort(); // [1, 12, 1432, 213, "a"]
arr.sort(function(a, b){
    return b-a; //按倒序排列數組
});
 
  
slice() 返回部分數組
 
  
 
   
slice 用于復制數組，復制完后舊數組不變，返回得到的新數組是舊數組的子集
 
   
第一個參數begin是開始復制的位置，需要注意的是，可以設負數。設負數表示從尾往前數幾個位置開始復制
 
  
 
  
//原數組不會被修改
var arr = [1, 2, 3, 4, 5];
arr.slice(); //[1, 2, 3, 4, 5]
arr.slice(1,3); // [2, 3]
arr.slice(1, -1); // [2, 3, 4]
arr; // [1, 2, 3, 4, 5]
 
  
splice() 數組拼接
 
  
//原數組會被修改
var arr = [1, 2, 3, 4, 5];
//從第三個數組元素刪除
arr.splice(2); // returns [3, 4, 5]
arr; // [1, 2]
//從第三個數組元素刪除，刪除兩個元素
arr.splice(2, 2) // returns [3, 4]
arr; // [1, 2, 5]
//將'a','b'替換到數組的第二個元素
arr.splice(1, 1, 'a', 'b')
 
  
isArray() 判斷是否是數組
 
  
var arr = [];
var a = "not array";
Array.isArray(arr); // true
Array.isArray(a); // false
 
  
indexOf() lastIndexOf() 數組檢索
 
  
 
   
兩者都用于返回項目的索引值。區別是 indexOf 從頭開始找， lastIndexOf 從尾開始找。如果查找失敗，無匹配，返回 -1
 
  
 
  
var arr = ['a', 'b', 'c', 'd', 'e'];
arr.indexOf('c');  // 2 找到返回數組下標
arr.indexOf('c', 3); // -1 指定從3號位開始查找
arr.indexOf('f'); // -1 沒找到該元素
arr.lastIndexOf('c'); // 2
arr.lastIndexOf('c',2); // 2
arr.lastIndexOf('f'); // -1 沒找到該元素
 
  
 
 
  
來自：http://blog.poetries.top/2016/12/13/js-arr/