在javascript中，數(shù)組是有序數(shù)據(jù)的集合，用于對(duì)大量數(shù)據(jù)進(jìn)行存儲(chǔ)，可以一次性存儲(chǔ)多個(gè)數(shù)據(jù)，并且數(shù)組的長(zhǎng)度可以動(dòng)態(tài)的調(diào)整；通過使用數(shù)組，可以在很大程度上縮短和簡(jiǎn)化程序代碼，從而提高應(yīng)用程序的效率。

前端（vue）入門到精通課程：進(jìn)入學(xué)習(xí)

本教程操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

JavaScript 數(shù)組（Array）是有序數(shù)據(jù)的集合，數(shù)組中的每個(gè)成員被稱為元素（Element），每個(gè)元素的名稱（鍵）被稱為數(shù)組下標(biāo)（Index）。數(shù)組的長(zhǎng)度是彈性的、可讀寫的；即數(shù)組的長(zhǎng)度可以動(dòng)態(tài)的調(diào)整。

數(shù)組的作用：對(duì)大量數(shù)據(jù)進(jìn)行存儲(chǔ)，可以一次性存儲(chǔ)多個(gè)數(shù)據(jù)。通過使用數(shù)組，可以在很大程度上縮短和簡(jiǎn)化程序代碼，從而提高應(yīng)用程序的效率。

在 JavaScript 中，您可以使用 Array 對(duì)象定義數(shù)組，此外，Array 對(duì)象中還提供了各種有關(guān)數(shù)組的屬性和方法。

數(shù)組的定義: Array 簡(jiǎn)寫: arr

數(shù)組是JS中的一個(gè)數(shù)據(jù)容器。它是引用類型之一。

它的作用非常簡(jiǎn)單，就是用來裝多個(gè)數(shù)據(jù),并且數(shù)組的長(zhǎng)度可以動(dòng)態(tài)的調(diào)整。

數(shù)組創(chuàng)建的方式:

• 字面量

• 構(gòu)造函數(shù)

字面量語(yǔ)法：var 數(shù)組名 = [成員1, 成員2, 成員3, …] ;

數(shù)組元素之間,逗號(hào)隔開;

構(gòu)造函數(shù)語(yǔ)法： var 數(shù)組名 = new Array(成員1, 成員2, 成員3, …) (至少要是有兩個(gè)或兩個(gè)以上的數(shù)組元素;) 小bug:當(dāng)參數(shù)只有一個(gè)且參數(shù)的類型是數(shù)字時(shí) ,會(huì)被當(dāng)做數(shù)組的長(zhǎng)度 ;

var arr = new Arry(5); console.log(arr); 輸出結(jié)果是:

var數(shù)組名= new Array() ;
var arr = new Array ();//創(chuàng)建一個(gè)新的空數(shù)組
注意Array 0 ，A要大寫

數(shù)組由兩部分組成：

1:索引(也叫下標(biāo)) ,下標(biāo)從0開始;

2.成員(數(shù)組元素): 成員沒有任何限制,可以是任意類型的數(shù)據(jù);可以是字符串 可以是數(shù)字 可以是布爾值 可以是 undefined 可以是null 還可以是數(shù)組;

獲取數(shù)組元素:

數(shù)組的取值: 數(shù)組名[下標(biāo)] ; 下標(biāo)從零開始的;

// 格式：數(shù)組名[下標(biāo)] 下標(biāo)又稱索引
// 功能：獲取數(shù)組對(duì)應(yīng)下標(biāo)的那個(gè)值，如果下標(biāo)不存在，則返回undefined。
var arr = ['red',, 'green', 'blue'];

0 1 2
console.log(arr[0]); // red
console.log(arr[2]); // blue
aconsole.log(arr[3]); // 這個(gè)數(shù)組的最大下標(biāo)為2,沒有這個(gè)數(shù)組元素所以輸出的結(jié)果是undefined;

通過索引 添加成員/修改成員:

// 構(gòu)造函數(shù)定義一個(gè)數(shù)組 var arr = new Array('張三', '李四', '王五', '趙六')  // 添加成員 arr[4] = '龔七' console.log(arr)  //張三', '李四', '王五', '趙六','龔七' // 修改成員 arr[0] = '王老五' console.log(arr)  //'王老五', '李四', '王五', '趙六'

