拒絕動(dòng)態(tài)event綁定

My_Oh_My 發(fā)布于2019-08-19 17:57 / 1793人閱讀

摘要：開(kāi)始流行的時(shí)候，大多數(shù)人更喜歡而不是，原因也很明顯粗暴簡(jiǎn)單有效。并且動(dòng)態(tài)綁定事件通常不是一個(gè)持續(xù)行為，只有那么一瞬間就把事件綁上了，但如果給添加了新元素，它不會(huì)自動(dòng)綁定事件，仍然需要在追加元素后再進(jìn)行綁定。如有不足的地方，歡迎指出。

jquery開(kāi)始流行的時(shí)候，大多數(shù)人更喜歡jQuery.bind("click")而不是onclick="click(this)"，原因也很明顯：粗暴簡(jiǎn)單有效。之后以下的代碼比較常見(jiàn)：

click

但同時(shí)產(chǎn)生出不少結(jié)構(gòu)性問(wèn)題。web前端不外乎html、 css、 javascript，可這三種代碼又截然不同，如何組織這些代碼成了頭痛問(wèn)題。在多數(shù)情況下HTML代碼量非常多，如果混合js一起閱讀會(huì)很難理解，html和js的關(guān)系變得越來(lái)越模糊，以上代碼如果拆分放置到兩處，甚至很難發(fā)現(xiàn)它們之間有關(guān)系。并且動(dòng)態(tài)綁定事件通常不是一個(gè)持續(xù)行為，只有那么一瞬間就把事件綁上了，但如果給document添加了新元素，它不會(huì)自動(dòng)綁定事件，仍然需要在追加元素后再進(jìn)行綁定。

現(xiàn)在有很多MVC, MVVM框架可以解決結(jié)構(gòu)性問(wèn)題，但對(duì)于大多數(shù)情況，我們并不需要一套框架，而只需要百余行代碼就能解決問(wèn)題，何必給頁(yè)面增加更多東西呢？

快速開(kāi)發(fā)是常態(tài)，它看起來(lái)不重要，但積少成多就變得十分重要。我們應(yīng)該在開(kāi)始編寫(xiě)這些看似微不足道的代碼前去考慮如何把緊耦合關(guān)系變松。從以上代碼可見(jiàn)耦合度高是因?yàn)殛P(guān)系信息少，而且難以重用，所以我認(rèn)為應(yīng)該在之間增加一層關(guān)系。

click

Action是個(gè)不存在的object，但其實(shí)要實(shí)現(xiàn)這個(gè)object的效果很簡(jiǎn)單，不需要很長(zhǎng)的開(kāi)發(fā)經(jīng)驗(yàn)就可以辦到，并且不需要jquery。代碼看上去簡(jiǎn)單，但輕松解決了以上我提到的問(wèn)題。如有不足的地方，歡迎指出。