Cara memecahkan setiap javascript

Dalam posting ini kita akan membahas cara memecahkan loop JavaScript forEach dengan jargon teknis sesedikit mungkin sehingga Anda akan memiliki semua yang Anda butuhkan di sini tanpa harus melihat lebih jauh

Tidaklah mungkin untuk memecahkan loop JavaScript forEach dalam pengertian konvensional, jadi apa yang harus Anda lakukan?

Dalam posting ini, kami akan membahas semua yang perlu Anda ketahui tentang cara memecahkan loop JavaScript forEach serta alternatifnya

Mari kita mulai

Cara memecahkan loop foreach JavaScript

Jika Anda perlu menghentikan atau melakukan jeda dalam JavaScript forEach loop maka Anda mungkin sebaiknya tidak menggunakan forEach loop, sebagai gantinya coba gunakan for loop, atau Array. prototipe. beberapa yang akan kita lihat lebih detail nanti di pos

Himpunan. prototipe. forEach dirancang untuk mengulangi setiap item dalam array satu kali sambil memberi Anda item array, indeks, dan array lengkap dalam panggilan balik yang Anda berikan

Karena itu tidak ada cara untuk keluar begitu saja

Jika Anda telah mencoba menggunakan pernyataan break dalam forEach loop maka Anda akan mendapatkan kesalahan "SyntaxError Tidak Tertangkap. Pernyataan break ilegal”, yang diharapkan karena Anda hanya dapat menggunakan pernyataan break di dalam lingkup langsung dari sebuah loop, dan bukan fungsi (bahkan jika fungsinya ada di dalam loop)

Berikut adalah contoh kesalahannya

[1, 2, 3].forEach(a => {
  console.log(a)
  break
})
// Uncaught SyntaxError: Illegal break statement

Dengan semua yang dikatakan, kami memiliki beberapa opsi untuk mereplikasi jeda dalam loop forEach JavaScript jika Anda masih perlu menemukan cara untuk memecahkan loop forEach

Cara memecahkan loop foreach JavaScript menggunakan pengecualian

Salah satu opsi adalah melempar pengecualian dengan panggilan balik yang Anda berikan ke Array. prototipe. untuk Setiap fungsi

Dengan melakukan ini, Anda akan menyebabkan kesalahan yang akan menghentikan semua proses dalam aplikasi JavaScript Anda

Karena Anda tidak ingin seluruh aplikasi Anda berhenti, kami perlu membungkus Array. prototipe. forEach loop dalam pernyataan try catch sehingga kita dapat menangkap kesalahan yang akan kita lempar sehingga kesalahan tersebut akan bertindak sebagai pernyataan break

Sebelum kita masuk ke contoh, ini benar-benar tidak ideal dan seperti yang telah saya katakan di awal jika Anda perlu keluar dari loop maka opsi terbaik Anda adalah tidak menggunakan forEach dan sebagai gantinya gunakan for loop untuk istirahat, atau Array. prototipe. beberapa metode

Berikut adalah contoh cara menggunakan melempar kesalahan untuk memutus loop foreach JavaScript

const breakFE = () => {
  throw new Error("BREAK_FE")
}

const handleBreakFEError = e => {
  if (e.message !== "BREAK_FE") {
    throw e
  } else {
    console.log("javascript foreach break!")
  }
}

try {
  [1, 2, 3].forEach(item => {
    if (item > 1) {
      breakFE()
    }
    console.log(item)
  })
} catch (e) {
  handleBreakFEError(e)
}
// 1
// javascript foreach break!

Anda dapat mengambil satu langkah lebih jauh dan membuat fungsi pembantu, atau bahkan memodifikasi objek Array itu sendiri, tetapi secara umum Anda tidak boleh melakukan ini dan hanya ada sedikit alasan untuk melakukannya

Berikut ini tampilannya

Array.prototype.forEachWithBreak = function(callback) {
  const breakFE = () => {
    throw new Error("BREAK_FE")
  }

  const handleBreakFEError = e => {
    if (e.message !== "BREAK_FE") {
      throw e
    } else {
      console.log("javascript foreach break!")
    }
  }

  try {
    this.forEach((...args) => callback(...args, breakFE))
  } catch (e) {
    handleBreakFEError(e)
  }
}


[1, 2, 3].forEachWithBreak((item, index, arr, breakFE) => {
  console.log(item, index)
  breakFE()
})
// 1 0
// javascript foreach break!

Cara memecahkan perulangan foreach JavaScript menggunakan pernyataan if dan return

Anda tidak dapat benar-benar "memutuskan" loop JavaScript forEach menggunakan pernyataan if karena itu masih akan melakukan semua iterasi pada array Anda

Tapi Anda bisa secara drastis menurunkan jumlah pekerjaan yang terjadi pada setiap iterasi

Jika Anda melakukan banyak perhitungan pada setiap iterasi forEach loop Anda, meskipun tidak sempurna, Anda dapat menggunakan pernyataan if untuk mengurangi melakukan pekerjaan itu yang akan sedikit mirip dengan memanggil continue pada setiap iterasi

Berikut adalah contoh bagaimana Anda dapat menggunakan pernyataan if untuk melewati perhitungan di loop forEach

let breakFe = false;

[1, 2, 3].forEach(item => {
  if (item > 1) {
    return
  }
  console.log(item)
})

Seperti yang Anda lihat, ini berfungsi dengan hanya kembali di awal setiap iterasi untuk menjaga pekerjaan komputasi seminimal mungkin dengan mencegah lebih banyak kode dijalankan di callback Anda

Ini jauh dari ideal, dan akan lebih baik menggunakan metode yang memungkinkan Anda keluar atau menggunakan perulangan for

Alternatif untuk JavaScript forEach break

Ada beberapa opsi yang dapat kita gunakan sebagai alternatif foreach loop di JavaScript, dan itu adalah solusi terbaik jika Anda perlu keluar dari forEach loop

Menggunakan loop for sebagai alternatif untuk loop forEach untuk diputus

Yang pertama, dan yang secara pribadi saya rekomendasikan dalam situasi ini, adalah menggunakan pernyataan standar for loop dan break

Saya memiliki posting lengkap tentang bagaimana Anda dapat keluar dari loop for di sini

Berikut adalah contoh bagaimana Anda dapat menggunakan perulangan for untuk memutus perulangan

const myArray = [1, 2, 3];

for (let i = 0; i < myArray.length; i += 1) {
  const arrayItem = myArray[i]

  if (arrayItem > 1) {
    break
  }

  console.log(arrayItem, i, myArray)
}

Seperti yang Anda lihat pada contoh di atas, dengan sangat sedikit usaha kita bisa mendapatkan perulangan for untuk melakukan persis seperti perulangan forEach lakukan untuk kita kecuali mulai sekarang kita dapat menggunakan pernyataan break untuk keluar dari iterasi tambahan

Menggunakan while loop sebagai alternatif dari forEach loop untuk diputus

While loop pada dasarnya adalah prinsip yang sama dengan for loop kecuali bahwa Anda tidak mendefinisikan indeks dalam lingkup while loop

Berikut adalah contoh bagaimana Anda dapat menggunakan perulangan while sebagai alternatif perulangan forEach untuk diputus

const myArray = [1, 2, 3];
let index = 0;

while (index < myArray.length) {
  const arrayItem = myArray[index]

  if (arrayItem > 1) {
    break
  }

  console.log(arrayItem, index, myArray)

  index += 1
}

Menggunakan Larik. prototipe. beberapa sebagai alternatif untuk loop forEach untuk istirahat

Alternatif terakhir yang bisa Anda gunakan untuk perulangan forEach agar bisa melakukan semacam break adalah Array. prototipe. beberapa metode

Anda masih tidak dapat memanggil pernyataan break dari dalamnya, tetapi sebagai gantinya Anda dapat mengembalikan boolean dari callback Anda yang akan digunakan oleh beberapa loop sebagai indikator untuk menghentikan iterasi pada item array

Tujuan asli dari Array. prototipe. beberapa metode adalah untuk mengetahui apakah suatu item ada dalam array, jika ya, metode tersebut akan mengembalikan true, jika tidak maka akan mengembalikan false

Kita dapat menggunakan ini untuk membuat fungsionalitas seperti break dengan mengembalikan nilai true di callback kita saat kita ingin meniru pernyataan break

Berikut adalah contoh bagaimana menggunakan beberapa metode untuk memutus satu lingkaran

[1, 2, 3].some(a => {
  console.log(a)
  return true
})
// 1
// true

Ringkasan

Untuk meringkas posting ini dalam beberapa kata, jika Anda perlu keluar dari Array JavaScript. prototipe. forEach maka Anda tidak boleh menggunakan JavaScript Array. prototipe. forEach dan sebagai gantinya Anda harus menggunakan for loop atau Array. prototipe. beberapa metode

Di sana kami memiliki cara memecahkan loop foreach JavaScript, jika Anda ingin lebih seperti ini pastikan untuk memeriksa beberapa posting saya yang lain

Saya harap posting ini membantu, tetapi sebelum Anda pergi, pastikan Anda mencoba kuis interaktif saya yang menyenangkan untuk mengetahui apakah Anda seorang insinyur React pemula, menengah, atau ahli

Ini hanya akan memakan waktu sekitar 1 - 3 menit, jadi Anda tidak akan rugi, uji kemampuan Anda sekarang

Ambil Kuis

Apakah Anda seorang insinyur reaksi pemula, menengah, atau ahli?

Cari tahu di sini dengan mengikuti kuis cepat, interaktif, dan menyenangkan saya yang memakan waktu sekitar 1 - 3 menit. Seberapa baik yang akan Anda lakukan?

Posting ini akan mencakup semua yang perlu Anda ketahui tentang React Fragment dengan cara yang jelas dan ringkas dan akan menjadi sumber utama untuk kueri terkait React Fragment

Will Mayger

24 Maret 2022

Artikel

Posting ini akan membahas bagaimana menunggu semua janji untuk diselesaikan dalam JavaScript daripada harus mengambilnya satu per satu saat Anda memiliki banyak janji yang perlu diselesaikan

Will Mayger

21 Maret 2022

Artikel

Dalam panduan ini Anda akan menemukan semua yang perlu Anda ketahui tentang React Keys untuk dapat menggunakannya dengan benar di aplikasi React apa pun beserta seluk beluknya

Will Mayger

03 Maret 2022

Artikel

Dalam posting ini kami membahas perbedaan antara, Bereaksi. Fragmen vs div, manfaat dari sebuah fragmen dan kapan Anda harus menggunakan salah satunya

Bagaimana Anda memutuskan dari setiap putaran?

Bagaimana Anda memecahkan forEach di TypeScript?

Bagaimana cara menghentikan peta dalam JavaScript?

Bagaimana Anda memecahkan loop array?