特殊情況: 通過索引 多設(shè)置成員, 中間會(huì)有斷開,為空; 禁止!

var arr = ["a", "b"];

arr[5] = "good";

console.log(arr); //

遍歷數(shù)組:

數(shù)組的屬性length,就是數(shù)組成員的個(gè)數(shù);

數(shù)組名.length

var arr = [1, 2, 3, 4, 5, 6, 7, 8];

length表示數(shù)組的長(zhǎng)度 它會(huì)跟著數(shù)組實(shí)時(shí)發(fā)生變化(動(dòng)態(tài)監(jiān)測(cè)數(shù)組元素的個(gè)數(shù))

console.log(arr.length) //數(shù)組成員的個(gè)數(shù): 8

length屬性可讀可寫 它也會(huì)影響數(shù)組的成員個(gè)數(shù) 但是我們一般不會(huì)主動(dòng)修改該屬性;

var arr = [1, 2, 3, 4, 5, 6, 7, 8];

arr.length = 3;

console.log(arr.length);

console.log(arr);

數(shù)組元素求和,求平均值:

求數(shù)組元素的最大值:

數(shù)組元素轉(zhuǎn)字符串,并分割開: 推薦: 數(shù)組名.join("連接符")

求數(shù)組中大于10的成員,并挑選出來:

數(shù)組元素的倒敘:

數(shù)組元素的增刪改查;

unshift 頭增 數(shù)組名.unshift("value")

作用：頭部增加 (可以增加多個(gè))

參數(shù):添加的成員,可以是多個(gè);

返回值：數(shù)組的新長(zhǎng)度

var arr = ['張三', '李四', '王五', '趙六']; var result = arr.unshift('王二',劉一) console.log(result); // 6 console.log(arr);  // ["王二", "劉一","張三", "李四", "王五", "趙六"]

push 尾增 數(shù)組名.push("value")

作用：尾部增加 (可以增加多個(gè))

參數(shù):添加的成員,可以是多個(gè);

返回值：數(shù)組的新長(zhǎng)度

var arr = ['張三', '李四', '王五', '趙六']; var result = arr.push('王二',"劉一") console.log(result); // 6 console.log(arr); // ["張三", "李四", "王五", "趙六", "王二","劉一"]

shift 頭刪 數(shù)組名.shift() 只刪除第一個(gè),()括號(hào)內(nèi)為空;

作用：刪除數(shù)組的頭部第一項(xiàng)

參數(shù):無;

返回值：被刪除的那一項(xiàng)

var arr = ['張三', '李四', '王五', '趙六']; var result = arr.shift() console.log(result); // 張三 console.log(arr) //  ['李四', '王五', '趙六'];

pop 尾刪 數(shù)組名.pop() 只刪除最后一個(gè),()括號(hào)內(nèi)為空;

作用：刪除數(shù)組最后一項(xiàng);

參數(shù):無;

返回值：被刪除的那一項(xiàng)

var arr = ['張三', '李四', '王五', '趙六']; var result = arr.pop(); console.log(result); // 趙六 console.log(arr) //["張三", "李四", "王五"]

concat 拼接,合并; 數(shù)組名.concat("value")

作用：合并

參數(shù)：任意個(gè)、任意類型

返回值：一個(gè)新的合并后的數(shù)組

特點(diǎn)：沒有改變?cè)瓉淼臄?shù)組

var arr1 = [1, 2, 3];

var arr2 = [4, 5, 6];

var newArr = arr1.concat(arr2, "good", true, 1);

console.log(arr1); // 1,2,3

console.log(arr2); //4,5,6

console.log(newArr); //1, 2, 3, 4, 5, 6, "good", true, 1

slice 截取 數(shù)組名.slice(start,end) 參數(shù)是下標(biāo); 包括開頭,不包括結(jié)尾;

slice的本質(zhì)是復(fù)制(淺復(fù)制)

作用：截取

參數(shù)：

1. 沒有參數(shù) 截取全部

2. 一個(gè)參數(shù) 從指定位置截取到最后(包括最后)

3. 兩個(gè)參數(shù) 從指定開始位置截取到指定的結(jié)束位置 1. 這兩個(gè)參數(shù)都是下標(biāo) 2. 開始位置(包含) 3. 結(jié)束位置(不包含) 4. 第二個(gè)參數(shù)要比第一個(gè)大;

