網頁制作poluoluo文章簡介:jQuery 最出色最讓人戀戀不捨的是它的 API 設計。
jQuery 將馬上發布 1.4 正式版,代碼也從 googlecode 上遷移到了 github. jQuery 是我接觸的第一個 JS 類庫,俗話說初戀總是讓人難以忘記。一年以前,這種難以忘記僅僅是一種純感覺,說不出來具體原因。前幾天重新看了一遍 github 上的源碼。從純功能上說,jQuery 並沒有特別出色的地方。究竟是什麼讓我如此戀戀不捨呢?
昨天搭建 taskspeed, 檢查 jQuery 的測試代碼時,突然明曉了一個也許大家都已知道的秘密:
jQuery 最出色最讓人戀戀不捨的是它的 API 設計。
比如 dom-style 的 api, YUI3 和 MooTools 等框架采用的是傳統方式:
el.setStyle(prop, val); el.getStyle(prop); el.setStyles({ propA: valA, propB: valB }); el.getStyles(propA, propB); // MooTools 支持
在 jQuery 裡,一個 css 方法全部搞定:
el.css(prop); // 表示 getStyle el.css(prop, val); // 表示 setStyle el.css({ propA: valA, propB, valB }); // 表示 setStyles el.css(prop, func); // func 是一個返回 val 值的函數
對比以上兩種 API 設計,乍一看 jQuery 顯得不那麼“標准”。但從可記憶性和靈活性上講,我覺得 jQuery 的設計都更人性化。jQuery 的 API 還符合學習上的漸進式思維:先學會最簡單的情況el.css(prop), 再了解到還可以有兩個參數,接著發現參數可以是 map, 更進一步發現 val 還可以是一個函數。func 參數甚至能帶給學習者一種驚喜:居然還可以這樣用!jQuery 把一種漸進和愉悅帶進了學習和使用的過程中,實在漂亮!
YUI3 的 API 缺少這種樂趣。查詢 jQuery 的 API, 會有一種探尋秘密的尋寶感覺。YUI 的文檔查詢則讓人感覺就是份工作,有點 boring.
和 YUI2 相比,YUI3 的 API 做了些改變。在 YUI2 裡,YAHOO.util.Dom 的方法名,嚴格以動詞開頭,雖然有些方法名長點,但總體規律性很強,可記憶性還不錯。在 YUI3 裡,則出現了 byId, elementByAxis 等方式命名的方法。純粹為了省幾個字符?這種不一致性很納悶。還有一些以名詞命名的方法:ancestor, docHeight, 乍一看很難以為是方法。
老婆說,要睡覺了,就不碼字了。最後說一句:YUI3 的 API 整體還是挺不錯的,比如 Node 的方法命名,就非常嚴謹。ancestor 也是為了對應 next, prev 等命名。也就是說:Y.Dom 其實已變成了內部 API, 不鼓勵用戶直接調用。
但是不知為什麼,我還是覺得 jQuery 的 API 設計高出一個層次,套用一句流行話就是:
jQuery API 的用戶體驗更好。