Dalam tutorial ini, anda akan belajar mengenai JavaScript untuk… of loop dengan bantuan contoh.
Dalam JavaScript, ada tiga cara kita boleh menggunakan forgelung.
- JavaScript untuk gelung
- JavaScript untuk… dalam gelung
- JavaScript untuk… of loop
The for… ofgelung diperkenalkan pada versi kemudian JavaScript ES6 .
The for… ofgelung dalam JavaScript membolehkan anda Itekadar atas objek iterable (tatasusunan, set, peta, tali dan lain-lain).
JavaScript untuk… of loop
Sintaksis for… ofgelung adalah:
for (element of iterable) ( // body of for… of )
Di sini,
- iterable - objek berulang (array, set, string, dll).
- elemen - item secara berulang
Dalam bahasa Inggeris biasa, anda boleh membaca kod di atas sebagai: untuk setiap elemen dalam lelaran, jalankan badan gelung.
untuk… daripada dengan Arrays
The for… ofgelung boleh digunakan untuk melelar lebih array. Sebagai contoh,
// array const students = ('John', 'Sara', 'Jack'); // using for… of for ( let element of students ) ( // display the values console.log(element); )
Pengeluaran
John Sara Jack
Dalam program di atas, for… ofgelung digunakan untuk melakukan lelaran ke atas objek array pelajar dan menampilkan semua nilainya.
untuk… daripada dengan Strings
Anda boleh menggunakan for… ofgelung untuk mengulang nilai rentetan. Sebagai contoh,
// string const string = 'code'; // using for… of loop for (let i of string) ( console.log(i); )
Pengeluaran
kod
untuk … daripada dengan Set
Anda boleh berulang melalui elemen Set menggunakan for… ofgelung. Sebagai contoh,
// define Set const set = new Set((1, 2, 3)); // looping through Set for (let i of set) ( console.log(i); )
Pengeluaran
1 2 3
untuk… daripada dengan Peta
Anda boleh melakukan lelaran melalui elemen Peta menggunakan for… ofgelung. Sebagai contoh,
// define Map let map = new Map(); // inserting elements map.set('name', 'Jack'); map.set('age', '27'); // looping through Map for (let (key, value) of map) ( console.log(key + '- ' + value); )
Pengeluaran
nama- Jack umur- 27
Iterator yang Ditentukan Pengguna
Anda boleh membuat iterator secara manual dan menggunakan for… ofloop untuk melakukan iterator melalui iterator. Sebagai contoh,
// creating iterable object const iterableObj = ( // iterator method (Symbol.iterator)() ( let step = 0; return ( next() ( step++; if (step === 1) ( return ( value: '1', done: false); ) else if (step === 2) ( return ( value: '2', done: false); ) else if (step === 3) ( return ( value: '3', done: false); ) return ( value: '', done: true ); ) ) ) ) // iterating using for… of for (const i of iterableObj) ( console.log(i); )
Pengeluaran
1 2 3
untuk… dari dengan Penjana
Oleh kerana penjana boleh berulang, anda boleh melaksanakan iterator dengan cara yang lebih mudah. Kemudian anda boleh berulang melalui generator menggunakan for… ofgelung. Sebagai contoh,
// generator function function* generatorFunc() ( yield 10; yield 20; yield 30; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Pengeluaran
10 20 30
untuk … daripada Vs untuk … dalam
| untuk… daripada | untuk… di |
|---|---|
The for… ofgelung digunakan untuk Itekadar melalui nilai-nilai yang iterable. | The for… ingelung digunakan untuk Itekadar melalui kekunci objek. |
The for… ofgelung tidak boleh digunakan untuk melelar atas objek. | Anda boleh menggunakan for… inuntuk melakukan iterasi atas tatasusunan dan rentetan seperti itu tetapi anda harus mengelak daripada menggunakan for… initerables. |
The for… ofgelung diperkenalkan pada ES6 . Beberapa penyemak imbas mungkin tidak menyokong penggunaannya. Untuk mengetahui lebih lanjut, lawati JavaScript untuk… dari Sokongan.
