首頁 > web前端 > js教程 > 主體

JS—數組

巴扎黑
發布: 2016-12-06 11:20:02
原創
1442 人瀏覽過

數組(Array物件) 
數組是一種物件。數組是值的有序集合。每個值叫做元素(可以是任意型別),每個元素在陣列中都有一個位置,以數字表示,稱為索引(0—232-2)。
一、創建數組 
1.使用數組字面量(直接量) 
var empty=[];//空數組 
var misc=[1.1,true,”a”,[1,{x:1,y: 2}]];//元素類型不同 
var count=[1,,2];//有3個元素,中間省略的值為undefined 
var undefs=[,,];//有2個元素,但也會解析為3個,所以不要這樣做 
2.呼叫建構子Array() 
var a=new Array();//沒有參數,相當於空數組 
var a=new Array(10); //指定長度為10的陣列 
var a=new Array(10,4,”hhhh”);//指定陣列元素,但沒有直接使用字面量方法好 
二、陣列元素的讀取和寫入 
var arr =[1,2,3,4,5]; 
arr[1];//陣列的第一個元素-2 
arr[5]=6;//動態地加(不需要重新定義)第五個元素-6 
delete arr[0];刪除了第一個元素,但此時數組長度仍為6,且第一個元素為undefined 
三、稀疏數組 
稀疏數組即包含從0開始的不連續索引的數組。一般length屬性值比實際元素個數大   
var arr1=[undefined]; 
var arr2=new Array(1);//等同與var arr2=[,]; 
0 in arr1;// 回傳與var arr2=[,]; 
0 in arr1;// 傳回,索引0處有一個元素 
0 in arr2; // 回傳false,索引0處沒有元素 
四、陣列屬性 
length:  arr1.length; 
五、陣列遍歷 
for(var i=0thi六、多維數組 
arr[][] 

//創建一個多維數組 
var table=new Array(10);//表格有10行 
for(var i=0;i    table[i]=new Array(10); //每行有10列 
//初始化數組   
for(var row=0;row

for(var row=0;rowfor(var row=0;rowfor(var row=0;rowfor(var row=0;rowfor(var row=0;rowtable[row][col]=row*col; 

}  
//使用多維數組計算 
var product=table[5][7]; //結果為35  
七、陣列方法  




1.join() 
將陣列中所有元素轉換為字串並連接在一起,傳回字串,可指定分隔符號分隔元素,若不指定預設值用“,”隔開。
var arr=[1,2,3]; 
arr.join();//”1,2,3” 
arr.join(“_”);//”1_2_3” 


2.reverse( ) 
將數組中元素顛倒順序,返回逆序數組,且原始數組被修改 
var arr=[1,2,3]; 
arr.reverse();//[3,2,1] 






3.sort() 
將數組中元素排序,傳回排序後的陣列, 且原始數組被修改。若元素有undefined,則會排到尾部 
arr=[“a”,”c”,”b”]; 
arr.sort();//[“a”,”b”,”c”]若不帶參數呼叫此方法,元素依字母順序排序 

arr=[13,24,51,3]; 
arr.sort() ;//[13,24,3,51] 把數字轉換成字串再比較,每個數字的第一位從小到大排序 

arr.sort(function(a,b){ 
return a-b;//依序,[3,13,24,51] 
})

arr.sort(function(a,b){ 
return b-a;//逆序,[51,24,13,3] 
}) 



4.concat()) 



4.concat()) 組沒有被陣列修改 

var arr=[1,2,3]; 
arr.concat(4,5);//[1,2,3,4,5] 
arr.concat([4,5],6) ;//[1,2,3,4,5,6]參數是數組時,數組會被拉平 
arr.concat(4,[5,[6,7]]);//[1,2, 3,4,5,[6,7]] 參數是數組,數組元素還是數組時,數組不會被拉平兩次 




5.slice() 
返回指定數組的一個片段或子數組,它的兩個參數分別指定了片段的始末位置,一般為左閉右開區間,原數組沒有被修改 

var arr=[1,2,3,4,5]; 
arr.slice(1, 3);//[2,3] 
arr.slice(1);//[2,3,4,5]只有一個參數則把此參數看做起始位置,結束位置是陣列結尾 
arr. slice(1,-1);//[2,3,4]負數表示相對於陣列中最後一個元素的位置,-1表示5這個元素 
arr.slice(-4,-3);//[ 2] 




6.splice() 
在數組中插入或刪除元素,原始數組被修改 

var arr=[1,2,3,4,5] /[3,4,5]刪除了從第二個位置到末尾的元素 
🎜arr.splice(2,2);//[3,4]第二個參數表示刪除元素的個數,即從第二個位置開始刪除兩個元素 🎜🎜arr.splice(1,1,「a」,」b」);//[2]從第一個位置開始刪除一個元素並在此插入」a」和”b” 🎜arr;//[1, “a”,”b”,3,4,5] 🎜🎜🎜🎜7.push()和pop() 🎜將陣列當作堆疊來使用,原數組被修改。
push()在數組尾部添加一至多個元素,返回數組新的長度; 
pop()刪除數組的最後一個元素,減少數組長度,返回刪除的值 

var stack=[]; 
stack. push(1,2);//返回數組長度2 
stack.pop();//返回末尾被刪除的元素2 



8.unshift()和shift() 
unshift()在數組頭部新增一至多個元素,傳回陣列新的長度; 
shift()刪除陣列的第一個元素傳回已刪除的值 

var arr=[]; 
arr.unshift(2);//傳回陣列長度1
arr.unshift(22);//回傳陣列長度2,此時arr=[22,2] 
arr.shift();//傳回頭部刪除的元素22 




9.toString()和toLocaleString() 
toString()將陣列轉換為字串,且用“,”相隔 
toLocaleString()將陣列轉換為字串,且使用本地化分隔符號 

[1,[2,”c”] ].toString()//回傳」1,2,c” 
     




八、ECMAScript5中的陣列方法  
ECMAScript5定義了9個新的陣列方法數組 

1.forEach() 
數組遍歷,參數為函數。可使用3個參數呼叫函數:元素、索引、陣列本身。

var arr=[1,2,3,4,5]; 
var sum=0; 
arr.forEach(function(value){ 
sum+=       
}); 
sum;//15   

arr.forEach(function(v,I,a){ //使用3個參數來呼叫函數:元素、索引、陣列本身 
a[i]=v+1 ; 
}) 



PS:此方法不能像for一樣提前終止遍歷,所以要放在一個try塊中 
function foreach(a,f,t){ 
try{ 
function foreach(a,f,t){ 
try{ 
a.forEachf ,t); 
}catch(e){ 
if(e==foreach.break)return; 
else throw e; 

}                                     

2. map() 
數組映射,原始數組未被修改   

var arr=[1,2,3]; 
arr.map(function(x){ 
return x+10; 
}); ,12,13]   



3.filter() 
數組過濾,原始數組未被修改,返回的數組總是稠密的 

var arr=[1,2,3,4,5,6,74,5,6,7 ,8,9,10]; 
arr.filter(function(x,index){ 
return index%3==0||x>=8; 
});//[1,4,7,8, 9,10]  

4.every()和some() 
數組的邏輯判斷,返回true或false,而且一旦確認應該返回的值就會停止遍歷數組 
every()相當於邏輯“與”,只有所有元素呼叫判斷函數都回傳true,才回傳true 
some()相當於邏輯“或”,至少有一個元素呼叫判斷函數都回傳true,就回傳true  

var arr=[1,2,3,4 ,5]; 
arr.every(function(x){ 
return x});//true 
arr.every(function(x){ 
return x});/false

var arr=[1,2,3,4,5]; 
arr.some(function(x){ 
return x==3; 
});//true 
arr.every(function(x) { 
return x==10; 
});//false 

PS:在空數組上呼叫時。 every()傳回true,some()傳回false 

5.reduce()和reduceRight() 
使用指定函數將陣列元素組合,生產單一值,原始陣列未修改 
reduce()有兩個參數,第一個是執行化簡操作的函數,第二個可選是傳給函數的初始值 
reduceRight()的化簡操作是從右到左,其餘和reduce()一樣 

var arr=[1 ,2,3]; 
var sum=arr.reduce(function(x,y){ 
return x+y; 
},0);//返回6,即由左至右0+1=1,1 +2=3,3+3=6 

var sum=arr.reduceRight(function(x,y){ 
return x+y; 
});//返回6,即由右至左3+2= 5,5+1=6 
6.indexOf()和lastIndexOf() 
數組檢索,返回找到的第一個元素的索引,若無則返回-1 
indexOf()從頭至尾搜尋 
lastIndexOf(indexOf()從頭至尾搜尋 
lastIndexOf()從後來向前搜尋 

var arr=[1,2,3,2,1]; 
arr.indexOf(2);//尋找元素2的索引,返回1 
arr.indexOf(4);//尋找元素4的索引,因為不存在,回傳-1 
arr.indexOf(1,1);//尋找元素1的索引,從第一位開始找,回傳4 🎜arr.indexOf(1,-3);//尋找元素1的索引,從倒數第三位開始找,回傳4 
arr.lastIndexOf(2,-2);//尋找元素2的索引,從倒數第二位開始找,且從後往前找,回傳3 


九、陣列型 
Array.isArray([]);//true 
Array.isArray({});//false ofnce
[]instance
[]instance Array;//true 
({})instanceof Array;//false 

({}).toString.apply([])===”[object Array]”;//true 
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板