Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6

Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6

青灯夜游
Lepaskan: 2022-08-30 17:48:28
asal
2271 orang telah melayarinya

3 kaedah pelaksanaan: 1. Tetapkan struktur data dan penyahduplikasi "Array.from()", sintaks "Array.from(new Set(arr))" 2. Tetapkan struktur data dan operator sambungan ".. ." untuk mengalih keluar pendua, sintaks ialah "[...new Set(arr)]"; 3. penapis() dan indexOf() penapisan, sintaksnya ialah "arr.filter((it,in)=>{ return arr .indexOf(it,0)===in;});”.

Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6

Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

5 cara untuk mengalih keluar pertindihan daripada tatasusunan ES6

1 Tetapkan struktur data dan Array.from() Ulang

  • Set ialah struktur data baharu yang disediakan oleh ES6, yang serupa dengan tatasusunan, tetapi tidak mempunyai nilai pendua. Menggunakan ciri ini, kita boleh menukar tatasusunan kepada jenis Set untuk penyahduplikasian, dan kemudian menggunakan kaedah Array.from untuk menukarnya kepada tatasusunan semula.

  • Kaedah Array.from digunakan untuk menukar dua jenis objek kepada tatasusunan sebenar: objek seperti tatasusunan dan objek boleh lelar (termasuk Set dan Peta struktur data tambahan baharu ES6).

Idea pelaksanaan:

  • Tukar tatasusunan kepada set Selepas penduaan, gunakan kaedah Array.from untuk menukar set kepada tatasusunan

Sintaks:

Array.from(new Set(arr))
Salin selepas log masuk

Contoh:

let arr=[1,2,3,3,2,"1",0,undefined,undefined];
let newArr=Array.from(new Set(arr));
console.log(newArr);
Salin selepas log masuk

Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6

2. Tetapkan data Pengendali struktur dan hamparan "..." Penyahduplikasi

  • Pengendali hamparan telah diperkenalkan dalam ES6 dan menyebarkan objek boleh lelar ke dalam elemen berasingannya, jadi- dipanggil objek boleh lelar ialah sebarang objek yang boleh dilalui menggunakan gelung for, seperti: tatasusunan, rentetan, Peta, Set, nod DOM, dsb.

Idea pelaksanaan:

  • Selepas menukar tatasusunan menjadi koleksi set untuk mengalih keluar pendua, gunakan operator spread... untuk mengembangkan set ke dalam tatasusunan, dan Tetapkan kepada tatasusunan

Sintaks:

[...new Set(arr)]
Salin selepas log masuk

Contoh:

let arr=[1,2,3,3,2,"1",0,1,2];
let newArr=[...new Set(arr)];
console.log(newArr);
Salin selepas log masuk

Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6

3. Gunakan kaedah penapis indexOf untuk mengalih keluar pendua Kaedah

penapis() mencipta tatasusunan baharu tatasusunan tertentu yang memenuhi syarat.

Kaedah indexOf mengembalikan indeks pertama (indeks) elemen yang ditentukan dalam tatasusunan, jika tidak, ia mengembalikan -1

Contoh:

var arr=[1, 2, 3, 2, 3];
var newArr = arr.filter((item,index)=> {
  return arr.indexOf(item,0) === index;
});
console.log(newArr);
Salin selepas log masuk

Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6

Jadi nilai indeks yang dikembalikan oleh setiap elemen dalam tatasusunan arr di sini melalui kaedah indexOf() ialah 0 1 2 1 2

arr.forEach(item => console.log(arr.indexOf(item))); // 0 1 2 1 2
Salin selepas log masuk

Anda boleh menggunakan indexOf untuk mencapai penduaan , sebagai contoh, elemen keempat 2 dalam arr mengembalikan indeks 1 melalui indexOf, tetapi subskrip indeks semasanya ialah 3, yang tidak sama, menunjukkan bahawa elemen 2 semasa telah muncul sebelum ini, jadi ia harus ditapis keluar .

[Cadangan berkaitan: tutorial video javascript, bahagian hadapan web]

Atas ialah kandungan terperinci Bagaimana untuk melaksanakan deduplikasi arr (array) dalam es6. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
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