Rumah > hujung hadapan web > tutorial js > Panduan untuk Menguasai Tatasusunan JavaScript

Panduan untuk Menguasai Tatasusunan JavaScript

WBOY
Lepaskan: 2024-07-19 16:34:11
asal
991 orang telah melayarinya

A Guide to Master JavaScript Arrays

Array ialah salah satu struktur data yang paling biasa digunakan dalam JavaScript. Ia membolehkan anda menyimpan berbilang nilai dalam satu pembolehubah dan dilengkapi dengan set kaya fungsi terbina dalam yang menjadikan memanipulasi dan bekerja dengan data menjadi mudah dan cekap. Dalam artikel ini, kami akan meneroka fungsi tatasusunan JavaScript secara terperinci, memberikan penjelasan, contoh dan ulasan untuk membantu anda menguasainya.

Pengenalan kepada Tatasusunan dalam JavaScript

Suatu tatasusunan ialah koleksi tertib item yang boleh menyimpan jenis data yang berbeza, termasuk nombor, rentetan, objek dan juga tatasusunan lain.

let fruits = ["Apple", "Banana", "Cherry"];
let numbers = [1, 2, 3, 4, 5];
let mixed = [1, "Apple", true, {name: "John"}, [1, 2, 3]];
Salin selepas log masuk

Mencipta Tatasusunan

Tatasusunan boleh dibuat menggunakan literal tatasusunan atau pembina Tatasusunan.

let arr1 = [1, 2, 3];
let arr2 = new Array(1, 2, 3);
console.log(arr1); // Output: [1, 2, 3]
console.log(arr2); // Output: [1, 2, 3]
Salin selepas log masuk

Hartanah Tatasusunan

  • panjang: Mengembalikan bilangan elemen dalam tatasusunan.
let arr = [1, 2, 3, 4, 5];
console.log(arr.length); // Output: 5
Salin selepas log masuk

Kaedah Tatasusunan

1. tolak()

Menambah satu atau lebih elemen pada penghujung tatasusunan dan mengembalikan panjang baharu.

let arr = [1, 2, 3];
arr.push(4);
console.log(arr); // Output: [1, 2, 3, 4]
Salin selepas log masuk

2. pop()

Mengalih keluar elemen terakhir daripada tatasusunan dan mengembalikan elemen itu.

let arr = [1, 2, 3];
let last = arr.pop();
console.log(arr); // Output: [1, 2, 3]
console.log(last); // Output: 3
Salin selepas log masuk

3. shift()

Mengalih keluar elemen pertama daripada tatasusunan dan mengembalikan elemen itu.

let arr = [1, 2, 3];
let first = arr.shift();
console.log(arr); // Output: [2, 3]
console.log(first); // Output: 1
Salin selepas log masuk

4. unshift()

Menambah satu atau lebih elemen pada permulaan tatasusunan dan mengembalikan panjang baharu.

let arr = [2, 3];
arr.unshift(1);
console.log(arr); // Output: [1, 2, 3]
Salin selepas log masuk

5. concat()

Menggabungkan dua atau lebih tatasusunan dan mengembalikan tatasusunan baharu.

let arr1 = [1, 2];
let arr2 = [3, 4];
let merged = arr1.concat(arr2);
console.log(merged); // Output: [1, 2, 3, 4]
Salin selepas log masuk

6. sertai()

Menyertai semua elemen tatasusunan ke dalam rentetan.

let arr = [1, 2, 3];
let str = arr.join("-");
console.log(str); // Output: "1-2-3"
Salin selepas log masuk

7. terbalik()

Menterbalikkan susunan unsur dalam tatasusunan.

let arr = [1, 2, 3];
arr.reverse();
console.log(arr); // Output: [3, 2, 1]
Salin selepas log masuk

8. slice()

Mengembalikan salinan cetek sebahagian tatasusunan ke dalam objek tatasusunan baharu.

let arr = [1, 2, 3, 4, 5];
let sliced = arr.slice(1, 3);
console.log(sliced); // Output: [2, 3]
Salin selepas log masuk

9. sambung()

Menukar kandungan tatasusunan dengan mengalih keluar, menggantikan atau menambah elemen.

let arr = [1, 2, 3, 4, 5];
arr.splice(1, 2, "a", "b");
console.log(arr); // Output: [1, "a", "b", 4, 5]
Salin selepas log masuk

10. sort()

Isih elemen tatasusunan pada tempatnya dan mengembalikan tatasusunan yang diisih.

let arr = [3, 1, 4, 1, 5, 9];
arr.sort((a, b) => a - b);
console.log(arr); // Output: [1, 1, 3, 4, 5, 9]
Salin selepas log masuk

11. penapis()

Mencipta tatasusunan baharu dengan semua elemen yang lulus ujian yang dilaksanakan oleh fungsi yang disediakan.

let arr = [1, 2, 3, 4, 5];
let filtered = arr.filter(x => x > 2);
console.log(filtered); // Output: [3, 4, 5]
Salin selepas log masuk

12. peta()

Mencipta tatasusunan baharu dengan hasil panggilan fungsi yang disediakan pada setiap elemen dalam tatasusunan panggilan.

let arr = [1, 2, 3];
let mapped = arr.map(x => x * 2);
console.log(mapped); // Output: [2, 4, 6]
Salin selepas log masuk

13. mengurangkan()

Menggunakan fungsi terhadap penumpuk dan setiap elemen dalam tatasusunan untuk mengurangkannya kepada satu nilai.

let arr = [1, 2, 3, 4];
let sum = arr.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // Output: 10
Salin selepas log masuk

14. cari()

Mengembalikan nilai elemen pertama dalam tatasusunan yang memenuhi fungsi ujian yang disediakan.

let arr = [1, 2, 3, 4, 5];
let found = arr.find(x => x > 3);
console.log(found); // Output: 4
Salin selepas log masuk

15. findIndex()

Mengembalikan indeks elemen pertama dalam tatasusunan yang memenuhi fungsi ujian yang disediakan.

let arr = [1, 2, 3, 4, 5];
let index = arr.findIndex(x => x > 3);
console.log(index); // Output: 3
Salin selepas log masuk

16. setiap()

Menguji sama ada semua elemen dalam tatasusunan lulus ujian yang dilaksanakan oleh fungsi yang disediakan.

let arr = [1, 2, 3, 4, 5];
let allBelowTen = arr.every(x => x < 10);
console.log(allBelowTen); // Output: true
Salin selepas log masuk

17. beberapa()

Menguji sama ada sekurang-kurangnya satu elemen dalam tatasusunan melepasi ujian yang dilaksanakan oleh fungsi yang disediakan.

let arr = [1, 2, 3, 4, 5];
let anyAboveThree = arr.some(x => x > 3);
console.log(anyAboveThree); // Output: true
Salin selepas log masuk

18. termasuk()

Menentukan sama ada tatasusunan termasuk nilai tertentu antara entrinya.

let arr = [1, 2, 3, 4, 5];
let hasThree = arr.includes(3);
console.log(hasThree); // Output: true
Salin selepas log masuk

19. indexOf()

Mengembalikan indeks pertama di mana elemen tertentu boleh ditemui dalam tatasusunan, atau -1 jika ia tidak hadir.

let arr = [1, 2, 3, 4, 5];
let index = arr.indexOf(3);
console.log(index); // Output: 2
Salin selepas log masuk

20. lastIndexOf()

Mengembalikan indeks terakhir di mana elemen tertentu boleh ditemui dalam tatasusunan, atau -1 jika ia tidak hadir.

let arr = [1, 2, 3, 4, 5, 3];
let index = arr.lastIndexOf(3);
console.log(index); // Output: 5
Salin selepas log masuk

21. rata()

Mencipta tatasusunan baharu dengan semua elemen subtatasusunan digabungkan ke dalamnya secara rekursif sehingga kedalaman yang ditentukan.

let arr = [1, [2, [3, [4]]]];
let flattened = arr.flat(2);
console.log(flattened); // Output: [1, 2, 3, [4]]
Salin selepas log masuk

22. flatMap()

Mula-mula memetakan setiap elemen menggunakan fungsi pemetaan, kemudian ratakan hasilnya menjadi tatasusunan baharu.

let arr = [1, 2, 3];
let flatMapped = arr.flatMap(x => [x, x * 2]);
console.log(flatMapped); // Output: [1, 2, 2, 4, 3, 6]
Salin selepas log masuk

23. daripada()

Mencipta contoh tatasusunan baru yang disalin cetek daripada objek seperti tatasusunan atau boleh lelar.

let str = "Hello";
let arr = Array.from(str);
console.log(arr); // Output: ["H", "e", "l", "l", "o"]
Salin selepas log masuk

24. isArray()

Menentukan sama ada nilai yang dihantar ialah Tatasusunan.

console.log(Array.isArray([1, 2, 3])); // Output: true
console.log(Array.isArray("Hello")); // Output: false
Salin selepas log masuk

25. daripada()

Mencipta

contoh Tatasusunan baharu dengan bilangan argumen yang berubah-ubah, tanpa mengira bilangan atau jenis argumen.

let arr = Array.of(1, 2, 3);
console.log(arr); // Output: [1, 2, 3]
Salin selepas log masuk

Practical Examples

Example 1: Removing Duplicates from an Array

let arr = [1, 2, 3, 3, 4, 4, 5];
let unique = [...new Set(arr)];
console.log(unique); // Output: [1, 2, 3, 4, 5]
Salin selepas log masuk

Example 2: Summing All Values in an Array

let arr = [1, 2, 3, 4, 5];
let sum = arr.reduce((acc, curr) => acc + curr, 0);
console.log(sum); // Output: 15
Salin selepas log masuk

Example 3: Flattening a Deeply Nested Array

let arr = [1, [2, [3, [4, [5]]]]];
let flattened = arr.flat(Infinity);
console.log(flattened); // Output: [1, 2, 3, 4, 5]
Salin selepas log masuk

Example 4: Finding the Maximum Value in an Array

let arr = [1, 2, 3, 4, 5];
let max = Math.max(...arr);
console.log(max); // Output: 5
Salin selepas log masuk

Example 5: Creating an Array of Key-Value Pairs

let obj = { a: 1, b: 2, c: 3 };
let entries = Object.entries(obj);
console.log(entries); // Output: [["a", 1], ["b", 2], ["c", 3]]
Salin selepas log masuk

Conclusion

Arrays are an essential part of JavaScript, providing a powerful way to manage collections of data. By mastering array functions, you can perform complex data manipulations with ease and write more efficient and readable code. This comprehensive guide has covered the most important array functions in JavaScript, complete with detailed examples and explanations. Practice using these functions and experiment with different use cases to deepen your understanding and enhance your coding skills.

Atas ialah kandungan terperinci Panduan untuk Menguasai 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