JavaScript數組

構造函數

在使用構造函數建立數組時若是傳入一個數字參數，則會建立一個長度爲參數的數組，若是傳入多個，則建立一個數組，參數做爲初始化數據加到數組中

var a1 = new Array(5);
console.log(a1.length);//5
console.log(a1); //會生成一個length爲5，每個都是undefined的數組

var a2 = new Array(5,6);
console.log(a2.length);//2
console.log(a2); //[5,6]
複製代碼

數組的定義

數組（array）是按次序排列的一組值。每一個值的位置都有編號（從0開始），整個數組用方括號表示。

JS理解：數據就是原型鏈中有 Array.prototype 的對象

當咱們聲明一個 var a1 = [1, 2, 3]; 的時候，會生成一個有四個 key 數組對象。爲何 a1 它有 push 函數呢 由於咱們鏈接到了一個公用對象，能夠在公用對象中找到，它的 __proto__ 指向 Array.prototype

var a = [1, 2, 3]

var obj = {
    0: 1,
    1: 2,
    2: 3,
    length: 3
}
複製代碼

這兩個聲明其實不是同一個對象，爲何呢？

由於它們的公用屬性是不同的。a.__proto__ 指向的是數組的公用屬性 Array.prototype，這個公用屬性有 push、pop 等函數，Array.__proto__ 指向的是 Object.prototype。而 obj.__proto__ 並無指向 Array.prototype，它是 Object 構造出來的，直接指向 Object.prototype。也就是說這兩個對象自己的內存是沒有區別的，它的區別在於原型是不同的。數組之因此爲數組，是由於它擁有數組的特色，對象之因此爲對象，是由於它沒有數組的特色。因此數組和對象本質的區別就是它們的 __proto__ 有沒有指向 Array.prototype。

數組的索引與長度

數組的值能夠經過天然數索引訪問進行讀寫操做，下標也能夠是一個得出非負整數的變量或表達式

var a1 = [1,2,3,4];
console.log(a1[0]); //1
var i=1;
console.log(a1[i]); //2
console.log(a1[++i]); //3
複製代碼

數組也是對象，咱們可使用索引的奧祕在於，數組會把索引值轉換爲對應字符串 (1 => '1') 做爲對象屬性名

console.log(1 in a1);//true，確實是一個屬性
複製代碼

這樣咱們能夠看出全部的索引都是屬性名，但只有天然數（有最大值）纔是索引。數組的索引能夠不是連續的，訪問 index 不存在的元素的時候返回 undefined

var a = new Array(1,2,3);
a[100] = 100;
console.log(a.length); //101
console.log(a[3]); //undefined
console.log(a[100]); 100
複製代碼

上面的例子中，雖然直接對 a[100] 賦值不會影響 a[4] 或 a[99],但數組的長度卻受到影響，數組 length 屬性等於數組中最大的 index+1，咱們知道數組的 length 屬性一樣是個可寫的屬性，當強制把數組的 length 屬性值設置爲小於等於最大 index 值時，數組會自動刪除 indexd 大於等於 length 的數據，在剛纔代碼中追加幾句

a.length = 2
console.log(a);//[1,2]
複製代碼

這時候會發現 a[2] 和 a[100] 被自動刪除了，同理，若是把 length 設置爲大於最大 index+1 的值的時候，數組也會自動擴張，可是不會爲數組添加新元素，只是在尾部追加空空間

a.length=5;
console.log(a); //[1,2] //後面沒有3個undefined    
複製代碼

數組的 API

1. splice()

splice 方法用於刪除原數組的一部分紅員，並能夠在刪除的位置添加新的數組成員，返回值是被刪除的元素。注意，該方法會改變原數組。方法有三個參數，開始索引，刪除元素的位移和插入的新元素，固然也能夠寫多個。

• 刪除 splice 的第一個參數是刪除的起始位置（從 0 開始），第二個參數是被刪除的元素個數。若是後面還有更多的參數，則表示這些就是要被插入數組的新元素

var a = ['a', 'b', 'c', 'd', 'e', 'f'];
a.splice(4, 2) // ["e", "f"]
a // ["a", "b", "c", "d"]

a.splice(4, 2, 1, 2) // ["e", "f"]
a // ["a", "b", "c", "d", 1, 2]
複製代碼

• 添加 若是隻是單純地插入元素，splice 方法的第二個參數能夠設爲 0

