javascript數組的基本使用方法


1.數組有這樣幾種方式來創建

var array = new Array();

var array = new Array()10;//指定長度

var array = new Array(“one”,”two”,”three”);

常用方法有這些:

concat()---連接兩個或更多的數組,並返回結果
join()---把數組的所有元素放入一個字符串,元素通過指定的分隔符進行分割
pop()---刪除並返回數組的最后一個元素
push()---向數組的末尾添加一個或更多元素,並返回新的長度
reverse()---顛倒數組中元素的順序
shift()---刪除並返回數組的第一個元素
slice()---從某個已有的數組返回選定的元素
sort()---對數組的元素進行排序
splice()---刪除數組,並向數組添加新元素
unshift()---向數組開頭添加一個或更多元素,並返回新的長度
valueOf()---返回數組對象的原始值

下面我們通過一些實際的例子來說明數組的使用(主要方法的使用):

var array = [];

array.push(1);

array.push(2);

array.push(“three”);

array.push(“four”);

array.push(3.14);

push方法可以向數組中添加元素。

Javascript數組沒用數據類型的限制,可以向數組里添加任何類型的元素

var len = array.length;//獲取數組的長度

for(var i = 0; i < len; i++){

alert(typeof arrayp[i]);

}

結果為:

number

number

string

string

number

彈出數組中的元素:

for(var i = 0; i < len; i++){

alert(array.pop());

}
alert(array.length);

運行結果如下,注意最后0是指array的長度,因為這時數組的內容已經全部彈出:

3.14

four

three

2

1

0

join:連接數組元素為一個字符串

array = ["one","two","three","four","five"]

var str1 = array.join("|");

var str2= array.join(",");
運行結果:

one|two|three|four|five

one,two,three,four,five

連接多個數組為一個數組:

var anthor = [1,2,3,4];

var anthor2 = [5,6,7,8];

var newArray = array.concat(anthor,anthor2);
結果為:

one,two,three,four,five,1,2,3,4,5,6,7,8

從數組中取出一定數量的元素,不影響數組本身:

alert(newArray.slice(5,9);

結果為:

1,2,3,4

slice方法的第一個參數為起始位置,第二個參數為終止位置,操作不影響數組本身。

下面我們來看splice方法,雖然這兩個方法拼寫非常相似,但功能完全不同,splice是一個相當難用的方法:

newArray.splice(5,2);

newArray.splice(5,0,”haha”,”hehe”,”heihei”);

第一行代碼表示,從newArray數組中,從第5個元素起,刪除2個元素,而第二行代碼則表示,從第5個元素起,刪除0個元素,並且把隨后的所有參數插入到從第5個開始的位置。

我們再來討論下數組的排序,Javascript數組的排序函數sort,將數組按字母順序排序,排序過程會影響源數組,比如:

var array = ["cisio","borland","apple","dell"]
alert(array);
array.sort();
alert(array);
執行結果為:
cisio,borland,apple,dell
apple,borland,cisio,dell
這些字母排序的方式會造成一些非你所預想的小bug,比如:
var array = [10,23,44,58,106,235];
array.sort();
alert(array);
得到的結果為:
10,106,23,235,44,58
可以看出,javascript中的sort不關注數組中的內容是字母還是數字,它僅僅是按照字母的字典序來進行排序,對於這種情況,Javascript提供了另一種途徑,通過給sort傳遞一個函數對象,按照這個函數提供的規則對數組進行排序。
function sorter(a,b){
	return a - b;
}
var array = [10,23,44,58,106,235];
array.sort(sorter);
alert(array);
函數sorter接受兩個參數,返回一個數值,如果這個值大於0,則說明第一個參數大於第二個參數,如果返回值為0,則說明兩個參數相等,返回值小於0,則第一個參數小於第二個參數,sort根據這個返回值來進行最終排序:
則運行結果是:
10,23,44,58,106,235
當然,也可以簡寫成這樣:
 
 
 
         
array.sort(function(a,b){return a - b});//正序
array.sort(function(a,b){return b - a});//逆序
 
刪除數組元素:
雖然令人費解,但是Javascript的數組對象確實沒有一個叫做delete或remove的方法,這就需要我們自己擴展其數組對象。通常,我們可以擴展javascript解釋器環境中的內置對象,這中方式的好處在於,擴張之后的對象可以適用於其后的任意場景,而不用每次都顯示的聲明;而這種做法的壞處在於,修改了內置對象,則可能出現一些難以預料的錯誤,比如遍歷數組的時候,可能會產生令人費解的異常。
數組中的每個元素都是一個對象,那么,我們可以使用delete來刪除元素嗎?來看看下面的小例子吧:
 
 
 
         
var array = ["one","two","three","four","five"];
alert(array.length);
delete array[2];
alert(array);
alert(array.length);
然后我們看看運行之后的結果是怎樣的:
 
 
 
         
5
one,two,undefine,four,five
5
可以看出,delete只是將數組array的第三個位置上的元素刪掉了,可是數組的長度卻沒有改變,顯然不是我們想要的結果,不過我們可以借助數組自身的slice方法來做到。
一個比較好的實現,來自於jquery的設計中John Resig:
 
 
 
         
Array.prototype.remove = function(from, to){
	var rest = this.slice((to || from) + 1 || this.length);
	this.length = from < 0 ? this.length + from : from;
	return this.push.apply(this,rest);
}
這個函數擴展了Javascript的內置對象Array,這樣,我們以后的所有聲明的數組都會自動擁有這個remove功能,我們來看看這個方法的用法:
 
 
 
         
var array = ["one","two","three","four","five","six"];
alert(array);
array.remove(0);//刪除第一個元素
alert(array);
array.remove(-1);//刪除倒數第一個元素
alert(array);
array.remove(0,2);//刪除數組中下標為0-2的元素(3個)
alert(array);
得到下面的結果:
 
 
 
         
one,two,three,four,five,six
two,three,four,five,six
two,three,four,five
five
也就是說,remove接受兩個參數,第一個參數為起始下標,第二個參數為結束下標,其中第二個參數可以忽略,這種情況下會刪除指定下標的元素。
當然,不是每個人都希望影響整個原型鏈(下面有介紹)此可以考慮另一種方式:
 
 
 
         
Array.remove = function(array,from, to){
	var rest = array.slice((to || from) + 1 || array.length);
	array.length = from < 0 ? array.length + from : from;
	return array.push.apply(array.rest);
}
其操作方式與前者無二異,但是不影響全局對象,代價是你需要顯示的傳遞需要操作的數組作為第一個參數:
 
 
 
         
 
 
 
 
         
var array = ["one","two","three","four","five","six"];
Array.remove(array,0,2);//刪除0,1,2三個元素
alert(array);
這種方式相當於給Javascrip內置的Array添加了一個靜態方法.
 
遍歷數組:
1.for…in 循環
 
 
 
         
var array = [1,2,3,4];
for(var item in array){
	alert(array[item]);
}
將會打印:
 
 
 
         
1
2
3
4
但是這種方式並不總是有效,比如我們擴張了內置對象Array,如下:
 
 
 
         
Array.prototype.useless = function(){}
然后重復執行上面的代碼,會得到這樣的輸出結果:
 
 
 
         
1
2
3
4
function(){}
設想這樣一種情況,如果你對數組的遍歷做sum操作,那么會得到一個莫名其妙的錯誤,畢竟函數對象不能做求和操作。幸運的是,我們可以使用另一種方式來取得正確的結果:
 
 
 
         
for(var i = 0; i < array.length; i++){
	alert(array[i]);
}
這種for循環如其他很多語言中的寫法一致,重要的是,它不會訪問那些下標不是數字的元素,如上例的function,這個function的下標為useless,是一個字符串。從這個例子中可以看出,除非必要,盡量不要去擴展全局對象,因為對全局對象的擴展會造成所有繼承鏈上都帶上“烙印”,而有時候這些烙印會成為滋生bug的溫床。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM