Tatasusunan JavaScript



Peranan objek tatasusunan adalah untuk menyimpan satu siri nilai menggunakan nama pembolehubah yang berasingan.


Instance dalam talian

Buat tatasusunan dan tetapkan nilai kepadanya:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<script>
var i;
var mycars = new Array();
mycars[0] = "Saab";
mycars[1] = "Volvo";
mycars[2] = "BMW";
for (i=0;i<mycars.length;i++){
	document.write(mycars[i] + "<br>");
}
</script>

</body>
</html>

Jalankan Instance »

Klik butang "Run Instance" untuk melihat contoh dalam talian

Anda boleh menemui lebih banyak kejadian di bahagian bawah halaman.


Apakah tatasusunan?

Objek tatasusunan menggunakan nama pembolehubah yang berasingan untuk menyimpan satu siri nilai.

Jika anda mempunyai set data (contohnya: nama kereta), terdapat pembolehubah berasingan seperti berikut:

var car1="Saab";
var car2="Volvo";
var car3="BMW";

Namun, bagaimana jika anda ingin mencari kereta tertentu? Dan bukan 3 kereta, tetapi 300 kereta? Ini tidak akan menjadi tugas yang mudah!

Cara terbaik ialah menggunakan tatasusunan.

Suatu tatasusunan boleh menyimpan semua nilai menggunakan nama pembolehubah, dan sebarang nilai boleh diakses menggunakan nama pembolehubah.

Setiap elemen dalam tatasusunan mempunyai ID sendiri supaya ia boleh diakses dengan mudah.


Buat tatasusunan

Terdapat tiga cara untuk mencipta tatasusunan.

Kod berikut mentakrifkan objek tatasusunan bernama myCars:

1: Cara konvensional:

var myCars=new Array(
myCars[0 ]="Saab"; 
myCars[1]="Volvo";
myCars[2]="BMW";

2: Cara mudah:

var myCars=new Array("Saab","Volvo","BMW") ;

3: Literal:

var myCars=["Saab","Volvo","BMW"];


Mengakses Tatasusunan

Anda boleh mengakses elemen tertentu dengan menyatakan nama tatasusunan dan nombor indeks.

Tokoh berikut boleh mengakses nilai pertama tatasusunan myCars:

var name=myCars[0];

Contoh berikut mengubah suai elemen pertama tatasusunan myCars:

myCars[0]="Opel";

lamp[0] 是数组的第一个元素。[1] 是数组的第二个元素。


Dalam tatasusunan anda boleh mempunyai objek yang berbeza

Semua pembolehubah JavaScript ialah objek. Elemen tatasusunan ialah objek. Fungsi ialah objek.

Oleh itu, anda boleh mempunyai jenis pembolehubah yang berbeza dalam tatasusunan.

Anda boleh mengandungi elemen objek, fungsi dan tatasusunan dalam tatasusunan:

myArray[0]=Date.now;
myArray[1]=myFunction;
myArray[2]=myCars;


Kaedah dan sifat tatasusunan

Sifat dan kaedah yang dipratentukan menggunakan objek tatasusunan:

var x=myCars.length // Bilangan elemen dalam myCars
var y=myCars.indexOf("Volvo") // Nilai indeks nilai "Volvo"


Lengkapkan tatasusunan Manual rujukan objek

Anda boleh merujuk tapak ini untuk mendapatkan manual rujukan lengkap tentang semua sifat dan kaedah tatasusunan.

Manual rujukan mengandungi penerangan tentang semua sifat dan kaedah (dan lebih banyak contoh).

Manual Rujukan Objek Tatasusunan Lengkap


Mencipta kaedah baharu

Prototaip ialah pembina global JavaScript. Ia boleh membina sifat dan kaedah objek Javascript baharu.

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮创建一个数组,调用ucase()方法, 并显示结果。</p>
<button onclick="myFunction()">点我</button>
<script>
Array.prototype.myUcase=function(){
	for (i=0;i<this.length;i++){
		this[i]=this[i].toUpperCase();
	}
}
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.myUcase();
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Contoh di atas mencipta kaedah tatasusunan baharu untuk menukar aksara huruf kecil tatasusunan kepada aksara huruf besar.


Examples

Lagi contoh

Gabung dua tatasusunan - concat()

Instance

rreee

Jalankan contoh»

Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Gabungkan tiga tatasusunan - concat()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
	
<script>
var hege = ["Cecilie", "Lone"];
var stale = ["Emil", "Tobias", "Linus"];
var kai = ["Robin"];
var children = hege.concat(stale,kai);
document.write(children);
</script>
	
</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Gunakan Elemen tatasusunan membentuk rentetan - join()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<script>
var parents = ["Jani", "Tove"];
var brothers = ["Stale", "Kai Jim", "Borge"];
var children = ["Cecilie", "Lone"];
var family = parents.concat(brothers, children);
document.write(family);
</script>

</body>
</html>

Run Instance»

Klik Butang "Jalankan Instance" untuk melihat contoh dalam talian

Padam elemen terakhir tatasusunan - pop()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">点击按钮将数组作为字符串输出。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	var x=document.getElementById("demo");
	x.innerHTML=fruits.join();
}
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Tambah elemen baharu pada penghujung tatasusunan - push( )

Instance

rreee

Jalankan Contoh»

Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian

Terbalikkan susunan elemen dalam tatasusunan - reverse()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮删除数组的最后一个元素。</p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	fruits.pop();
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Alih keluar elemen pertama tatasusunan - shift()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮给数组添加新的元素。</p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	fruits.push("Kiwi")
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Jalankan instance »

Klik butang "Jalankan" Contoh" untuk melihat contoh dalam talian

Pilih elemen daripada tatasusunan - slice()

Contoh

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮将数组反转排序。</p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	fruits.reverse();
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Isih tatasusunan (dalam susunan abjad menaik) - sort()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮删除数组的第一个元素。</p>
<button onclick="myFunction()">点我</button>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
function myFunction(){
	fruits.shift();
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat instance dalam talian

Isih berangka (dalam tertib berangka menaik ) - sort()

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">点击按钮截取数组下标 1 到 2 的元素。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
	var citrus = fruits.slice(1,3);
	var x=document.getElementById("demo");
	x.innerHTML=citrus;
}
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

Isih berangka (urutan berangka menurun) - sort()

Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮升序排列数组。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.sort();
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Jalankan instance »

Klik butang "Run Instance" untuk melihat contoh dalam talian

Tambah elemen pada kedudukan ke-2 tatasusunan - sambat ()

Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮升序排列数组。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var points = [40,100,1,5,25,10];
	points.sort(function(a,b){return a-b});
	var x=document.getElementById("demo");
	x.innerHTML=points;
}
</script>

</body>
</html>

Run instance»

Klik butang "Run instance" untuk melihat instance dalam talian

Tukar tatasusunan kepada string-toString()

Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">单击按钮降序排列数组。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var points = [40,100,1,5,25,10];
	points.sort(function(a,b){return b-a});
	var x=document.getElementById("demo");
	x.innerHTML=points;
}
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

Tambah elemen baharu pada permulaan tatasusunan - unshift()

Instance
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="demo">点击按钮向数组添加元素。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
	var fruits = ["Banana", "Orange", "Apple", "Mango"];
	fruits.splice(2,0,"Lemon","Kiwi");
	var x=document.getElementById("demo");
	x.innerHTML=fruits;
}
</script>

</body>
</html>

Jalankan instance »

Klik butang "Run" Contoh" untuk melihat contoh dalam talian


<🎜>