數(shù)組(Array)

數(shù)組（Array）是按序排列的一組值.每個(gè)值的位置都有編號(hào)（從0開(kāi)始）

var arr = ['a', 'b', 'c'];

a、b、c就構(gòu)成一個(gè)數(shù)組,兩端的方括號(hào)是數(shù)組的標(biāo)志.a是0號(hào)位,b是1號(hào)位,c是2號(hào)位.

數(shù)組屬于一種特殊的對(duì)象.typeof運(yùn)算符會(huì)返回?cái)?shù)組的類(lèi)型是object。

typeof [1, 2, 3] // "object"

數(shù)組的創(chuàng)建與修改

var food = new Array('fish','chicken','chips')
var food = Array('fish','chicken','chips') //new操作符可以省略
var food = ['fish','chicken','chips']
var arr1 = [1, 2, , 3] //1,2,undefined, 3

var a = arr1[0] // 訪問(wèn)第1個(gè)元素 1
var b = arr1[2] // undefined
arr1[1] = 33   //設(shè)置元素
arr1[5] = 22   //此時(shí) arr1 為1,33,undefined, 3,undefined,22

需要注意的是

var arr2 = [1, 2, 3,]  // IE8及以下是1,2,3,undefined 長(zhǎng)度4
                       // chrome 為1，2，3 長(zhǎng)度3  此寫(xiě)法不推薦

JS的數(shù)組中可以保存任意類(lèi)型的數(shù)據(jù)

var arr = [
    {a: 45},                //對(duì)象
  [1, 2, 3],                //數(shù)組
  function() {return true;} //函數(shù)
  ];

JS數(shù)組的大小是可以動(dòng)態(tài)調(diào)整的,即可隨著數(shù)據(jù)的添加自動(dòng)增長(zhǎng)以容納新增數(shù)據(jù)

var arr = [0,1,2]
console.log(arr.length)  //3
arr[3] = 3
console.log(arr.length)  //4
arr[99] = 99
console.log(arr.length)  //100

Array方法

遍歷

var cars =['Saab','Volvo','BMW']
for(var i = 0; i< cars.length; i++){
console.log(cars[i]);
}

檢測(cè)

var arr = [1, 3, 4];
arr instanceof Array //true

連接

concat() 連接數(shù)組,不會(huì)改變現(xiàn)有的數(shù)組,僅返回被連接數(shù)組

var food1 = ['雞蛋','牛奶']
var food2 = ['米飯','面包']
var food3 = ['香腸','罐頭']
var food4 = food1.concat(food2,food3)
console.log(food4)//"雞蛋", "牛奶", "米飯", "面包", "香腸", "罐頭"

刪減

• pop()

  刪除最后一個(gè)元素,把length減1,返回所刪除的元素的值(若數(shù)組已為空，則不改變數(shù)組,返回undefined)

  var arr = [2,4]
  arr1             // [2,4]
  arr.pop()        // 4
  arr              // [2]
  arr.pop()        // 2
  arr              //[]
  arr.pop()        //undefined
  arr              //[]
  

• push()

  末尾添加一個(gè)或多個(gè)元素，并返回新的length

  var sports = ["soccer", "baseball"];
  var total = sports.push("football", "swimming");
  console.log(sports); // ["soccer", "baseball", "football", "swimming"]
                       // 原數(shù)組sports被改變
  console.log(total);  // 4
                       // 返回的是新的長(zhǎng)度
  

• shift()

  刪除第一個(gè)元素,返回刪除的元素的值(若數(shù)組已為空，則不改變數(shù)組,返回undefined)

  var food = ['rice', 'milk', 'egg']
  console.log(food)            //["rice", "milk", "egg"]
  var shifted = food.shift()
  console.log(food)            //["milk", "egg"]  原數(shù)組被改變
  console.log(shifted)         //"rice"   返回的是被刪除的元素的值
  
  var empty = []
  

shifted = empty.shift()
console.log(empty) //[]
console.log(shifted) //undefined

- unshift()

數(shù)組的開(kāi)頭添加一個(gè)或多個(gè)元素，并返回新的length

