Rumah  >  Artikel  >  hujung hadapan web  >  JavaScript setTimeout menggunakan fungsi penutupan untuk mencetak nilai secara teratur_kemahiran javascript

JavaScript setTimeout menggunakan fungsi penutupan untuk mencetak nilai secara teratur_kemahiran javascript

WBOY
WBOYasal
2016-05-16 15:24:481324semak imbas

Kali ini kita menggunakan setTimeout untuk melaksanakan contoh nilai cetakan secara berurutan mengikut masa Sebenarnya, pada masa awal, ia juga merupakan kesilapan yang sering saya lakukan, atau untuk mencapai keupayaan ini, nampaknya js adalah jauh, tetapi ia sebenarnya Salah saya, haha ​​Saya tidak faham kuasa JS Mari kita pergi terus ke topik ini kita menggunakan setTimeout. Mari kita mulakan dengan pemikiran yang paling mudah Kemudian ia akan Tulis kod berikut.

for(var i = 0; i < 5; i++)
{ 
setTimeout(console.log(i),i*1000); 
} 

Walaupun kod ini mencetak nilai setiap i dalam urutan, 0, 1, 2, 3, 4. Walau bagaimanapun, masa pelaksanaan tidak memainkan peranan Kerana console.log() ialah panggilan pelaksanaan bagi method , selepas memanggil kaedah ini, ia dilaksanakan serta-merta!, jadi ia tidak mencapai tujuan yang diharapkan.

Kemudian mari kita teruskan melihat sekeping kod berikut

for(var i = 0; i< 5; i++ ){ setTimeout(function(){ console.log(i); },i*1000); } 

Di sini kita menggunakan fungsi tanpa nama yang mengandungi console.log yang dicetak untuk mencetak i, jadi nilai i dikongsi Sebelum setTimeout pertama dilaksanakan, gelung for telah dilaksanakan dan i = 5 terakhir, jadi. saya akan dicetak empat kali Sebenarnya, kami mempunyai dua penyelesaian Mari lihat yang pertama dahulu:

var j = 0; function abc(){ console.log("j = "+j); j++; }  
for(var i = 0; i < 10; i++ ){ 
setTimeout(abc,i*1000) } 

Di sini kita mempunyai satu lagi pembolehubah global untuk menyimpan nilai Setiap kali fungsi abc dilaksanakan, j ditambah sekali, jadi apabila setTimeout dilaksanakan, fungsi abc akan dipanggil, jadi kesan yang dijangkakan akan dicapai, tetapi di sini. j ialah Pembolehubah global, pembolehubah global akan menyebabkan masalah seperti mudah untuk menukar nilainya atau konflik penamaan Untuk melaksanakan kaedah kedua, kami memperkenalkan fungsi penutupan lagi Kerana fungsi penutupan, setiap kali ia dibuat, akan ada ruangnya sendiri untuk menyimpan nilai unik Jadi menggunakan pemikiran ini kami menulis kod seperti berikut

for(var i = 0; i < 10; i++ )
{ 
(function(x){ setTimeout(function()
{ 
console.log(x) },x*1000) })(i) 
}  
Kami menghantar nilai i setiap kali gelung for dilaksanakan kepada fungsi penutupan yang dicipta berbeza, supaya nilai i yang disimpan dalam setiap fungsi penutupan akan berbeza Jadi kami mencapai hasil yang kami inginkan.

ps: Gunakan penutupan untuk hanya merangkum setTimeout

Apabila menulis skrip js, beberapa fungsi ejaan sering digunakan, seperti memanggil setTimeout

var msgalert="test"; 
 function TestAlert(msg) 
   { 
    alert(msg) 
   } 
    
   $(document).ready(function () { 
  $("#btnCancel").click(function (e) { 
    setTimeout("TestAlert("+msgalert+")",1000); 
    }); 
}) 
Saya telah lama mencari, tetapi mengapa kotak dialog tidak muncul. Selepas menyemak untuk masa yang lama, saya mendapati bahawa sepasang petikan tunggal

telah hilang.

$(document).ready(function () { 
  $("#btnCancel").click(function (e) { 
    setTimeout("TestAlert('"+msgalert+"')",1000); 
    }); 
}) 
Cara penulisan ini terdedah kepada ralat, dan tidak mudah untuk mengesan ralat Jika anda menggunakan penutupan, anda boleh mengelaknya sepenuhnya seperti berikut

 var msgalert="test"; 
  function dalayAlert(msg ,time){  
  setTimeout( 
  TestAlert(msg), 
  time 
  ); 
  }  
 function TestAlert(msg) 
 { 
  alert(msg) 
 } 
$(document).ready(function () {   
$("#btnCancel").click(function (e) { 
   dalayAlert(msgalert,1000) 
 }); 
Disebabkan penggunaan penutupan, ia lebih mudah dan semakan ralat juga mudah

Kenyataan:
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