JavaScript Core Object | 陣列物件(Array Object)

陣列物件(Array Object)

Array 物件

兼容性：IE3+、NN2+、Moz1+、Safari1+

arrObj = new Array(em0, ..., emN)
arrObj = new Array(arrLength)

arrObj：陣列物件的名稱
arrLength：欲配置的元素數量
em0 - emN：陣列元素的資料

屬　性	constructor、prototype、length
方　法	concat、join、slice、splice、shift、unshift、pop、push、 reverse、sort、toString

JS 並沒有明確的陣列資料類型。無論如何，在您的應用之中，您可以使用內建的 Array 物件與其方法來操作陣列。

Array 是用來存取陣列的物件。而陣列是一套井然有序的資料被編組在一起，在唯一的變數名稱之下由陣列物件的建構元所建立。

myArr = new Array("元素1","元素2","元素3",…)
索引值	陣列元素
[0] [1] [2] […]	元素1 元素2 元素3 …

陣列的索引值是存取陣列元素的關鍵，使用陣列名和方括號中的索引值就可得到指定陣列位置的內容。

陣列的索引值(索引號)是從 0 開始的，在陣列當中的元素由左至右為元素1、元素2、元素3、…，而其索引值與陣列元素的對應關係為 [0] 代表元素1、[1] 代表元素2、[2] 代表元素3，以此類推。

//範例一
//以下建立了一個名為 colorArr 並且有著四個陣列元素的陣列
var colorArr = new Array("black", "white", "red", "blue");
document.write(colorArr[0]);	//結果顯示為 black
document.write(colorArr[1]);	//結果顯示為 white
document.write(colorArr[2]);	//結果顯示為 red
document.write(colorArr[3]);	//結果顯示為 blue

//範例二
//陣列 colorArr 與 yearsArr 基本上是一樣的道理
var colorArr = new Array("black", "white", "red", "blue");
var yearsArr = new Array();
yearsArr[0] = "2006";			//將字串 2006 指派給索引值(索引編號)為 0 的位置上
yearsArr[1] = "2007";			//將字串 2007 指派給索引值(索引編號)為 1 的位置上
yearsArr[2] = "2008";			//將字串 2008 指派給索引值(索引編號)為 2 的位置上
yearsArr[3] = "2009";			//將字串 2009 指派給索引值(索引編號)為 3 的位置上
for(i = 0;i <4 ;i++) {
	document.write(colorArr[i],yearsArr[i],"<br />");
	}

/* 上述範例結果
   black2006
   white2007
   red2008
   blue2009 */

length 屬性

兼容性：IE3+、NN2+、Moz1+、Safari1+

arrObj.length

arrObj：陣列物件的名稱

length 是用來參考或設定陣列的元素數量。

這個 length 屬性保留了一個無符號的 32 bit 整數來代表陣列的長度，陣列內元素的數量可以單獨的被修改。

var myArr = new Array();
myArr[0] = "A";
myArr[1] = "B";
myArr[2] = "C";
document.write(myArr.length); 	//結果顯示陣列的長度為 3

concat 方法	兼容性：IE4+、NN4+、Moz1+、Safari1+
join 方法	兼容性：IE4+、NN4+、Moz1+、Safari1+
slice 方法	兼容性：IE4+、NN4+、Moz1+、Safari1+
splice 方法	兼容性：IE5.5+、NN4+、Moz1+、Safari1+

arrObj1.concat(arrObj2)
arrObj1.join(char)
arrObj1.slice(start,end)
arrObj1.splice(pointN…,repstr…)

arrObj1：陣列物件的名稱
arrObj2：陣列物件的名稱
char：連接時用來間隔的字元
start：開始的位置
end：結束的位置
pointN：元素的索引編號
repstr：取代的字串

concat()
加入兩個或者更多個陣列物件來組成一個新陣列物件。
join()
用來加入一個我們所指定的分隔符字元到陣列中來分隔所有的陣列元素並組合成一個單一字串。
slice()
從陣列中依我們所選擇的元素來組成一個新陣列。
splice()
用來增加或移除陣列當中的元素。

x = new Array("Tom","John","David","Joe");
y = new Array("Black","White","Yellow","Navy");

document.write(x.concat(y) + "<br />");
//合併 x 與 y 陣列
//結果顯示 Tom,John,David,Joe,Black,White,Yellow,Navy

document.write(x.join("-") + "<br />");
//將 x 陣列中的元素以 - 號相互連接成一個字串
//結果顯示 Tom-John-David-Joe

document.write(x.slice(1,2) + "<br />");
//取出 x 陣列中索引編號 1(開始) 到 2(結束並且不取) 的元素
//結果顯示 John

x.splice(1,2,"xxx", "xyz");
// x 陣列中的索引編號 1 到 2 之間的元素被 xxx 與 xyz 取代
document.write(x);
//結果顯示 Tom,xxx,xyz,Joe

shift 方法	兼容性：IE5.5+、NN4+、Moz1+、Safari1+
unshift 方法	兼容性：IE5.5+、NN4+、Moz1+、Safari1+

arrObj.shift()
arrObj.unshift(elementData)

arrObj：陣列物件的名稱
elementData：欲加進陣列的元素內容

shift() 是用來移除陣列最前面的元素；在移除之後，剩下的每個元素皆會向前進一位。

unshift() 則是用來於陣列最前面加入新的元素，而原先的元素則會向後移一位。

myArr = new Array("Tom","John","David","Joe");
	document.write("原始陣列中的元素： " + myArr + "<br />");
myArr.shift();
	document.write("刪除最前面的元素： " + myArr + "<br />");
myArr.unshift("Hank");
	document.write("最前面加入新元素： " + myArr);

/* 上述範例結果
   原始陣列中的元素： Tom,John,David,Joe
   刪除最前面的元素： John,David,Joe
   最前面加入新元素： Hank,John,David,Joe */

pop 方法	兼容性：IE5.5+、NN4+、Moz1+、Safari1+
push 方法	兼容性：IE5.5+、NN4+、Moz1+、Safari1+

arrObj.pop()
arrObj.push(elementData)

arrObj：陣列物件的名稱
elementData：欲加進陣列的元素內容

pop() 是用來取出在陣列中最後面的元素，在取得資料後則會從陣列中將該元素刪除。

push() 則是可在陣列最後面加入新的元素。

//範例一
myArr = new Array("Tom","John","David","Joe");
	document.write("原始陣列中的元素： " + myArr + "<br />");
	document.write("取出最後面的元素： " + myArr.pop() + "<br />");
	document.write("新陣列當中的元素： " + myArr);

/* 上述範例結果
   原始陣列中的元素： Tom,John,David,Joe
   取出最後面的元素： Joe
   新陣列當中的元素： Tom,John,David */

//範例二
myArr = new Array("Black","White","blue");
	document.write("原始陣列中的元素： " + myArr + "<br />");
myArr.push("Red");
	document.write("在陣列加入新元素： Red" + "<br />");
	document.write("新陣列當中的元素： " + myArr);

/* 上述範例結果
   原始陣列中的元素： Black,White,blue
   在陣列加入新元素： Red
   新陣列當中的元素： Black,White,blue,Red */

reverse 方法	兼容性：IE4+、NN3+、Moz1+、Safari1+
sort 方法	兼容性：IE4+、NN3+、Moz1+、Safari1+

arrObj.reverse()
arrObj.sort(orderfunc)

arrObj：陣列物件的名稱
orderfunc：排序的方式(省略時是以字母來排序)

reverse() 是用來將陣列中的元素反轉後排列。

sort() 則是可以指定排序的方法來排列。

myArr = new Array("Tom","John","2005","David","Joe");
	document.write("原始陣列中的排列： " + myArr + "<br />");
	document.write("反轉後陣列的排列： " + myArr.reverse() + "<br />");
	document.write("依字母順序的排列： " + myArr.sort());

/* 上述範例結果
   原始陣列中的排列： Tom,John,2005,David,Joe
   反轉後陣列的排列： Joe,David,2005,John,Tom
   依字母順序的排列： 2005,David,Joe,John,Tom */

toString 方法

兼容性：IE4+、NN3+、Moz1+、Safari1+

arrObj.toString()

arrObj：陣列物件的名稱

toString() 是用來將陣列元素轉換成字串。

myArr = new Array("A","B","C","D","E");
myStr = myArr.toString();
	document.write("原來陣列內的內容： " + myArr + "<br />");
	document.write("轉換後字串的內容： " + myStr + "<br />");
	document.write("轉換後字串的長度： " + myStr.length);

/* 上述範例結果
   原來陣列內的內容： A,B,C,D,E
   轉換後字串的內容： A,B,C,D,E
   轉換後字串的長度： 9  */

我的普立茲

JavaScript Core Object | 陣列物件(Array Object)

陣列物件(Array Object)