```js
var arr = [1, 2];
arr.unshift(0)      //3
arr                 //[0, 1, 2]
arr.unshift(-2, -1) //   5
arr                 //[-2, -1, 0, 1, 2]
arr.unshift( [-3] ) //6
arr                 //[[-3], -2, -1, 0, 1, 2]

• splice()

  添加/刪除元素，然后返回被刪除的元素

  array.splice(start, deleteCount, item1,item2...)
  
  

  • start?
    從數(shù)組的哪一位開(kāi)始修改內(nèi)容。如果超出了數(shù)組的長(zhǎng)度，則從數(shù)組末尾開(kāi)始添加內(nèi)容;
    如果是負(fù)值，則表示從數(shù)組末位開(kāi)始向左計(jì)數(shù)

  • deleteCount
    表示要移除的數(shù)組元素的個(gè)數(shù),為整數(shù)
    如果 deleteCount 是 0，則不移除元素。這種情況下，至少應(yīng)添加一個(gè)新元素.
    如果 deleteCount 大于start 之后的元素的總數(shù)，則從 start 后面的元素都將被刪除（含第 start 位）。

  • itemN
    要添加進(jìn)數(shù)組的元素。如果不指定，則 splice() 只刪除數(shù)組元素。

  • 返回值
    由被刪除的元素組成的一個(gè)數(shù)組。如果只刪除了一個(gè)元素，則返回只包含一個(gè)元素的數(shù)組。如果沒(méi)有刪除元素，則返回空數(shù)組。

  var food = ['雞蛋','牛奶','米飯','面包','香腸']
  
  //從第 2 位開(kāi)始刪除 0 個(gè)元素，插入 '罐頭'
  var removed = food.splice(2, 0,'罐頭')
  food       //["雞蛋", "牛奶", "罐頭", "米飯", "面包", "香腸"]
  removed    //[] 什么也沒(méi)刪除 返回的是空數(shù)組
  
  //從第 3 位開(kāi)始刪除 1 個(gè)元素
  removed = food.splice(3, 1)
  food      //["雞蛋", "牛奶", "罐頭", "面包", "香腸"]
  removed   //["米飯"]
  
  //從第 2 位開(kāi)始刪除 1 個(gè)元素，然后插入 '面條'
  //刪除一個(gè) 插入一個(gè) 實(shí)際上相當(dāng)于替換
  removed = food.splice(2, 1, '面條');
  food      //["雞蛋", "牛奶", "面條", "面包", "香腸"]
  removed   //["罐頭"]
  
  //從第 0 位開(kāi)始刪除 2 個(gè)元素，然后插入 "包子", "餃子" 和 "烤肉"
  removed = food.splice(0, 2, "包子", "餃子", "烤肉")
  food      //["包子", "餃子", "烤肉", "面條", "面包", "香腸"]
  removed   //["雞蛋", "牛奶"]
  
  //從第 3 位開(kāi)始刪除 后面所有元素
  removed = food.splice(3, Number.MAX_VALUE);
  food      //["包子", "餃子", "烤肉"]
  removed   //["面條", "面包", "香腸"]
  
  //在從后面數(shù)第二個(gè)元素 刪除一個(gè)元素' 插入'烤鴨','燒雞'
  removed = food.splice(-2,1,'烤鴨','燒雞')
  food      //["包子", "烤鴨", "燒雞", "烤肉"]
  removed   //餃子
  

  ** 以上五種方法都會(huì)對(duì)原數(shù)組進(jìn)行修改 **

• slice()

  從已有的數(shù)組中選取元素存入到新數(shù)組中,返回新數(shù)組(不會(huì)改變?cè)瓟?shù)組)

  arrayObject.slice(start,end)
  

  從star開(kāi)始(包括star)在end結(jié)束(不包括end)

  var food = ['雞蛋','牛奶','米飯','面包','香腸']
  var breakfast = food.slice(0,1)
  food      //['雞蛋','牛奶','米飯','面包','香腸']
  breakfast //['雞蛋','牛奶']
  
  

轉(zhuǎn)換

• join()

把所有元素放入一個(gè)字符串,通過(guò)傳入的參數(shù)連接各元素,不改變?cè)瓟?shù)組
如果傳入的參數(shù)是空字符串,那么數(shù)組中的所有元素將被直接連接。
如果省略傳入的參數(shù)，默認(rèn)用逗號(hào)連接

• toString()

把數(shù)組轉(zhuǎn)換為字符串，并返回結(jié)果,不改變?cè)瓟?shù)組

var acter1 = ['特朗普','克林頓','桑德斯']
var acter2 = acter1.toString()
var acter3 = acter1.join('++')
acter1          //["特朗普", "克林頓", "桑德斯"]
acter2          //"特朗普,克林頓,桑德斯"
acter3          //"特朗普++克林頓++桑德斯"
typeof acter1   //"object"
typeof acter2   //"string"
typeof acter3   //"string"

• split
  把一個(gè)字符串分割成字符串?dāng)?shù)組

stringObject.split(separator,howmany)

- separator
必需,字符串或正則表達(dá)式，從該參數(shù)指定的地方分割stringObject.
如果把空字符串 ("") 用作 separator，那么 stringObject 中的**每個(gè)字符之間**都會(huì)被分割。
- howmany
可選,該參數(shù)指定返回的數(shù)組的最大長(zhǎng)度。如果設(shè)置了該參數(shù)，返回的子串不會(huì)多于這個(gè)參數(shù)指定的數(shù)組。
如果沒(méi)有設(shè)置該參數(shù)，整個(gè)字符串都會(huì)被分割，不考慮它的長(zhǎng)度。
- 返回值
返回一個(gè)由字符串元素組成的數(shù)組。
該數(shù)組是通過(guò)在 separator 指定的邊界處將字符串 stringObject 分割成子串創(chuàng)建的。
** 返回的數(shù)組中的字串不包括 separator 自身 **
但是，如果 separator 是包含子表達(dá)式的正則表達(dá)式，那么返回的數(shù)組中包括與這些子表達(dá)式匹配的字串（但不包括與整個(gè)正則表達(dá)式匹配的文本）

var str1 = 'a-b,ds-d,-,asd,ds-ad,';
var str2 = str1.split(',');
var str3 = str1.split('-');
console.log(str1); //"a-b,ds-d,-,asd,ds-ad,"
                   //split()方法不改變?cè)址?console.log(str2); //["a-b", "ds-d", "-", "asd", "ds-ad", ""]
console.log(str3); //["a", "b,ds", "d,", ",asd,ds", "ad,"]
console.log(typeof str3[2]); //分割后形成的新數(shù)組的元素是字符串    

** String.split() 執(zhí)行的操作與 Array.join 執(zhí)行的操作是相反的 **

排序

• reverse()
  方法用于顛倒數(shù)組中元素的順序

• sort()
  方法用于對(duì)數(shù)組的元素進(jìn)行排序

  arr.sort([compareFunction])
  

• compareFunction
  可選.用來(lái)指定按某種順序進(jìn)行排列的函數(shù)。
  如果省略，元素按照轉(zhuǎn)換為的字符串的諸個(gè)字符的Unicode位點(diǎn)進(jìn)行排序
  如果指明了 compareFunction ，那么數(shù)組會(huì)按照調(diào)用該函數(shù)的返回值排序

  • 記 a 和 b 是兩個(gè)將要被比較的元素：
  • compareFunction(a, b) 小于 0 ，那么 a 會(huì)被排列到 b 之前；
  • compareFunction(a, b) 等于 0 ， a 和 b 的相對(duì)位置不變。
    備注： ECMAScript 標(biāo)準(zhǔn)并不保證這一行為，而且也不是所有瀏覽器都會(huì)遵守（例如 Mozilla 在 2003 年之前的版本）；
  • 如果 compareFunction(a, b) 大于 0 ， b 會(huì)被排列到 a 之前。
  • compareFunction(a, b) 必須總是對(duì)相同的輸入返回相同的比較結(jié)果，否則排序的結(jié)果將是不確定的。

• 返回值
  對(duì)數(shù)組的引用。
  請(qǐng)注意,數(shù)組在原數(shù)組上進(jìn)行排序，不生成副本

var fruit = ['cherries', 'apples', 'bananas'];
    fruit.sort(); // ['apples', 'bananas', 'cherries']

var scores = [1, 10, 2, 21];
    scores.sort(); // [1, 10, 2, 21]


var things = ['word', 'Word', '1 Word', '2 Words'];
    things.sort(); // ['1 Word', '2 Words', 'Word', 'word']

• 比較函數(shù)格式如下：

function compare(a, b) {
  if (a小于b) {
    return -1;
  }
  if (a大于b) {
    return 1;
  }
  //a等于 b
  return 0;
}

希望比較數(shù)字而非字符串，比較函數(shù)可以簡(jiǎn)單的以 a 減 b，如下的函數(shù)將會(huì)將數(shù)組升序排列

function compareNumbers(a, b) {
  return a - b;
}
sort 方法可以使用 函數(shù)表達(dá)式 方便地書(shū)寫(xiě)：

var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
  return a - b;
});
console.log(numbers);

// [1, 2, 3, 4, 5]

** 這兩種方法都會(huì)使原數(shù)組發(fā)生改變 **

參考資料:

1. MDN
2. W3school
3. 阮一峰. JavaScript 標(biāo)準(zhǔn)參考教程（alpha)
4. Nicholas C.Zakas. JavaScript高級(jí)程序設(shè)計(jì)[M]. 第1版. 人民郵電出版社, 2012.

此文是作者學(xué)習(xí)中記錄的筆記
限于作者當(dāng)前水平,出現(xiàn)錯(cuò)誤在所難免,望讀者指正
本文版權(quán)歸作者所有,轉(zhuǎn)載務(wù)必說(shuō)明作者及本文地址