var a = [1, 1, 1];
a.splice(1, 0, 2) // []
a // [1, 2, 1, 1]
複製代碼

1. slice()

slice 方法用於提取目標數組的一部分，返回一個新數組，原數組不變。

var a = [1,2,3,4,5];
a.slice(1,2);//2 從 a 下標爲1開始，到下標爲2結束(不包括2)，作爲新數組，原數組不變
複製代碼

1. reverse()

reverse 方法用於將數組逆序，與以前不一樣的是它會修改原數組

var a = [1,2,3,4,5];
a.reverse();
console.log(a); //[5, 4, 3, 2, 1]
複製代碼

1. join()

join 方法是把數組元素（對象調用其 toString() 方法）使用參數做爲鏈接符鏈接成一字符串，不會修改原數組內容。若是不提供參數，默認用逗號分隔。

var a = [1, 2, 3];

a.join(' ') // '1 2 3'
a.join(' . ') // "1 . 2 . 3"
a.join() // "1,2,3"
複製代碼

1. concat()

看起來像是剪切，但這個真不是形聲字，concat 方法用於拼接數組，a.concat(b) 返回一個 a 和 b 共同組成的新數組，一樣不會修改任何一個原始數組，也不會遞歸鏈接數組內部數組。

var a = [1,2,3,4,5]; 
var b = [6,7,8,9]; 
console.log(a.concat(b));    //[1, 2, 3, 4, 5, 6, 7, 8, 9] 
console.log(a);     //[1, 2, 3, 4, 5] 
console.log(b);     //[6, 7, 8, 9]
複製代碼

1. forEach()

forEach 方法對數組的全部成員依次執行參數函數，該函數接受三個參數：value、key、整個數組。

var a = ['a', 'b', 'c'];
a.forEach(function(q, w, e){
    console.log(q, w, e)
})

// a 0 (3) ["a", "b", "c"]
// b 1 (3) ["a", "b", "c"]
// c 2 (3) ["a", "b", "c"]
複製代碼

1. sort()

sort 方法對數組成員進行排序，默認是按照轉換爲的字符串的諸個字符的 Unicode 位點進行排序。排序後，原數組將被改變。

[4, 3, 2, 1].sort()
// [1, 2, 3, 4]
複製代碼

若是想讓sort方法按照自定義方式排序，能夠傳入一個函數做爲參數。

var items = [
    { name: 'Edward', value: 37},
    { name: 'Sharpe', value: 24},
    { name: 'And', value: 45 }
];
items.sort(function (a, b) {
    return (a.value - b.value)
});

// {name: "Sharpe", value: 24}
// {name: "Edward", value: 37}
// {name: "And", value: 45}
複製代碼

sort 的參數函數自己接受兩個參數，表示進行比較的兩個數組成員。若是該函數的返回值大於 0，表示第一個成員排在第二個成員後面；其餘狀況下，都是第一個元素排在第二個元素前面。

1. map()

map 方法對數組中每一元素進行處理，函數返回值組成一個新數組返回，新數組索引結構和原數組一致，原數組保持不變。

var arr = [1, 2, 3, 4, 5, 6]
arr.map(function(val){
     return val*val

// [1, 4, 9, 16, 25, 36]
複製代碼

1. filter()

filter 方法用於過濾數組成員，接受一個函數，全部數組成員依次執行該函數，返回結果爲 true 的成員組成一個新數組返回。

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]
arr.filter(function (val) {
  return (val > 5);
})
// [6, 7, 8, 9]
複製代碼

1. reduce()

reduce 方法依次處理數組的每一個成員，兩元素（或參數）執行操做，數組元素返回組合成一個值，遍歷數組，繼續和數組中 其餘元素組合，最終得出結果。

var arr = [1, 2, 3, 4, 5]
arr.reduce(function (a, b) {
  console.log(a, b);
  return a + b;
})
// 15
複製代碼

• map 能夠用 reduce 表示

var a = [1, 2, 3]
a.reduce(function(arr, n){
    arr.push(n * 2)
    return arr
}, [])

// [2, 4, 6]
複製代碼

• filter 能夠用 reduce表示

var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
a.reduce(function(arr, n){    if(n % 2 === 0){
        arr.push(n)
    }
    return arr
}, [])

// [2, 4, 6, 8, 10]
複製代碼