Bagaimana untuk menukar lelaran JavaScript kepada tatasusunan?

王林
Lepaskan: 2023-09-16 20:57:03
ke hadapan
962 orang telah melayarinya

如何将 JavaScript 迭代器转换为数组?

Dalam JavaScript, iterator ialah koleksi elemen yang melaluinya kita boleh lelaran dan mengakses satu elemen dalam setiap lelaran. Koleksi, peta atau objek ialah iterator dalam JavaScript dan kami tidak boleh mengakses elemen iterator menggunakan indeks seperti yang kami boleh lakukan dengan tatasusunan.

Jadi, kita perlu menukar lelaran kepada tatasusunan terlebih dahulu. Di sini kita akan menukar iterator kepada tatasusunan menggunakan kaedah yang berbeza seperti array.from() dsb.

Gunakan untuk gelung

untuk gelung pada setiap elemen iterator terletak pada koleksi dan peta. Dalam gelung for-of kita boleh mengakses dan menambah elemen pada tatasusunan dan kita boleh menggunakan kaedah push() untuk menambah elemen pada tatasusunan.

Tatabahasa

Pengguna boleh menggunakan gelung for-of untuk menukar lelaran kepada tatasusunan dengan mengikut sintaks di bawah.

for (let element of iterator) {
   array.push(element);
}
Salin selepas log masuk

Dalam sintaks di atas, kami sedang mengakses elemen lelaran dalam gelung for-of dan menolaknya ke tatasusunan

Contoh 1

Dalam contoh di bawah, kami mencipta test_array dan memulakannya dengan beberapa nombor. Selepas itu, kami menggunakan Symbol.iterator() untuk menukar tatasusunan kepada iterator.

Seterusnya, kami menggunakan gelung for-of untuk lelaran ke atas lelaran. Kami mengakses semua elemen iterator satu demi satu dan menolaknya ke dalam tatasusunan. Setelah semua lelaran gelung for selesai, kami mendapat tatasusunan lengkap iterator.

<html>
<body>
   <h2>Using the <i> for loop </i> to transform JavaScript iterator into the array</h2> 
   <div id = "output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   let test_array = [10, 20, 30, 0, 50, 60, 70];
   let iterator = test_array[Symbol.iterator]();
   let array = [];
   for (let element of iterator) {
      array.push(element);
      output.innerHTML += "Array element is - " + element + "<br>";
   }
   output.innerHTML += "The whole array is - " + array;
</script>
</html>
Salin selepas log masuk

Gunakan kaedah array.from()

Kaedah Array.from() mencipta tatasusunan daripada iterator. Kita perlu lulus objek iterator sebagai parameter kaedah array.from(). Selepas menukar iterator kepada tatasusunan, ia mengembalikan tatasusunan.

Tatabahasa

Pengguna boleh menggunakan kaedah array.from() mengikut sintaks di bawah untuk menukar lelaran kepada tatasusunan.

let array = Array.from(test_set); 
Salin selepas log masuk

Dalam sintaks di atas, test_set ialah iterator untuk ditukar kepada tatasusunan.

Parameter

test_set – Ia adalah lelaran untuk ditukar kepada tatasusunan.

Contoh 2

Dalam contoh di bawah, kami telah mencipta koleksi menggunakan pelbagai elemen. Selepas itu, kami menukar koleksi kepada tatasusunan menggunakan kaedah array.from(). Dalam output, pengguna boleh melihat tatasusunan yang dikembalikan daripada kaedah array.from().

<html>
<body>
   <h2>Using the <i> Array.from() method </i> to transform JavaScript iterator into the array.</h2>
   <div id = "output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   let test_set = new Set(["Hello", "Hello", "Hi", 10, 10, 20, 30, 40, 40, true, false, true, true]);
   let array = Array.from(test_set);
   output.innerHTML += "The array from the test_set is " + array;
</script>
</html>
Salin selepas log masuk

Gunakan operator spread

Pengendali spread juga membenarkan kami menukar iterator kepada tatasusunan seperti kaedah array.from(). Ia menyalin semua elemen iterator ke dalam tatasusunan baharu. Selain itu, kita boleh menggunakannya untuk mengklon tatasusunan.

Tatabahasa

Pengguna boleh menggunakan operator spread untuk menukar iterator kepada tatasusunan dengan mengikut sintaks di bawah

let array = [...test_map]; 
Salin selepas log masuk

Dalam sintaks di atas, test_map ialah lelaran.

Contoh 3

Dalam contoh di bawah, kami telah mencipta peta dengan kunci dan nilai unik. Kami boleh mengakses nilai tertentu dari peta menggunakan kekunci.

Kami telah menukar test_map kepada tatasusunan menggunakan operator spread. Dalam output, pengguna dapat melihat bahawa setiap kunci dan nilai peta telah ditambahkan pada tatasusunan

<html>
<body>
   <h2>Using the <i> Spread operator </i> to transform JavaScript iterator into the array.</h2>
   <div id = "output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   var test_map = new Map([["first", true], ["second", false], ["third", false], ["fourth", true]]);
   let array = [...test_map]; 
   output.innerHTML += "The array from the test_map is " + array;
</script>
</html>
Salin selepas log masuk

Contoh 4

Dalam contoh ini, kami menukar lelaran koleksi kepada tatasusunan. Pembina Set() baharu digunakan untuk mencipta set daripada elemen angka, boolean dan rentetan.

Selepas itu, kami menggunakan operator spread untuk menukar lelaran koleksi kepada tatasusunan.

<html>
<body>
   <h2>Using the <i> Spread operator </i> to transform JavaScript iterator into the array.</h2>
   <div id="output"> </div>
</body>
<script>
   let output = document.getElementById('output');
   let set = new Set([30, 40, "TypeScript", "JavaScript"])
   let array = [...set]
   output.innerHTML += "The array from the object is " + array;
</script>
</html>
Salin selepas log masuk

Dalam tutorial ini, kami mempelajari tentang tiga cara berbeza untuk menukar lelaran kepada tatasusunan. Cara terbaik ialah menggunakan operator spread kerana ia juga menyediakan fungsi lain seperti mengklonkan tatasusunan.

Atas ialah kandungan terperinci Bagaimana untuk menukar lelaran JavaScript kepada tatasusunan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:tutorialspoint.com
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
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!