4. 參數(shù)可以是負(fù)數(shù),負(fù)數(shù)是從后面開始,最后一個(gè)是-1;

特點(diǎn)：不改變?cè)瓟?shù)組

沒有參數(shù) (截取全部的)
var arr = ['張三', '李四', '王五', '趙六'];
var arr1 = arr.slice();
console.log(arr1) // ["張三", "李四", "王五", "趙六"]

一個(gè)參數(shù) (從指定位置截取到最后(包括最后))
var arr = ['張三', '李四', '王五', '趙六'];
var arr2 = arr.slice(1);
console.log(arr2) // ["李四", "王五", "趙六"]

兩個(gè)參數(shù) (包括開始,不包括結(jié)尾)
var arr = ['張三', '李四', '王五', '趙六'];
var arr3 = arr.slice(1, 3);
console.log(arr3) // ["李四", "王五"]

參數(shù)為負(fù)數(shù); (還是第二個(gè)參數(shù)要比第一個(gè)大)

var arr = ['張三', '李四', '王五', '趙六','劉一'];
var arr3 = arr.slice(-3, -1);
console.log(arr3) // ["王五","趙六"]

PS: 如果參數(shù)是負(fù)數(shù) 那么表示從后往前數(shù) 最后一個(gè)值是-1

splice 操作數(shù)組 數(shù)組名.splice(參數(shù)1,參數(shù)2,參數(shù)3)

作用：用于操作數(shù)組成員

參數(shù)：

• 參數(shù)1:操作開始位置; (從第幾個(gè)索引號(hào)后開始, 可以看成直接從順序的第幾個(gè)后開始的)
• 參數(shù)2:刪除的成員個(gè)數(shù); (為0,是添加)
• 參數(shù)3:從第三個(gè)參數(shù)開始是添加的成員;

返回值：被刪除的那些成員組成的數(shù)組

特點(diǎn)：會(huì)改變?cè)瓟?shù)組

// 刪除  var arr = ['張三', '李四', '王五', '趙六']; var result = arr.splice(1, 2) console.log(result); // ["李四", "王五"] console.log(arr); // ["張三", "趙六"]    ---------------------------------------------------------------------- // 插入   第二個(gè)參數(shù)為0;  var arr = ['張三', '李四', '王五', '趙六']; var  result = arr.splice(2, 0, '小綿羊'); console.log(result); // [] console.log(arr) // ["張三", "李四", "小綿羊", "王五", "趙六"] ------------------------------------------------------------------------ // 替換   第一個(gè)參數(shù)從哪里開始, 第二個(gè)參數(shù)刪除幾個(gè),第三個(gè)參數(shù)...添加的新成員;  var arr =['張三', '李四', '王五', '趙六']; var result = arr.splice(2, 1, '小綿羊', '大綿羊'); console.log(result); // ["王五"] console.log(arr) // ["張三", "李四", "小綿羊", "大綿羊","趙六"]

———————————————————————————————–

如果只有一個(gè)參數(shù) 則第二個(gè)參數(shù)默認(rèn)為刪除所有;

var arr = ['張三', '李四', '王五', '趙六'];

var result = arr.splice(2);

console.log(result); // ["王五","趙六"]

console.log(arr) // ["張三", "李四"]

indexOf 數(shù)組名.indexOf("數(shù)組元素")

作用： 查找

參數(shù)：被查找的成員;

返回值：下標(biāo)(索引); 若有該成員返回該索引; 若沒有就返回-1

var arr = ["a", "b", "c", "d", "e", "f"];

var idx = arr.indexOf("d"); //3

var idx = arr.indexOf("aa"); //-1

console.log(idx);

join 數(shù)組名.join("連接符")

作用：轉(zhuǎn)字符串

返回值：數(shù)組元素變成字符串類型,鏈接符相連;

參數(shù)： 拼接符號(hào)(可選)

數(shù)組名.join() 不寫內(nèi)容,默認(rèn)是逗號(hào), ;

數(shù)組名.join(''), '' 沒有空格隔開, 數(shù)組直接相連;

數(shù)組名.join(' ') 空格隔開, 空格

數(shù)組名.join('*')

var arr =['張三', '李四', '王五', '趙六']; var str = arr.join(); console.log(str); // 張三,李四,王五,趙六  var str1 = arr.join('+'); console.log(str1); // 張三+李四+王五+趙六   var str2 = arr.join('❤'); console.log(str2); // 張三❤李四❤王五❤趙六

