Lodash常用API筆記

Yujiaao 發布于2019-08-20 15:12 / 3417人閱讀

摘要：中文文檔目前我只找到了版本，現在已經更新到了，好多文檔已經過期。而且中太多，有時候常用的幾個我總是記不住名字，在這里貼出來，方便自己和大家。原生用法直接使用的根據條件去除某個元素。

lodash中文文檔目前我只找到了3.10.x版本，現在lodash已經更新到4.17.x了，好多文檔已經過期。而且lodash中api太多，有時候常用的幾個我總是記不住名字，在這里貼出來，方便自己和大家。

原生用法

直接使用的API

_.reject

根據條件去除某個元素。

var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
var bar = _.reject(foo, ["id", 0])

//bar = [{id: 1, name: "bbb", age: 25}]

_.pick

根據第二個參數的key的數組，篩選第一個參數中的值并返回

var foo = {id: 0, name: "aaa", age: 33}
var bar = _.pick(foo, ["name", "age"])
//bar = {name: "aaa", age: 33}

_.keys

返回object中的所有key

var foo = {id: 0, name: "aaa", age: 33}
var bar = _.keys(foo)
//bar = ["id", "name", "age"]

_.cloneDeep

深度拷貝，這個不用多說了吧，js中基礎類型以外的類型，都會默認拷貝備份
var bar = _.cloneDeep(foo)

_.find

查找數組

var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
var bar = _.find(foo, ["id", 0])
//bar = {id: 0, name: "aaa", age: 33}

注意一下如果沒找到的話，會返回undefined，要處理一下

_.keyBy

以某個屬性為鍵，將數組轉為對象

var foo = var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
var bar = _.keyBy(foo, "name")
//bar = {
//    aaa: {id: 0, name: "aaa", age: 33},
//    bbb: {id: 1, name: "bbb", age: 25}
//}

_.filter

根據條件過濾出符合條件的元素，返回新數組

var foo = var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
var bar = _.filter(foo, ["name", "aaa"])
//bar = [{id: 0, name: "aaa", age: 33}]

_.map

從集合中挑出一個key，將其值作為數組返回

var foo = var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
var bar = _.map(foo, "name")
//bar = ["aaa", "bbb"]

_.max/_.min/_.sum

數組中最大值、最小值、數組求和

var foo = [1, 2, 3, 4]
var bar = _.max(foo)
//bar = 4
bar = _.min(foo)
//bar = 1
bar = _.sum(foo)
//bar = 10

_.pad/_.padStart/_.padEnd

在兩端、開頭、末尾補齊字符

var foo = "helloworld"
var bar = _.pad(foo, 14, "-")
//bar = --helloworld--
bar = _.padStart(foo, 14, "-")
//bar = ----helloworld
bar = _.padEnd(foo, 14, "-")
//bar = helloworld----

組合用法

如果說上面是基礎技能，那么下面奉上幾個炫酷的組合技：

選出json數組中id最大的一項

var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
var bar = _.find(foo, ["id", _.max(_.map(foo, "id"))])
// bar = {id: 1, name: "bbb", age: 25}

ps:也可以用maxBy某個key來代替

更新json數組中某一項的值

var foo = [
    {id: 0, name: "aaa", age: 33},
    {id: 1, name: "bbb", age: 25}
]
let list = _.keyBy(foo, "id")
list[0].name = "ccc"
var bar = _.map(list)
// bar = [
//    {id: 0, name: "ccc", age: 33},
//    {id: 1, name: "bbb", age: 25}
//]

GPU云服務器云服務器常用api接口 api接口常用數據 lodash cdn lodash

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/82088.html

前端文檔收集

摘要：系列種優化頁面加載速度的方法隨筆分類中個最重要的技術點常用整理網頁性能管理詳解離線緩存簡介系列編寫高性能有趣的原生數組函數數據訪問性能優化方案實現的大排序算法一怪對象常用方法函數收集數組的操作面向對象和原型繼承中關鍵詞的優雅解釋淺談系列 H5系列 10種優化頁面加載速度的方法隨筆分類 - HTML5 HTML5中40個最重要的技術點常用meta整理網頁性能管理詳解 HTML5 ...

jsbintask 2019-08-21 12:05 評論0 收藏0
前端文檔收集

摘要：系列種優化頁面加載速度的方法隨筆分類中個最重要的技術點常用整理網頁性能管理詳解離線緩存簡介系列編寫高性能有趣的原生數組函數數據訪問性能優化方案實現的大排序算法一怪對象常用方法函數收集數組的操作面向對象和原型繼承中關鍵詞的優雅解釋淺談系列 H5系列 10種優化頁面加載速度的方法隨筆分類 - HTML5 HTML5中40個最重要的技術點常用meta整理網頁性能管理詳解 HTML5 ...

muddyway 2019-08-29 13:21 評論0 收藏0
Lodash的學習筆記（一）有意思的API

摘要：是函數柯里化的函數。例子柯里化有個常見作用參數復用構建高階函數延遲計算。是的，它其實就是柯里化的具體應用構建高階函數。這個是我認為的中最有意思的方法。不過要注意最后的。這同樣是用來組合高階函數的一個方法。最近在學習JS函數式編程相關的內容，于是詳細的翻看了Lodash的文檔，感到別有洞天。這里把自己對一些API的使用和看法做個筆記記錄下。 Array _.head/_.last 例子...

BingqiChen 2019-08-19 18:15 評論0 收藏0
Vue學習筆記（一）

摘要：一介紹也稱為，讀音類似，錯誤讀音，由華人尤雨溪開源并維護。隱藏四事件之前說了一些關于事件的指令，這里詳細學習一下事件的相關知識。還有一些其他鍵盤事件，具體參考官方文檔。模板就是，用來進行數據綁定，顯示在頁面中，也稱為語法。一、Vue.js介紹 Vue.js也稱為Vue，讀音類似view，錯誤讀音v-u-e，由華人尤雨溪開源并維護。 Vue有以下特點：是一個構建用戶界面的框架是一...

baoxl 2019-08-30 13:47 評論0 收藏0