Lo-Dash 與 underscore,Prototype 與 jQuery,兩段恩怨情仇

nyyb 9年前發布 | 9K 次閱讀 Prototype jQuery
 

這幾天更新我的之前寫的 Chrome 插件 ChromeSnifferPlus 可以探測正在使用的開源軟件或者 js 類庫 ,兩天的時間增加了 20 多個 js 庫的檢測,并重構了部分代碼,將版本升級到了 2.x。

今天想增加 lodash 的檢測代碼,可犯了愁了。

打開 lodash 的主頁,直接檢測為 Underscore。

足足研究了半個小時,真是說來話長啊。

一場恩怨,一段紛爭,一段歷史。

在 javascript 領域,最難處理的就是瀏覽器兼容的 DOM 操作。這時 Prototype 框架最先引入了 $ 符號,憑借其便利的多平臺兼容的 DOM 處理、Ajax 處理、以及一些輔助工具函數,受到開發者的青睞。后來 Ruby On Rails 崛起,并內置了 Prototype 庫,從此 Prototype 一炮而紅。

很快,這個 $ 被另一個框架所使用,就是我們熟知的 jQuery,同樣也是操作 DOM,Ajax 處理。但是 jQuery 很快就超過了 Prototype 的鋒芒。

現在很多前端開發者都不知道什么是 Prototype。也有部分開發者把 jQuery 當作 javascript。可見,前端大戰以 jQuery 的完勝而告終。

無疑,在目前瀏覽器不完全兼容的情況下,jQuery 提供的 API 是操作 DOM 的最佳選擇。

那么在一個沒有 DOM 世界會是怎樣的呢?

Node.js 的興起把我們帶到了一個沒有 DOM 和 BOM 的世界。我們需要的是函數、庫,我們要處理數字,處理字符串,處理數據…… 所有這些,jQuery 的 $ 沒有提供,那誰提供了呢?答案就是

Underscore 的 _

這個庫的名字叫 Underscore,而 Underscore 就是"下劃線"的意思。Underscore 給開發者帶來了什么呢?很酷的函數式思維。

當我們想把數組 ['left ', ' center ', ' right'] 中各個字符串元素兩邊的空白符去除,我們可以這樣:

_.map(['left  ', ' center ', '  right'], function (s) { return s.trim();
});

在寫前端代碼的時候,Underscore 一直是我使用次數排名第二的庫,第一是誰,當然是 jQuery 了。所以代碼里面滿屏都是 $_

就像 jQuery 替代了 Prototype 一樣,Underscore 也迎來了挑戰,那就是 lodash。Lodash 也使用 _ 符號,而且 Underscore 的所有函數 Lodash 全部包括,不僅如此 Lodash 還增加了很多 Underscore 沒有的函數。更可氣的是,只要 Underscore 添加了啥新功能時,Lodash 都會及時覆蓋更新,以維護它一如既往超集的地位(要臉不)。真正的殺手锏是,Lodash 函數的性能是 Underscore 的四五倍。

今天五月份,Underscore 的創造者 Jeremy Ashkenas 在一條 Github issue 中向 Lodash 的創造者 John-David Dalton 表明合并兩個庫的意愿。

然而社區的意見偏向于,lodash 是唯一選擇。

Babel 的貢獻者 James Kyle 認為,現狀不會改變。“所有的一切會一如既往地發展著,Lodash 會緩慢更新,但是一定會徹底替代 Underscore”。

如果看看 NPM 的 most depended-upon packages ,Lodash 名列第 1,而 Underscore 命令……那個……第 2 或者 第 4。(誰能告訴我這個是橫著看,還是豎著看)

上個月的下載量,Underscore 為 1 千多萬,而 Lodash 則是 2 千多萬。而 jQuery 呢,不到 1 百萬。

言歸正傳,繼續回到我的插件 ChromeSnifferPlus 上來。既然 lodash 是 Underscore 的超集,那就有辦法區分了。

之前的判斷都是通過特性判斷,也就是:如果支持某特性,或者包含某個函數,則認為加載了某個庫。比如判斷 jQuery:

window.jQuery && jQuery.prototype && jQuery.prototype.jquery

如果頁面沒有使用 jQuery 上面代碼返回 undefined ,如果使用了 jQuery 則返回 jQuery 的版本號。如果在當前頁面的控制器運行此段代碼,返回 "2.1.1" ,因為 segmentfault 使用了 jQuery,并且版本是 2.1.1。果然是開發者的社區,不需要兼容老舊的瀏覽器。

所以之前我的判斷代碼是 window._ && _.VERSION ,結果誤把 lodash 檢測為 Underscore 了。

既然是超集,我們可以找一個特性,這個特性 lodash 支持,而 Underscore 不支持,以此區分。隨便找一個函數,比如 attempt ,因此我們可以這樣檢測:

檢測 lodash:

window._  && typeof _.attempt === 'function' && _.VERSION

檢測 Underscore:

window._  && _.attempt === undefined && _.VERSION

不過,是時候放棄 Underscore,使用 lodash 了。

 本文由用戶 nyyb 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!