在使用 jQuery 時,我們經(jīng)常會看到一些鏈式調(diào)用的代碼:
$('body').addClass('class1').removeClass('class2').html('Hello, world!');
這樣的代碼看起來很簡潔,但是卻存在一些壞處。
首先,這樣的代碼難以進行調(diào)試和維護。如果代碼出現(xiàn)了問題,我們很難知道是哪個方法出了問題。此時只能夠一個個分開調(diào)試。并且這種方式還會讓我們產(chǎn)生錯覺,認為這是一個長長的語句,實際上它被分成了多個方法調(diào)用。
其次,這樣的代碼對于代碼閱讀者來說很難理解。如果我們看到了一段長長的鏈式調(diào)用,我們需要破解這個調(diào)用來理解代碼的實際含義。這會浪費我們的時間,降低我們的效率。
最后,這樣的代碼違反了面向?qū)ο蟮木幊淘瓌t。在面向?qū)ο蟮木幊讨校總€對象都應該有自己的方法,并且應該盡可能地進行封裝,避免對外暴露實現(xiàn)細節(jié)。然而在這樣的鏈式調(diào)用中,我們操作的是同一個 jQuery 對象,并且暴露了 jQuery 對象的實現(xiàn)細節(jié)。
因此,我們應該避免使用過多的鏈式調(diào)用。對于需要多個操作的情況,可以將其分成多個獨立的語句,這樣可以使代碼更加易于閱讀和維護,同時也符合面向?qū)ο蟮木幊淘瓌t。