今天看RxJS文件，發現了一個新的js的工具類庫Lodash
今天看RxJS文件，發現了一個新的js的工具類庫Lodash
Lodash的官網地址為：https://lodash.com/
中文網為：https://www.lodashjs.com/
為什麼選擇 Lodash ？#
Lodash 通過降低 array、number、objects、string 等等的使用難度從而讓 JavaScript 變得更簡單。 Lodash 的模組化方法 非常適用於：
- 遍歷 array、object 和 string
- 對值進行操作和檢測
- 建立符合功能的函式
以下有一篇博文是對Lodash的介紹，博文的地址為：https://blog.csdn.net/qq_35414779/article/details/79077618
為防止丟失，原文貼到下邊
在ES6盛行，ES78馬上就要出來的情況下；我們還是需要懂得一些工具庫的使用，比較推薦的是lodash。
在下面就會談一談為什麼要使用lodash和lodash的基本使用。
首先要明白的是lodash的所有函式都不會在原有的資料上進行操作，而是複製出一個新的資料而不改變原有資料。類似immutable.js的理念去處理。
lodash是一套工具庫，內部封裝了很多字串、陣列、物件等常見資料型別的處理函式。
lodash的引用
import _ from 'lodash'
用一個數組遍歷來說明為什麼要使用lodash
常規陣列遍歷
agent.forEach(function (n,key) {
agent[key].agent_id = agent[key].agent_name;
return agent;
})
使用lodash來遍歷
_.forEach(agent,function(n,key) {
agent[key].agent_id= agent[key].agent_name
})
這是一個常見的forEach的陣列遍歷，使用了lodash過後，_.forEach()這是一個值，而不是一個函式。就可以直接
const arr = _.forEach();
這時候arr就是新的陣列agent。而在常規的js陣列遍歷中，還需要考慮return的值和this的指向問題。雖然這樣看起來，二者相差不大，但是在實際的開發過程中，熟練的使用lodash能大大的提高開發的效率。
再來總結一些lodash常用函式（還是推薦大家能去官網把所有的函式看一遍增加一些印象）
1.chunk，將陣列進行切分。（也是官網的第一個函式）
const arr = [1,2,3,4,5,6,7,8,9];
_.chunk(arr,2);
// =>[[1,2],[3,4],[5,6],[7,8],[9]]
這個函式把陣列按照一定的長度分開，返回新的陣列。（片段化陣列）
2.compact，去除假值。（將所有的空值，0，NaN過濾掉）
_.compact(['1','2',' ',0])
// => ['1','2']
對應的還有一個數組去重函式，這在實際的開發中很有作用。
3.uniq，陣列去重。（將陣列中的物件去重，只能是陣列去重，不能是物件去重。）
_.uniq([1,1,3])
// => [1,3]
這跟介紹的第二個函式compact有很好的配合作用。（後端介面傳來的資料很多是有重複或者空值的，這時候就可以使用兩個函式來過濾資料。ladash只是最基礎的庫，其實可以將幾個函式封裝起來元件自己的庫。）
4.filter和reject，過濾集合，傳入匿名函式。（二者放在一起討論的原因是，兩個函式類似但返回的值是相反。）
_.filter([1,2],x => x = 1)
// => [1]
_.reject([1,2],x => x=1)
// => [2]
這兩個過濾器，第二個引數值是false的時候返回是reject的功能，相反是true的時候是filter。
5.map和forEach，陣列遍歷。（相似）
如果不明白map和forEach有什麼相似的可以百度一下，簡單說一下不同點就是，map的回撥函式中是支援return返回值的。
不過二者都不改變原來的陣列。
_.map([1,2],x => x+1)
// => [2,3]
推薦使用map。
6.merge,引數合併。（merge函式像是Git的merge分支操作一樣，將兩個引數合併在一起。）
官網的解釋是，遞迴的將源物件和繼承的可列舉字串監控屬性合併到目標物件中。源物件從左到右引用，後續來源將覆蓋以前來源的屬性分配。
var object = {
'a': [{ 'b': 2 }, { 'd': 4 }]
};
var other = {
'a': [{ 'c': 3 }, { 'e': 5 }]
};
_.merge(object, other);
// => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }
這裡就像借用官網的程式碼來解釋一下了。在實際開發中，前端在介面的請求可以merge一下之前的query和現在改變的查詢的值，再去請求後端介面的資料。
7.extend，類似引數物件合併。
function Foo() {
this.a = 1;
}
function Bar() {
this.c = 3;
}
Foo.prototype.b = 2;
Bar.prototype.d = 4;
_.assignIn({ 'a': 0 }, new Foo, new Bar);
// => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }
8.cancat，陣列連線
var array = [1];
var other = _.concat(array, 2, [3], [[4]]);
console.log(other);
// => [1, 2, 3, [4]]
console.log(array);
// => [1]
可以接受多個引數，將多個引數合併為一個數組元素。
9.keys ，取出物件中所有的key值組成新的陣列。
function Foo() {
this.a = 1;
this.b = 2;
}
Foo.prototype.c = 3;
_.keys(new Foo);
// => ['a', 'b'] (iteration order is not guaranteed)
_.keys('hi');
// => ['0', '1']
類似object.keys()，返回物件中可列舉屬性的陣列。
————————————————
版權宣告：本文為CSDN博主「不帥的喆」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處連結及本宣告。
原文連結：https://blog.csdn.net/qq_35414779/article/details/79077618