jquery meninggalkan kawalan aliran

Dengan perkembangan Internet, pembangunan bahagian hadapan telah mendapat lebih banyak perhatian dan perhatian. Dalam pembangunan bahagian hadapan, jQuery ialah salah satu alat pembangunan penting. jQuery ialah perpustakaan JavaScript yang pantas dan ringkas berdasarkan JavaScript yang boleh memudahkan tugas seperti traversal dokumen HTML, pengendalian acara, kesan animasi dan operasi AJAX. Dalam jQuery, aliran kawalan adalah sangat penting, menjadikan kod lebih jelas dan lebih mudah untuk diselenggara. Walau bagaimanapun, apabila menulis aplikasi kompleks, aliran kawalan boleh menjadi sangat panjang dan kompleks, menjejaskan kebolehbacaan dan kebolehselenggaraan kod. Dalam artikel ini, kami akan membincangkan cara menggunakan kawalan aliran yang ditinggalkan jQuery untuk memudahkan kod anda.

Apakah itu kawalan proses?

Pertama, mari kita fahami apa itu kawalan proses. Kawalan proses merujuk kepada program yang melakukan operasi yang berbeza dalam urutan logik tertentu Operasi ini biasanya dilaksanakan oleh beberapa struktur kawalan dalam program. Dalam JavaScript, kawalan aliran biasanya termasuk penyataan if...else, untuk gelung, gelung sementara, penyataan suis, dsb. Struktur kawalan ini membolehkan kami melakukan operasi yang berbeza mengikut keadaan yang berbeza, melaksanakan percabangan dan gelung program, dan meningkatkan fleksibiliti dan kecekapan program.

kawalan aliran jQuery yang diabaikan

Dalam jQuery, sintaks kawalan aliran pada asasnya adalah sama seperti JavaScript. Walau bagaimanapun, disebabkan sifat istimewa jQuery, kita boleh menggunakan beberapa kaedah khas untuk memudahkan kawalan aliran. Di bawah, kami akan memperkenalkan beberapa kaedah yang biasa digunakan untuk meninggalkan kawalan aliran.

Kaedah $.each()

Kaedah $.each() boleh digunakan untuk melintasi tatasusunan atau objek dan melakukan beberapa operasi. Berbeza dengan gelung for dalam JavaScript, kaedah $.each() membenarkan kami melelaran melalui data dan juga melaksanakan beberapa fungsi panggil balik. Sintaksnya adalah seperti berikut:

$.each(array, function(index, value) {
  // code to be executed for each value
});

Antaranya, tatasusunan ialah tatasusunan atau objek yang akan dilalui, fungsi ialah fungsi panggil balik yang akan dilaksanakan, indeks mewakili nilai indeks semasa, dan nilai mewakili nilai elemen semasa. Fungsi ini akan merentasi elemen dalam tatasusunan satu demi satu dan melaksanakan fungsi panggil balik yang sepadan.

Sebagai contoh, kod berikut menggunakan kaedah $.each() untuk melintasi item tatasusunan dan mengeluarkan nilai setiap elemen:

var items = ["apple", "orange", "banana", "pear"];

$.each(items, function(index, value) {
  console.log(value);
});

Hasil output ialah:

apple
orange
banana
pear

Kaedah $ .map()

Kaedah $.map() boleh digunakan untuk merentasi tatasusunan atau objek dan mengembalikan tatasusunan baharu. Berbeza dengan kaedah $.each(), kaedah $.map() membenarkan kami menambah beberapa syarat apabila melelaran melalui tatasusunan atau objek dan mengembalikan tatasusunan baharu sebagai hasilnya. Sintaksnya adalah seperti berikut:

$.map(array, function(value, index) {
  // code to be executed for each element
  // return new value
});

Antaranya, tatasusunan ialah tatasusunan atau objek yang akan dilalui, fungsi ialah fungsi panggil balik yang akan dilaksanakan, nilai mewakili nilai elemen semasa dan indeks mewakili nilai indeks semasa. Fungsi ini akan berulang melalui elemen dalam tatasusunan satu demi satu dan mengembalikan tatasusunan baharu sebagai hasil berdasarkan syarat.

Sebagai contoh, kod berikut menggunakan kaedah $.map() untuk mengulangi item tatasusunan dan mengembalikan tatasusunan baharu di mana setiap elemen diawali dengan "fruit:":

var items = ["apple", "orange", "banana", "pear"];

var newArray = $.map(items, function(value, index) {
  return "fruit: " + value;
});

console.log(newArray);

Hasil output ialah:

[
  "fruit: apple",
  "fruit: orange",
  "fruit: banana",
  "fruit: pear"
]

Kaedah $.grep()

Kaedah $.grep() boleh digunakan untuk menapis elemen dalam tatasusunan dan hanya mengembalikan elemen yang memenuhi syarat. Sintaksnya adalah seperti berikut:

$.grep(array, function(elementOfArray, indexInArray) {
  // condition for filtering
});

Antaranya, tatasusunan ialah tatasusunan yang akan ditapis, fungsi ialah fungsi panggil balik yang akan dilaksanakan, elementOfArray mewakili nilai elemen semasa dan indexInArray mewakili nilai indeks semasa. Fungsi ini akan merentasi elemen dalam tatasusunan satu demi satu dan mengembalikan elemen yang memenuhi syarat mengikut syarat.

Sebagai contoh, kod berikut menggunakan kaedah $.grep() untuk menapis item tatasusunan dan hanya mengembalikan elemen dengan panjang lebih daripada 5:

var items = ["apple", "orange", "banana", "pear"];

var filteredArray = $.grep(items, function(elementOfArray, indexInArray) {
  return elementOfArray.length > 5;
});

console.log(filteredArray);

Hasil output ialah:

["orange", "banana"]

Kaedah $ .ajax()

Kaedah $.ajax() ialah salah satu kaedah yang digunakan dalam jQuery untuk mengendalikan permintaan AJAX. Ia boleh menghantar permintaan kepada pelayan dan mengembalikan hasil yang sepadan. Pilihan yang paling biasa digunakan dalam kaedah $.ajax() ialah URL dan dataType. Pilihan URL menunjukkan alamat yang akan diminta, dan pilihan dataType menunjukkan jenis data yang dikembalikan (seperti json, xml, html, dll.). Sintaksnya adalah seperti berikut:

$.ajax({
  url: "http://example.com/myscript.php",
  dataType: "json",
  success: function(response) {
    // code to be executed when request succeeds
  },
  error: function(jqXHR, textStatus, errorThrown) {
    // code to be executed when request fails
  }
});

Antaranya, url mewakili alamat yang akan diminta, dataType mewakili jenis data yang dikembalikan, kejayaan mewakili fungsi panggil balik yang akan dilaksanakan apabila permintaan berjaya, dan ralat mewakili panggilan balik fungsi yang akan dilaksanakan apabila permintaan gagal. Fungsi ini akan menghantar permintaan kepada pelayan dan melaksanakan fungsi panggil balik yang sepadan berdasarkan hasil yang dikembalikan oleh pelayan.

Sebagai contoh, kod berikut menggunakan kaedah $.ajax() untuk menghantar permintaan kepada pelayan dan mengeluarkan hasilnya kepada konsol selepas permintaan itu berjaya:

$.ajax({
  url: "http://example.com/myscript.php",
  dataType: "json",
  success: function(response) {
    console.log(response);
  },
  error: function(jqXHR, textStatus, errorThrown) {
    console.log("Error: " + textStatus);
  }
});

Kesimpulan

Dengan menguasai kaedah kawalan aliran yang ditinggalkan jQuery, kami boleh menulis kod dengan lebih mudah dan menjadikan kod lebih mudah untuk diselenggara dan dilanjutkan. Di atas memperkenalkan beberapa kaedah yang biasa digunakan Sudah tentu, terdapat banyak kaedah lain yang menghilangkan kawalan proses yang boleh digunakan. Saya harap semua orang dapat menguasai kaedah ini dan menulis kod yang lebih cekap dan lebih mudah untuk diselenggara.

Atas ialah kandungan terperinci jquery meninggalkan kawalan aliran. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!