[1,2,3].forEach(function(el) {
if(el === 1) break;
});
Bagaimana saya bisa melakukan ini menggunakan forEach
metode baru dalam JavaScript? Saya sudah mencoba return;
, return false;
dan break
. break
crash dan return
tidak melakukan apa-apa selain melanjutkan iterasi.
javascript
arrays
Scott Klarenbach
sumber
sumber
return
memang melanjutkan iterasi, itu akan melewatkan kode apa pun yang datang setelah itu di blok. Ambil kode ini misalnya:[1,2,3].forEach(function(el) { if(el === 2) { console.log(`Match on 2!`); return; } console.log(el); });
anconsole.log(el);
akan dilewati ketika 2 cocok.Jawaban:
Tidak ada kemampuan bawaan untuk
break
masukforEach
. Untuk menghentikan eksekusi, Anda harus melemparkan pengecualian. misalnya.Pengecualian JavaScript tidak terlalu bagus.
for
Perulangan tradisional mungkin lebih tepat jika Anda benar-benar perlubreak
di dalamnya.Menggunakan
Array#some
Sebaliknya, gunakan
Array#some
:Ini berfungsi karena
some
pengembaliantrue
segera setelah salah satu dari panggilan balik, dieksekusi dalam urutan array, kembalitrue
, hubungan pendek eksekusi sisanya.some
, kebalikannyaevery
(yang akan berhenti pada areturn false
), danforEach
semua metode ECMAScript Fifth Edition yang perlu ditambahkan keArray.prototype
browser di mana mereka hilang.sumber
some
danevery
, ini seharusnya ada di TOP dalam jawabannya. Tidak dapat memahami mengapa orang berpikir itu kurang mudah dibaca. Luar biasa!Array#some
sangat bagus. Pertama ini kompatibel dengan sebagian besar browser termasuk IE9 dan firefox 1.5 juga berfungsi dengan sangat baik. Contoh kasus penggunaan saya adalah menemukan indeks dalam array rentang [a, b] di mana angka berada di antara pasangan batas bawah dan batas atas, uji dan kembalikan benar ketika ditemukan.for..of
akan menjadi solusi terbaik berikutnya meskipun hanya untuk browser yang lebih baru.Sekarang ada cara yang lebih baik untuk melakukan ini di ECMAScript2015 (alias ES6) menggunakan yang baru untuk loop . Misalnya, kode ini tidak mencetak elemen array setelah angka 5:
Dari dokumen:
Perlu indeks dalam iterasi? Anda bisa menggunakan
Array.entries()
:sumber
entries
. untuk (const [indeks, elemen] someArray.entries ()) {// ...}Object.entries(myObject)
dan menggunakannya persis seperti yang Anda gunakanfor..in
untuk array. Perhatikan bahwa array JS pada dasarnya adalah objek di bawah tenda: blog.niftysnippets.org/2011/01/myth-of-arrays.htmlAnda dapat menggunakan setiap metode:
ES6
untuk penggunaan dukungan browser lama:
lebih detail di sini .
sumber
[1,2,3].every( el => el !== 1 )
every
menjamin bahwa panggilan dilakukan secara berurutan?k
dimulai dengan indeks 0 dan bertambah 1: http://www.ecma-international.org/ecma-262/6.0/#sec-array.prototype.everyMengutip dari dokumentasi MDN tentang
Array.prototype.forEach()
:Untuk kode Anda (dalam pertanyaan), seperti yang disarankan oleh @bobince, gunakan
Array.prototype.some()
saja. Ini sangat cocok untuk penggunaan Anda.sumber
Sayangnya dalam hal ini akan jauh lebih baik jika Anda tidak menggunakannya
forEach
. Alih-alih menggunakanfor
loop reguler dan sekarang akan bekerja persis seperti yang Anda harapkan.sumber
Pertimbangkan untuk menggunakan
jquery
'seach
metode, karena memungkinkan untuk mengembalikan fungsi dalam callback palsu:Perpustakaan Lodash juga menyediakan
takeWhile
metode yang dapat dirantai dengan peta / perkecil / lipat dll:sumber
Dari contoh kode Anda, sepertinya
Array.prototype.find
ini yang Anda cari: Array.prototype.find () dan Array.prototype.findIndex ()sumber
Jika Anda ingin menggunakan saran Dean Edward dan melemparkan kesalahan StopIteration untuk keluar dari loop tanpa harus menangkap kesalahan, Anda dapat menggunakan fungsi berikut ( asal dari sini ):
Kode di atas akan memberi Anda kemampuan untuk menjalankan kode seperti berikut tanpa harus melakukan klausa coba-coba Anda sendiri:
Satu hal penting untuk diingat adalah bahwa ini hanya akan memperbarui fungsi Array.prototype.forEach jika sudah ada. Jika belum ada, itu tidak akan memodifikasinya.
sumber
Jawaban singkat: gunakan
for...break
untuk ini atau ubah kode Anda untuk menghindari pemecahanforEach
. Jangan gunakan.some()
atau.every()
untuk ditirufor...break
. Tulis ulang kode Anda untuk menghindarifor...break
perulangan, atau gunakanfor...break
. Setiap kali Anda menggunakan metode ini sebagaifor...break
alternatif, Tuhan membunuh anak kucing.Jawaban panjang:
.some()
dan.every()
keduanya mengembalikanboolean
nilai,.some()
mengembalikantrue
jika ada elemen yang fungsinya lewat kembalitrue
, setiap pengembalianfalse
jika ada elemen yang fungsinya lewat kembalifalse
. Inilah yang dimaksud fungsi. Menggunakan fungsi untuk apa yang tidak mereka maksudkan jauh lebih buruk daripada menggunakan tabel untuk tata letak, bukan CSS, karena itu membuat semua orang yang membaca kode Anda frustrasi.Juga, satu-satunya cara yang mungkin untuk menggunakan metode ini sebagai
for...break
alternatif adalah dengan membuat efek samping (mengubah beberapa vars di luar.some()
fungsi callback), dan ini tidak jauh berbedafor...break
.Jadi, menggunakan
.some()
atau.every()
sebagaifor...break
alternatif loop tidak bebas dari efek samping, ini tidak jauh lebih bersihfor...break
, ini membuat frustrasi, jadi ini tidak lebih baik.Anda selalu dapat menulis ulang kode Anda sehingga tidak perlu ada
for...break
. Anda dapat memfilter array menggunakan.filter()
, Anda dapat membagi array menggunakan.slice()
dan sebagainya, lalu menggunakan.forEach()
atau.map()
untuk bagian array itu.sumber
for...break
perulangan jika Anda membutuhkan kinerja.for
loop yang paling alat performant iterasi dari.forEach()
,.any()
,.map()
,.filter()
dllIni adalah sesuatu yang saya buat untuk menyelesaikan masalah ... Saya cukup yakin ini memperbaiki masalah yang dimiliki oleh penanya semula:
Dan kemudian Anda akan menyebutnya dengan menggunakan:
Mengembalikan salah di dalam fungsi panggilan balik akan menyebabkan jeda. Beri tahu saya jika itu tidak berhasil.
sumber
=== false
mungkin lebih baik daripada== false
itu Anda tidak harus secara eksplisit mengembalikan true (atau nilai kebenaran) untuk melanjutkan loop, jangan sampai beberapa jalur kontrol tidak mengembalikan nilai dan loop rusak secara tak terduga.Konsep lain yang saya kemukakan adalah:
sumber
Array.prototype.forEach()
.for
danbreak
ada jauh sebelum pertanyaan ini diajukan; OP sedang mencari perilaku itu menggunakan, lebih fungsionalforEach
,.for...in
danbreak
.sumber
Menemukan solusi ini di situs lain. Anda bisa membungkus forEach dalam skenario coba / tangkap.
Lebih detail di sini: http://dean.edwards.name/weblog/2006/07/enum/
sumber
Jika Anda tidak perlu mengakses array Anda setelah iterasi, Anda dapat menebus dengan menetapkan panjang array menjadi 0. Jika Anda masih membutuhkannya setelah iterasi Anda, Anda dapat mengkloningnya menggunakan slice ..
Atau dengan klon:
Yang merupakan solusi yang jauh lebih baik daripada melemparkan kesalahan acak dalam kode Anda.
sumber
array.length
ke0
mereka akan berlaku dalam iterasi saat ini, jadi mungkin kadang-kadang lebih baik untuk digunakanreturn
setelah penetapan tersebutIni adalah untuk loop, tetapi mempertahankan referensi objek dalam loop seperti forEach () tetapi Anda bisa keluar.
sumber
Seperti yang disebutkan sebelumnya, Anda tidak dapat merusak
.forEach()
.Inilah cara yang sedikit lebih modern untuk melakukan foreach dengan ES6 Iterators. Memungkinkan Anda mendapatkan akses langsung ke
index
/value
saat iterasi.Keluaran:
Tautan
Array.prototype.entries()
sumber
Namun pendekatan lain
sumber
Saya menggunakan nullhack untuk tujuan itu, ia mencoba mengakses properti
null
, yang merupakan kesalahan:sumber
throw BREAK
?Jika Anda ingin menyimpannya
forEach
sintaks , ini adalah cara untuk membuatnya tetap efisien (meskipun tidak sebagus reguler untuk loop). Periksa segera untuk variabel yang tahu jika Anda ingin keluar dari loop.Contoh ini menggunakan fungsi anonim untuk membuat lingkup fungsi di
forEach
mana Anda perlu menyimpan informasi yang dilakukan .Dua sen saya.
sumber
Saya tahu itu bukan cara yang benar. Itu tidak mematahkan loop. Itu adalah Jugad
sumber
Gunakan
array.prototype.every
fungsi ini, yang memberi Anda utilitas untuk memutus perulangan. Lihat contoh di sini dokumentasi Javascript di jaringan pengembang Mozillasumber
Setuju dengan @bobince, terunggah.
Juga, FYI:
Prototype.js memiliki sesuatu untuk tujuan ini:
$break
akan ditangkap dan ditangani oleh Prototype.js secara internal, memutus siklus "masing-masing" tetapi tidak menghasilkan kesalahan eksternal.Lihat Prototype.JS API untuk detailnya.
jQuery juga memiliki caranya, kembalikan false di handler untuk memutus loop awal:
Lihat jQuery API untuk detailnya.
sumber
Ini bukan yang paling efisien, karena Anda masih menggilir semua elemen, tapi saya pikir mungkin ada baiknya mempertimbangkan yang sangat sederhana:
sumber
continue
adalah kata kunci, kode Anda adalah kesalahan sintaksis.for of
loop danbreak;
dari itu seperti biasa.Anda dapat mengikuti kode di bawah ini yang berfungsi untuk saya:
sumber
Saya lebih suka menggunakan
for in
for in
berfungsi seperti iniforEach
, dan Anda dapat menambahkan kembali ke fungsi keluar di dalamnya. Performa yang lebih baik juga.sumber
Jika Anda perlu memecah berdasarkan nilai elemen yang sudah ada di array Anda seperti dalam kasus Anda (yaitu jika kondisi break tidak tergantung pada variabel run-time yang dapat berubah setelah array diberi nilai elemennya) Anda juga bisa menggunakan kombinasi dari slice () dan indexOf () sebagai berikut.
Jika Anda perlu istirahat ketika untuk setiap mencapai 'Apple' yang dapat Anda gunakan
Sebagaimana dinyatakan dalam W3Schools.com metode slice () mengembalikan elemen yang dipilih dalam array, sebagai objek array baru. Array asli tidak akan diubah.
Lihat di JSFiddle
Semoga ini bisa membantu seseorang.
sumber
Anda dapat membuat varian dari
forEach
yang memungkinkan untukbreak
,continue
,return
, dan bahkanasync
/await
: (contoh ditulis dalam naskah)Pemakaian:
sumber
coba dengan "temukan":
sumber
Ya mungkin untuk melanjutkan dan keluar dari loop forEach.
Untuk melanjutkan, Anda dapat menggunakan kembali, loop akan melanjutkan tetapi fungsi saat ini akan berakhir.
Untuk keluar dari loop, Anda dapat mengatur parameter ketiga ke 0 panjang, atur ke array kosong. Loop tidak akan melanjutkan, fungsi saat ini dilakukan, sehingga Anda dapat menggunakan "kembali" untuk menyelesaikan, seperti keluar dalam normal untuk loop ...
Ini:
akan mencetak ini:
sumber
Sebelumnya, kode saya ada di bawah
Saya telah mengubah ke bawah, ini diperbaiki.
sumber