日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問(wèn) 生活随笔!

生活随笔

當(dāng)前位置: 首頁(yè) > 前端技术 > javascript >内容正文

javascript

JavaScript工具库之Lodash

發(fā)布時(shí)間:2025/4/9 javascript 33 豆豆
生活随笔 收集整理的這篇文章主要介紹了 JavaScript工具库之Lodash 小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

你還在為JavaScript中的數(shù)據(jù)轉(zhuǎn)換、匹配、查找等煩惱嗎?一堆看似簡(jiǎn)單的foreach,卻冗長(zhǎng)無(wú)趣,可仍還在不停的repeat it!也許你已經(jīng)用上了Underscore.js,不錯(cuò),你已經(jīng)進(jìn)步很大一步了。然而今天我希望你能更進(jìn)一步,利用lodash替換掉Underscore。

lodash一開(kāi)始是Underscore.js庫(kù)的一個(gè)fork,因?yàn)楹推渌?Underscore.js的)貢獻(xiàn)者意見(jiàn)相左。John-David Dalton的最初目標(biāo),是提供更多“一致的跨瀏覽器行為……,并改善性能”。之后,該項(xiàng)目在現(xiàn)有成功的基礎(chǔ)之上取得了更大的成果。最近lodash也發(fā)布了3.5版,成為了npm包倉(cāng)庫(kù)中依賴(lài)最多的庫(kù)。它正在擺脫屌絲身份,成為開(kāi)發(fā)者的常規(guī)的選擇之一。

現(xiàn)在我們所熟知的很多開(kāi)源項(xiàng)目都已經(jīng)使用或者轉(zhuǎn)到了lodash陣營(yíng)之上。比如JavaScript轉(zhuǎn)譯器Babel、博客平臺(tái)Ghost,和項(xiàng)目腳手架工具Yeoman。特別Ghost是從Underscore遷移到了lodash,Ghost的創(chuàng)始人John O’Nolan對(duì)于此曾評(píng)價(jià)到:“這是一個(gè)非常明智的選擇,它幾乎完全是由我們開(kāi)源開(kāi)發(fā)社區(qū)推動(dòng)的。我們發(fā)現(xiàn)lodash包含更多的功能,更好的性能、恰到好處地使用了semver,并且在Node.js社區(qū)(以及其他依賴(lài))中越來(lái)越搶眼“。

lodash演練

lodash主要使用了延遲計(jì)算,使得lodash其性能遠(yuǎn)遠(yuǎn)超過(guò)Underscore。在lodash中延遲計(jì)算意味著在我們的鏈?zhǔn)椒椒ㄔ陲@示或隱式的value()調(diào)用之前是不會(huì)執(zhí)行的。由于這種執(zhí)行的延后,因此lodash可以進(jìn)行shortcut fusion這樣的優(yōu)化,通過(guò)合并鏈?zhǔn)絠teratee大大降低迭代的次數(shù)。從而大大提供其執(zhí)行性能。

百說(shuō)不如一練,下面我們以用戶信息為例:

var users = [{ 'user': 'barney', 'age': 36 },{ 'user': 'fred', 'age': 40 },{ 'user': 'pebbles', 'age': 18 } ];

1.獲取所有用戶名字,并以”,“分割

var names = _.chain(users).map(function(user){return user.user;}).join(" , ").value(); console.log(names);

個(gè)人比較喜歡lodash延遲計(jì)算的現(xiàn)實(shí)value,以及JavaScript的函數(shù)式風(fēng)格。在這里首先將users對(duì)象包裝成為lodash對(duì)象,再map獲取所有用戶的名稱(chēng),并最后利用join將用戶名稱(chēng)以”,“連接在一起。注意這里只是一串方法鏈,如果你沒(méi)有顯樣的調(diào)用value方法,使其立即執(zhí)行的化,你將會(huì)得到如下的LodashWrapper延遲表達(dá)式:

LodashWrapper {__wrapped__: LazyWrapper, __actions__: Array[1], __chain__: true, constructor: function, after: function…}

因?yàn)檠舆t表達(dá)式的存在,因此我們可以多次增加方法鏈,但這并不會(huì)被執(zhí)行,所以不會(huì)存在性能的問(wèn)題,最后知道我們需要使用的時(shí)候,使用value顯式立即執(zhí)行即可。

2. 獲取最年輕的用戶

var youngest = _.chain(users).min(function(user){return user.age;}).value(); console.log(youngest);

這里利用了lodash提供的min函數(shù)可以輕易的解決。

在這里博主還希望用另外一個(gè)方式解釋lodash方法鏈的優(yōu)化,上面的方法可以等價(jià)為下面的方式,以age排序的第一個(gè)user:

var youngest2 = _.chain(users).sortBy("age").map(function(user){console.log("map", user);return user;}).first().value(); console.log(youngest2);

在這里博主多加了一個(gè)map作為log輸出,如果你執(zhí)行這行代碼的時(shí)候,你會(huì)驚奇的看見(jiàn)這里只會(huì)有一個(gè)user的輸出,這點(diǎn)可以證明在立即執(zhí)行的時(shí)候lodash為我們的方法鏈做了可靠的優(yōu)化;如果我們?nèi)サ鬴irst函數(shù)你則會(huì)看見(jiàn)有3個(gè)user對(duì)象的輸出。

3. 獲取最年長(zhǎng)的用戶

var oldest = _.chain(users).max(function(user){return user.age;}).value();console.log(oldest );

這里則使用lodash的max函數(shù)。

4. 用戶數(shù)組到用戶Map的轉(zhuǎn)換

在開(kāi)發(fā)中我們經(jīng)常會(huì)有把一堆素組形式的數(shù)據(jù)轉(zhuǎn)換為Object形式的數(shù)組,便于根據(jù)屬性key值查找,下面將以u(píng)ser對(duì)象來(lái)演示:

var userObj = _.chain(users).map(function(user){return [user.user, user.age];}).zipObject().value(); console.log(userObj);

利用lodash首先將user數(shù)組map為[key, value]的數(shù)組集合,最后利用zipObject將結(jié)果轉(zhuǎn)換為Object對(duì)象,zipObject會(huì)利用結(jié)果集的第一項(xiàng)作為key,第二項(xiàng)作為value生產(chǎn)Object。

結(jié)尾

我們?cè)谶@里展示知識(shí)lodash中很小一部分的API,正如隨筆開(kāi)始所說(shuō):lodash是為了提供更多“一致的跨瀏覽器行為……,并改善性能”API。所有的lodash API你可以在這里https://lodash.com/docs#matches查找。

本文的所演示的demo,你也可以在jsbin http://jsbin.com/xocixubaru/1/edit?html,js,output演示。

轉(zhuǎn)載于:https://www.cnblogs.com/whitewolf/p/4417873.html

總結(jié)

以上是生活随笔為你收集整理的JavaScript工具库之Lodash的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò),歡迎將生活随笔推薦給好友。