JS深入(for循環(huán)與onclick)

前言:

1.事件綁定,setTimeout()/setInterval() 等定時(shí)調(diào)用屬于異步操作。在for循環(huán)中運(yùn)行會(huì)把它們放到最后運(yùn)行.

2.alert(),console.log()屬于同步操作


問題1.

上述代碼執(zhí)行后報(bào)錯(cuò):"choose[i] is undefined"。請(qǐng)分析原因。

解釋.

將for循環(huán)進(jìn)行拆解


實(shí)際執(zhí)行順序

for 循環(huán)里面給 choose 的每一個(gè)元素的 onclick 事件設(shè)置為一個(gè)匿名函數(shù),而這個(gè)函數(shù)在 for 循環(huán)階段是還沒有執(zhí)行的(等到點(diǎn)擊時(shí)才會(huì)觸發(fā) onclick 事件執(zhí)行),匿名函數(shù)里面的 choose[i] 保存著對(duì) i 的引用,注意只是保存著引用,沒有把當(dāng)前 i 的值直接賦值到每個(gè) choose[i]。

隨后 for 循環(huán)執(zhí)行完畢,正常情況下執(zhí)行完 for 循環(huán),i 就會(huì)被垃圾回收器回收,但是這里匿名函數(shù)保存了對(duì) i 的引用,所以 i 沒有被回收,執(zhí)行完 for 循環(huán)后,i = choose.length,還繼續(xù)留著內(nèi)存里。

而當(dāng)點(diǎn)擊后觸發(fā) onclick 事件時(shí),被賦值給 onclick 的匿名函數(shù)被執(zhí)行,這時(shí)候開始把 i 的值賦值給匿名函數(shù),而此時(shí) for 循環(huán)已經(jīng)執(zhí)行完畢,i = choose.length,choose[i] 當(dāng)然是 undefined了,也就無法讀取 checked 屬性了。


問題2.

為什么第二段代碼,結(jié)果只彈出一個(gè)5

該循環(huán)給同一元素添加了5次點(diǎn)擊事件的綁定,但onclick方式只能為元素綁定一個(gè)點(diǎn)擊事件,后續(xù)的綁定只會(huì)覆蓋而不會(huì)追加,問題不在循環(huán),在于事件綁定的方式

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 1. Java基礎(chǔ)部分 基礎(chǔ)部分的順序:基本語(yǔ)法,類相關(guān)的語(yǔ)法,內(nèi)部類的語(yǔ)法,繼承相關(guān)的語(yǔ)法,異常的語(yǔ)法,線程的語(yǔ)...
    子非魚_t_閱讀 34,697評(píng)論 18 399
  • 三、閉包和高階函數(shù) 3.1 閉包 3.1.1 變量的作用域 所謂變量的作用域,就是變量的有效范圍。通過作用域的劃分...
    梁同學(xué)de自言自語(yǔ)閱讀 1,551評(píng)論 0 6
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,564評(píng)論 19 139
  • 一晃三年的時(shí)間,我們的愛情不知不覺經(jīng)經(jīng)歷了三年的風(fēng)風(fēng)雨雨,分分合合,每每想起都是帶著傷痛卻又無奈的回味,我不知道...
    斷橋的雨閱讀 340評(píng)論 0 0
  • 每一段路只要還有不甘心就還沒盡頭 好的一面是永不放棄 相反的就是拿的起放的下 不屬于你的又一直煩擾你的早點(diǎn)放手 昔...
    神奇的面條閱讀 221評(píng)論 0 2

友情鏈接更多精彩內(nèi)容