kaedah tatasusunan paling popular dalam JavaScript yang anda tidak mahu ketinggalan!

Panduan ini meneroka empat belas kaedah tatasusunan JavaScript yang sangat diperlukan. Kami akan menggariskan setiap kaedah dan menggambarkan penggunaannya dengan contoh.

1. map(): Mengubah setiap elemen tatasusunan dan mengembalikan tatasusunan baharu dengan hasilnya. Tatasusunan asal kekal tidak berubah.

const numbers = [1, 2, 3];
const doubled = numbers.map(x => x * 2); // [2, 4, 6]
const users = [{ name: 'John' }, { name: 'Jane' }];
const names = users.map(user => user.name); // ['John', 'Jane']

2. filter(): Mencipta tatasusunan baharu yang mengandungi hanya elemen yang melepasi fungsi ujian yang disediakan. Tatasusunan asal tidak disentuh.

const nums = [1, 2, 3, 4, 5, 6];
const evenNums = nums.filter(n => n % 2 === 0); // [2, 4, 6]
const products = [{ price: 10 }, { price: 20 }];
const expensive = products.filter(p => p.price > 15); // [{ price: 20 }]

3. reduce(): Menggunakan fungsi secara kumulatif pada elemen tatasusunan untuk mengurangkannya kepada satu nilai. Anggap ia sebagai menggabungkan elemen secara berulang.

const sum = [1, 2, 3].reduce((acc, curr) => acc + curr, 0); // 6
const cart = [{ price: 10 }, { price: 20 }];
const total = cart.reduce((sum, item) => sum + item.price, 0); // 30

4. forEach(): Melaksanakan fungsi yang disediakan sekali untuk setiap elemen tatasusunan. Ia tidak mengembalikan nilai (mengembalikan undefined).

[1, 2, 3].forEach(n => console.log(n));
['a', 'b'].forEach((item, index) => console.log(`${index}: ${item}`));

5. find(): Mengembalikan elemen pertama yang memenuhi fungsi ujian yang disediakan. Jika tiada unsur yang memenuhi syarat, ia akan mengembalikan undefined.

const users2 = [{ id: 1, name: 'John' }, { id: 2, name: 'Jane' }];
const john = users2.find(user => user.name === 'John'); // { id: 1, name: 'John' }
const nums2 = [1, 2, 3, 4];
const firstEven = nums2.find(n => n % 2 === 0); // 2

6. findIndex(): Mengembalikan indeks elemen pertama yang memenuhi fungsi ujian yang disediakan. Mengembalikan -1 jika tiada unsur yang memenuhi syarat.

const fruits = ['apple', 'banana', 'cherry'];
const bananaIndex = fruits.findIndex(f => f === 'banana'); // 1
const userIndex = users2.findIndex(u => u.id === 2); // 1

7. some(): Menguji sama ada sekurang-kurangnya satu elemen dalam tatasusunan melepasi ujian yang dilaksanakan oleh fungsi yang disediakan. Mengembalikan true jika sekurang-kurangnya satu elemen melepasi, jika tidak false.

const hasEven = [1, 2, 3].some(n => n % 2 === 0); // true
const hasExpensive = products.some(p => p.price > 15); // true

8. every(): Menguji sama ada semua elemen dalam tatasusunan lulus ujian yang dilaksanakan oleh fungsi yang disediakan. Mengembalikan true hanya jika semua elemen melepasi, jika tidak false.

const allPositive = [1, 2, 3].every(n => n > 0); // true

9. includes(): Menentukan sama ada tatasusunan termasuk nilai tertentu antara entrinya, mengembalikan true atau false mengikut kesesuaian.

const numbers2 = [1, 2, 3];
const hasTwo = numbers2.includes(2); // true
const hasZero = numbers2.includes(0); // false

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

const colors = ['red', 'blue', 'green'];
const blueIndex = colors.indexOf('blue'); // 1
const yellowIndex = colors.indexOf('yellow'); // -1

11. slice(): Mengekstrak bahagian tatasusunan dan mengembalikannya sebagai tatasusunan baharu, tanpa mengubah suai yang asal.

const arr = [1, 2, 3, 4, 5];
const middle = arr.slice(1, 4); // [2, 3, 4]
const last = arr.slice(-2); // [4, 5]

12. splice(): Mengubah kandungan tatasusunan dengan mengalih keluar atau menggantikan elemen sedia ada dan/atau menambah elemen baharu pada tempatnya. Mengubah suai tatasusunan asal.

const months = ['Jan', 'March', 'April'];
months.splice(1, 0, 'Feb'); // ['Jan', 'Feb', 'March', 'April']
months.splice(2, 1); // ['Jan', 'Feb', 'April']

13. sort(): Isih unsur tatasusunan di tempat. Secara lalai, ia disusun sebagai rentetan; untuk pengisihan berangka, fungsi perbandingan diperlukan.

const numbers = [1, 2, 3];
const doubled = numbers.map(x => x * 2); // [2, 4, 6]
const users = [{ name: 'John' }, { name: 'Jane' }];
const names = users.map(user => user.name); // ['John', 'Jane']

14. join(): Mencipta dan mengembalikan rentetan baharu dengan menggabungkan semua elemen dalam tatasusunan (dipisahkan oleh rentetan pemisah yang ditentukan).

const nums = [1, 2, 3, 4, 5, 6];
const evenNums = nums.filter(n => n % 2 === 0); // [2, 4, 6]
const products = [{ price: 10 }, { price: 20 }];
const expensive = products.filter(p => p.price > 15); // [{ price: 20 }]

Menguasai kaedah ini dengan ketara meningkatkan keupayaan manipulasi tatasusunan JavaScript anda.

Atas ialah kandungan terperinci kaedah tatasusunan paling popular dalam JavaScript yang anda tidak mahu ketinggalan!. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!