//返回值是數(shù)組元素變成字符串,并連接符相連;

reverse 數(shù)組倒敘 數(shù)組名.reverse() 括號(hào)內(nèi)不跟參數(shù);

作用：將數(shù)組的成員倒序

返回值：倒敘的原數(shù)組

參數(shù)：無

特點(diǎn)：會(huì)改變?cè)瓟?shù)組

var arr =['張三', '李四', '王五', '趙六']; console.log(arr) // ["張三", "李四", "王五", "趙六"]  var arr1 = arr.reverse(); console.log(arr1) // ["趙六", "王五", "李四", "張三"] console.log(arr === arr1) // true

console.log(arr) // ["趙六", "王五", "李四", "張三"] //會(huì)改變?cè)瓟?shù)組;

其他方法:

sort 排序 數(shù)組名.sort(函數(shù)) 升序或降序

作用：將數(shù)組成員按照指定規(guī)則排序

返回值：排序后原數(shù)組

參數(shù)：規(guī)則函數(shù); 不跟參數(shù)(//不跟參數(shù),會(huì)先轉(zhuǎn)為字符串,然后按照ascii碼排序首字母排;)

特點(diǎn)：會(huì)改變?cè)瓟?shù)組

var arr = [89, 96, 45, 66, 78, 3, 100, 1];

arr.sort(function(a, b) {

return a – b; // 升序

});

console.log(arr); // [1, 3, 45, 66, 78, 89, 96, 100];

————————————————————————-

var arr = [89, 96, 45, 66, 78, 3, 100, 1];

arr.sort(function(a, b) {

return b – a; // 降序

});

console.log(arr); // [100, 96, 89, 78, 66, 45, 3, 1];

————————————————————–

var arr = [89, 96, 45, 66, 78, 3, 100, 1];

arr.sort(); //不跟參數(shù),會(huì)先轉(zhuǎn)為字符串,然后按照ascii碼排序首字母排;

console.log(arr); //[1, 100, 3, 45, 66, 78, 89, 96]

交換兩個(gè)變量的值

var a = 4; var b = 5;  // 交換兩個(gè)變量的值要借助第三個(gè)變量 var c = b; b = a; a = c;  console.log(a); // 5 console.log(b); // 4

數(shù)組的冒泡排序

for (var j = 0; j < arr.length – 1; j++) {
for (var i = 0; i < arr.length – 1 – j; i++) {
if (arr[i] > arr[i + 1]) {
var temp = arr[i];
arr[i] = arr[i + 1];
arr[i + 1] = temp;
}
}
}

———————————————————-

要排序 就要比較大小

先拿著第一個(gè)數(shù)字與第二個(gè)比 如果第一個(gè)大 則交換位置 比完之后 數(shù)組的第二個(gè)位置的數(shù)字一定比第一個(gè)大

再拿著第二個(gè)與第三個(gè)比 比完之后 數(shù)組的第三個(gè)肯定比第二個(gè)位置的數(shù)要大

以此類推 一輪比完之后 最后的數(shù)字一定是最大的

第二輪從頭繼續(xù)比較 第二輪結(jié)束之后 可以確定第二個(gè)最大的數(shù)字

第三輪…

至最后.

// // 外層循環(huán) 決定了內(nèi)層循環(huán)的執(zhí)行次數(shù)

for (var j = 0; j < arr.length – 1; j++) {

// 內(nèi)層循環(huán) 兩兩比較

for (var i = 0; i < arr.length – 1 – j; i++) {

/ / 判定 如果前面大 后面小 則交換

if (arr[i] > arr[i + 1]) {

var temp = arr[i];

arr[i] = arr[i + 1];

arr[i + 1] = temp;

}

}

}

二維數(shù)組

一個(gè)數(shù)組的每一個(gè)成員也是數(shù)組，這就叫做二維數(shù)組。

一維數(shù)組： [1, 2, 3, 4, 5, 6]

二維數(shù)組：

[

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

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

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

…

]

清空數(shù)組的方法:

// 方式1 推薦
arr = [ ];
// 方式2
arr.length = 0;
// 方式3
arr.splice(0, arr.length);

【推薦學(xué)習(xí)：javascript高級(jí)教程】