數(shù)組的概念
- 什么是數(shù)組？
數(shù)組指的是數(shù)據(jù)的有序列表。通常用一對[ ]括起來
[ ]內(nèi)部每一個數(shù)值成為數(shù)組的元素 - 數(shù)組中每個元素都有一個位置，
我們把這個位置稱為索引（下標，index）
數(shù)組的索引是從0 開始的 - 同一個數(shù)組當中，元素的類型不做任何限制
甚至數(shù)組中的元素可以是另外一個數(shù)組
（二維數(shù)組，三維數(shù)組）
JS中數(shù)組有哪些特點？
- 數(shù)組長度可以動態(tài)改變
- 同一個數(shù)組中可以儲存不同的數(shù)據(jù)類型
- 每個數(shù)組都有l(wèi)ength屬性，
用于代表數(shù)組中元素的個數(shù).通過這個，在后面使用循環(huán)語句的時候就會解放個你的雙手。
數(shù)組的創(chuàng)建
運用在下面兩種情況比較常見
- 字面量方式
- 構造函數(shù)
字面量方式創(chuàng)建
- 所有元素都用方塊號括起來
- 不同元素之間用逗號分隔開
["a","b",5];
創(chuàng)建了長度為2的數(shù)組，初始化
var colors =["red","blue"];
創(chuàng)建了長度為0的數(shù)組
var colors = [];
var colors =["red","blue",];
//標準瀏覽器為2
IE 解析為3
構造函數(shù)
- 構造函數(shù)在創(chuàng)建對象的時候才會使用
- 數(shù)組的構造函數(shù)創(chuàng)建方法
- Array()
- new Array(數(shù)組長度)；
創(chuàng)建一個長度為0 的數(shù)組
var colors = new Array();
創(chuàng)建一個長度為5 的數(shù)組
var colors = new Array(5)
創(chuàng)建一個長度為3 的數(shù)組，三個元素分別是r...
var colors = new Array("red","green","blue")
注意
- 使用構造函數(shù)創(chuàng)建數(shù)組對象的時候，最后一個元素
- 千萬不要添加逗號，否則會報錯
- 使用構造只能傳入一個……且要從0開始
- 使用構造函數(shù)創(chuàng)建數(shù)組對象的時候，new 關鍵字
- 其實可以省略，也可以寫成Array()
var arr = new Array();
變量 數(shù)組對象
棧區(qū) 堆區(qū)
關于棧區(qū)和堆區(qū)的關系
- 內(nèi)存當中，實際上分為很多個區(qū)域，分別用來保存
- 不同的數(shù)據(jù)，其中非常重要的兩個區(qū)域是棧區(qū)和堆區(qū)
- 棧區(qū)：基本數(shù)據(jù)都保存在棧區(qū)，會根據(jù)函數(shù)的結束，而去釋放內(nèi)存。
- 堆區(qū)：非基本數(shù)據(jù)都保存在堆區(qū)，需要程序猿手動開辟，手動釋放。
- new 是在堆區(qū)開辟一塊內(nèi)存空間，用來儲存對象
- arr 是數(shù)組的引用，是通過棧區(qū)
訪問和修改數(shù)組中的元素
- 利用索引來訪問數(shù)組中的元素
- 例如： 數(shù)組長度為5
0，1，2,3,4arr[0]arr[1]
創(chuàng)建一個長度為5 的數(shù)組
var arr = [10,20,30,40,50];
console.log("數(shù)組中第一個元素："+arr[0]);
修改對應的數(shù)組位置
arr[1] = 100;
console.log(arr);
數(shù)組的長度
如何獲取數(shù)組的長度
- 數(shù)組的名稱。length
- 每一個數(shù)組都有一個length 屬性，
- 用于表示數(shù)組的長度（即：元素的個數(shù)）
- 數(shù)組名稱.length
var arr = [10,20,30,40,50]
console.log("數(shù)組的長度為"+arr.length);
如何修改數(shù)組的長度
- 一般強類型語言中，數(shù)組的長度是固定的
- 一旦創(chuàng)建成功，則不能修改數(shù)組的長度
- 但是JS是一種弱類型語言，
- 數(shù)組的長度可以在程序運行期間根據(jù)需要
- 動態(tài)的發(fā)生改變
- 數(shù)組的length不僅僅可讀....
- 修改長度的內(nèi)容，會被直接移除
- 類似undefined...
- 通過給最后一個元素賦值來動態(tài)的修改數(shù)組長度
var arr = [4,5,6];
console.log(arr.length);//3
//給下標為11的元素賦予初始值
//...
arr[11] = 678;
console.log(arr.length);
//數(shù)組長度會變成12
//沒有賦值的默認全部為undefined
數(shù)組的遍歷
1. for 循環(huán)遍歷數(shù)組（推薦使用）
- 數(shù)組的長度是多少，就循環(huán)遍歷多少次
- 循環(huán)變量作為數(shù)組的下標
var arr = [10,20,30,40,60,30,80];
//數(shù)組的長度是多少，就循環(huán)遍歷多少次
//循環(huán)變量作為數(shù)組的下標
for(var i = 0;i < arr.length;i++){
console.log(arr[i]);
}
2. for.. in 循環(huán)遍歷數(shù)組
- 每循環(huán)一輪，都會把數(shù)組的下標賦值給index
- index 就相當于拿到了數(shù)組每一個元素的下標
- index 是從0 開始獲取的
var arr = [10,20,30,40,60,30,80];
for(var index in arr){
//循環(huán)輸出：0,1,2,3,4，4，5
console.log(index);
}
//將聲明變量的var進行省略
for(i in arr){
console.log(arr[i]);
}
3. for.. each遍歷數(shù)組
- ES5 中增加的內(nèi)容
- 需要傳入一個匿名函數(shù)
var arr = [4,5,8,45,55];
arr.forEach(function(element,index){
console.log(element);
console.log("index下標是"+index)；
});
- 匿名函數(shù)中需要兩個參數(shù)
- 參數(shù)1：循環(huán)遍歷的那個元素
- 參數(shù)2：循環(huán)遍歷的那個下標
- 我們可以在匿名函數(shù)內(nèi)部添加額外的代碼
- 老師說這個可以額外做好多事情
數(shù)組轉換方法
1. toString()
只能使用逗號鏈接
var arr = [50,40,30,20,99];
alert(arr.toString());
alert(arr);
console.log(....)
....
2. join()
可以使用指定的符號進行鏈接
var arr = [50,40,30,20,99];
alert(arr.join("->"));
</script>
棧和隊列
數(shù)組的棧方法
棧：一種數(shù)據(jù)結構，特點：FILO（先進后出）
- 向棧內(nèi)部存入元素，我們稱之為“入?！?push)
- 從棧內(nèi)部移除元素，我們稱之為“出棧”(pop)
- 先入棧的元素在棧的下方
- 后入棧的元素在棧的頂部
- 這兩個操作都是對棧頂元素進行操作
- “吃多了拉就是隊列，吃多了吐就是?！?/li>
var arr = ["沈斌"，"沈杰"]
var len = arr.push("lipeng");
//push()方法返回添加成功后數(shù)組的長度
console.log(len);
console.log(arr);
//pop()出棧操作，一次只能出棧一個元素
var item = arr.pop();
//pop()方法將棧頂元素從棧頂移除
console.log(item);
console.log(arr);
數(shù)組的隊列
隊列也是一種數(shù)據(jù)結構，特點：FIFO（先進先出）
- JS中也提供了模擬隊列的方法
- 1.向隊列頭部添加元素(unshift)
- 從隊列頭部移除元素(shift)
- 2.向隊列的尾部添加
向隊列的尾部移除 - 隊列尾部的操作實際是有push和pop完成
var arr = ["a","b","c"];
var firstItem = arr.shift();
console.log(firstItem); //a
var len = arr.unshift("王二麻子")；
console.log(len);
console.log(arr);
數(shù)組的倒置方法
- 倒置操作對原數(shù)組本身進行操作
- 返回的也是原數(shù)組對象
- 并不是新建數(shù)組
var arr = ["a","b","c"];
console.log("數(shù)組倒置前:"+arr);
//對數(shù)組元素進行倒置
arr.reverse();
console.log("數(shù)組倒置后："+arr)；
數(shù)組的索引方法
1. indexOf(item)
從開始向后
2. lastIndexOf(item)
從后往前
（查找最后一次出現(xiàn)的位置）
var arr = ["a","b","c","d","b","f"];
console.log(arr.indexOf("b")); //1
console.log(arr.lastIndexOf("b")); //3
//indexOf(searchValue,fromIndex)
//searchValue:所需要搜索的字符
//fromIndex：從第一個元素開始進行搜索
console。log(arr.indexOf("b",2)); //4
console。log(arr.lastIndexOf("b",2)); //1
console。log(arr.indexOf("王二麻子")); //-1
//如果元素無法查找到，則會返回-1
console。log(arr.indexOf("b",6)); //-1
獲取新的數(shù)據(jù)
1. concat()
該方法用于連接兩個或者多個數(shù)組
- 至少需要傳入一個參數(shù)，參數(shù)可以是元素，也可以是數(shù)組
var arr = ["a","b","c","d"];
var newArr = arr.concat(["e","f"]);
console.log(newArr.length); //6
console.log(arr.length); //4
//把兩個元素和一個數(shù)組全部進行拼接，
//實際出現(xiàn)的會是一個完整的“新數(shù)組”
var newArr_2 = arr.concat("e","f",["g","h"]);
console.log(newArr_2.length); //8
2. slice()
arr.slice()
- 截取數(shù)組，并
- 參數(shù)
- start:
- 必選
- 如果是負數(shù)，表示從尾部開始截取
- -1 -> 表示最后一個元素
- end：
- 可選
- 截取到指定的位置
- 不包括end的位置
- 如果沒有給定end，
- 則表示截取到最后位置
- end 要大于 start，否則無法截取元素
- 截取出來的是一個新數(shù)組，對原始數(shù)組沒有任何影響
var arr = ["a","b"..."e"]
console.log(arr.slice(3);//d,e
console.log(arr.slice(-1));//e
console.log(arr.slice(2,1));//空
console.log(arr.slice(-3,-2));//c
3. splice() (重點)
arr.plice(index,howmany,item1...itemN)
- 該...
- 返回被刪除的數(shù)組
- 參數(shù)
- index：必要參數(shù)
- 規(guī)定 添加/刪除 元素位置
- 使用負數(shù)可以從數(shù)組的尾部開始
//添加元素
- index：必要參數(shù)
var arr = ["a","b","c","d","e"];
var v = arr.splice(1,0,"asd","qwe");
//因為是添加元素，所以返回的v 的長度為0
console.log(v.length);//0
console.log(arr.length);//7
//因為插入位置為1，所以添加在其后面的自動往后挪
//刪除元素
var arr = ["a","b","c","d","e"];
var deleted = arr.splice(1,2);
console.log(deleted);//b,c
console.log(arr); //a,d,e
//替換元素 (用的特別多)
var arr = ["a","b","c","d","e"];
var change = arr.splice(1,1,"bbbb");
console.log(change);
console.log(arr);
- howmany ：必要參數(shù)
- 要刪除的元素
- item：可選參數(shù)
- 替換
## 系統(tǒng)關鍵字
我們可以利用系統(tǒng)的關鍵字來完成對數(shù)組的刪除操作
* delete 刪除元素，數(shù)組長度不會發(fā)生改變
* 只會將對應的數(shù)值進行刪除
* 對應數(shù)值變?yōu)閡ndefined
var arr = [1,2,3,4,5];
console.log(arr);
delet arr[3];
```
console.log(arr.length); //5
console.log(arr[3]); //undefined
console.log(arr); //1,2,3,5
```