Rumah > hujung hadapan web > tutorial js > Tatasusunan JavaScript

Tatasusunan JavaScript

王林
Lepaskan: 2024-08-02 09:35:47
asal
729 orang telah melayarinya

JavaScript Arrays

Apakah tatasusunan?

Tatasusunan ialah struktur data yang menyimpan koleksi tertib elemen. Dalam JavaScript, tatasusunan dikelaskan sebagai jenis objek khas dan boleh menyimpan nombor, rentetan, objek atau tatasusunan lain. Elemen dalam tatasusunan disertakan dalam kurungan segi empat sama [ ] dan menggunakan indeks berasaskan sifar. Indeks berasaskan sifar bermakna elemen pertama tatasusunan akan mempunyai indeks 0, elemen kedua akan mempunyai indeks 1 dan seterusnya.

const names = ["David", "Hannah", "William"];
console.log(names[0]); // returns the first element
// returns "David"
console.log(names[1]); // returns the second element
// returns "Hannah"
console.log(names[2]); // returns the third element
// returns "William"
Salin selepas log masuk

Bagaimana tatasusunan boleh diubah suai atau dimanipulasi?

Indeks Unsur dalam Tatasusunan

Elemen baharu boleh ditambah pada tatasusunan dengan memberikan nilai kepada indeks kosong.

names[3] = "Eric";
console.log(names);
// returns ["David", "Hannah", "William", "Eric"]
Salin selepas log masuk

Elemen dalam tatasusunan boleh diubah suai dengan menetapkan semula nilai baharu kepada indeks sedia ada.

names[1] = "Juniper";
console.log(names);
// returns ["David", "Juniper", "William", "Eric"]
Salin selepas log masuk

Kaedah Tatasusunan

Tatasusunan juga boleh diubah suai atau dimanipulasi dengan kaedah tatasusunan seperti 'push', 'pop', 'unshift', 'shift', 'slice' dan 'splice'.

'tolak()'

Kaedah 'push' mengambil satu atau lebih elemen sebagai argumen, menambahkan elemen pada penghujung tatasusunan dan mengembalikan panjang tatasusunan yang diubah suai.

names.push("Bob");
// returns 5 
console.log(names);
// returns ["David", "Juniper", "William", "Eric", "Bob"]
Salin selepas log masuk

'pop()'

Kaedah 'pop' tidak mengambil argumen, mengalih keluar elemen terakhir tatasusunan dan mengembalikan elemen yang dialih keluar.

names.pop();
// returns "Bob"
console.log(names);
// returns ["David", "Juniper", "William", "Eric"]
Salin selepas log masuk

'unshift()'

Kaedah 'unshift' mengambil satu atau lebih elemen sebagai argumen, menambahkan elemen pada permulaan tatasusunan dan mengembalikan panjang tatasusunan yang diubah suai.

names.unshift("Jack", "Jane");
// returns 6
console.log(names);
// returns ["Jack", "Jane", "David", "Juniper", "William", "Eric"]
Salin selepas log masuk

'shift()'

Kaedah 'shift' tidak mengambil argumen, mengalih keluar elemen pertama tatasusunan dan mengembalikan elemen yang dialih keluar.

names.shift();
// returns "Jack"
console.log(names);
// returns ["Jane", "David", "Juniper", "William", "Eric"]
Salin selepas log masuk

'slice()'

Kaedah 'slice' mengambil dua argumen pilihan (startIndex, endIndex) dan mengembalikan tatasusunan baharu dengan elemen daripada startIndex kepada, tetapi tidak termasuk, endIndex tatasusunan asal.
Jika startIndex diabaikan, 0 digunakan.
Jika endIndex ditinggalkan, panjang tatasusunan digunakan. Nombor indeks negatif boleh digunakan untuk mengira kembali dari penghujung tatasusunan.

names.slice(1, 3);
// returns ["David", "Juniper"]
names.slice(3);
// returns ["Juniper", "William", "Eric"]
names.slice(-2, 1);
// returns ["William", "Eric", "Jane"]
names.slice();
// returns ["Jane", "David", "Juniper", "William", "Eric"]
Salin selepas log masuk

'splice()'

Kaedah 'splice' mengambil satu atau lebih argumen (startIndex, deleteCount, element1, element2, ...) dan mengembalikan tatasusunan baharu yang mengandungi semua elemen yang dialih keluar. Dari startIndex, bilangan deleteCount elemen dipadamkan dan hujah elemen berikut akan ditambahkan pada tatasusunan bermula dari startIndex. Jika deleteCount diabaikan, semua elemen dari startIndex hingga akhir tatasusunan akan dipadamkan. Jika hujah unsur ditinggalkan, tiada unsur ditambahkan.

names.splice(0, 1, "Joe", "Alex"); 
// returns ["Jane"]
console.log(names);
// returns ["Joe", "Alex", "David", "Juniper", "William", "Eric"]
names.splice(1, 4);
// returns ["Alex", "David", "Juniper", "William"]
console.log(names);
// returns ["Joe", "Eric"]
names.splice(0, 0, "Bob", "Frank", "Maria")
// returns []
console.log(names);
// returns ["Joe", "Bob", "Frank", "Maria", "Eric"]
Salin selepas log masuk

Memandangkan 'push', 'pop', 'unshift', 'shift, dan 'splice' mengubah suai tatasusunan asal, ia diklasifikasikan sebagai kaedah yang merosakkan. Kaedah 'slice' membiarkan tatasusunan asal tetap utuh, jadi ia diklasifikasikan sebagai tidak merosakkan.

Operator Spread '...'

Untuk menambah elemen atau menyalin tatasusunan tanpa merosakkan, pengendali hamparan boleh digunakan. Operator spread menyebarkan tatasusunan ke dalam elemennya.

const array = [1, 2, 3];
const newArray = [0, ...array, 4, 5];
// ...array spreads [1, 2, 3] into 1, 2, 3
console.log(newArray);
// returns [1, 2, 3, 4, 5]
Salin selepas log masuk

Tanpa operator hamparan, tatasusunan asal akan bersarang dalam tatasusunan baharu.

const array = [1, 2, 3];
const newArray = [0, array, 4, 5];
console.log(newArray);
// returns [0, [1, 2, 3], 4, 5];
Salin selepas log masuk

Kaedah Tatasusunan Berulang

Kaedah tatasusunan berulang memanggil fungsi yang disediakan pada setiap elemen dalam tatasusunan dan mengembalikan nilai atau tatasusunan baharu. Fungsi yang disediakan dipanggil dengan tiga argumen: elemen semasa, indeks elemen semasa dan tatasusunan asal yang kaedah dipanggil.

function callbackFunction (currentElement, currentIndex, originalArray) {
// function body
}
Salin selepas log masuk

Beberapa contoh kaedah tatasusunan berulang ialah: 'cari', 'penapis', 'peta' dan 'kurangkan'.

'cari()'

Kaedah 'cari' mengambil fungsi sebagai hujah dan mengembalikan elemen pertama dalam tatasusunan yang memenuhi syarat fungsi.

const numbers = [5, 10, 15, 20, 25];
numbers.find(number => number > 15);
// returns 20;
Salin selepas log masuk

'penapis()'

Kaedah 'penapis' adalah serupa dengan kaedah 'cari', tetapi sebaliknya mengembalikan tatasusunan semua elemen yang memenuhi syarat fungsi yang diberikan.

const numbers = [5, 10, 15, 20, 25];
numbers.filter(number => number > 15);
// returns [20, 25];
Salin selepas log masuk

'peta()'

Kaedah 'peta' mengembalikan tatasusunan baharu dengan hasil panggilan fungsi pada setiap elemen dalam tatasusunan asal.

const numbers = [1, 2, 3, 4, 5];
numbers.map(number => number * number);
// returns [1, 4, 9, 16, 25]
Salin selepas log masuk

'kurangkan()'

Kaedah 'kurangkan' mengambil fungsi dan nilai awal sebagai hujah. Fungsi yang disediakan menerima empat argumen: penumpuk, nilai semasa, indeks semasa dan tatasusunan asal. Nilai awal yang diberikan ialah nilai penumpuk untuk elemen pertama tatasusunan. Hasil daripada fungsi untuk setiap elemen digunakan sebagai nilai penumpuk untuk elemen seterusnya dalam tatasusunan. Jika nilai awal tidak diberikan, penumpuk ditetapkan kepada elemen pertama tatasusunan dan fungsi panggil balik dipanggil bermula dari elemen kedua.

const numbers = [1, 2, 3, 4, 5]
numbers.reduce(((acc, number) => acc + number), 0);
// returns 15
Salin selepas log masuk

Atas ialah kandungan terperinci Tatasusunan JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan