Lodash 筆記

情境用法

字串拿掉

```javascript
const text = "azertyazerty";
const result = _.replace(text, /az/g, "qu");
```

• 找尋 array 是否存在這個item > 回傳boolean

  • _.includes(<array>,<欲判斷的item>)

把一個 array 裡的重複項拿掉

• _.uniqBy(data, 'id');

要比對兩個array, 拿掉重複到的?

```javascript
const excludeSelected = _.reduce(
  <array2>, _.reject, <array1>
);
```

要篩出兩個array一樣的部分

• _.intersection(<array1>,<array2>)

要比對兩個陣列拿掉重複到的items ?

• _.difference(<arr1>, <arr2>)
• 注意是掃描 arr1 裡遇到 arr2 有的就拿掉

某個 array 篩掉有符合 {key:value} 的 items

是有符合條件的 “一群” - _.filter(<array>, _.match({"key":"value"}))

#加總某陣列

- `_.reduce`

從某array刪除東西

- `_.pullAt(arr , [1,3,4])`
- 代表拿掉 index 為 1, 3, 4 的item
- 是 side effect 所以原本的 array 會被動到

#更新陣列中某item

const newArr = arr.map((a) => {
    a.id === 1 ? {id: 1, name: "Person New Name"} : a
);

#把某陣列依序塞進某巢狀obj裡

const finalSloSource = {
    ...sloSource,
    service: _.zipObject(["namespace", "kind", "name"], arr),
};

• 等於把 array 的值依序塞進 sloSource.service 成為 namespacr, kind, name的value

注意

• _.find(<array>, <object>)
  • 只能返回 “一個符合的item”
  • (而且還是第一個遇到的就抓！)

相似比較

• _.without vs _.reject
  • 都可以從array裡剔除相符條件的item
  • _.without是要完全符合，item一模模一樣樣才會拿掉，較嚴謹
  • _.reject比較寬鬆，只要有符合就可以拿掉

比對前後台的obj

- `_.omit` 消減 v.s. `_.pick` 抓取符合的
- 用 `_.pick`會比較好

組合技

• 更新array裡面某個match到的item
  • 比對的obj不一樣
    • _.map(state.apps, d => ( d.app_id === action.basicInfo.app_id ? _.extend({}, d, action.basicInfo) : d )),
  • 比對的obj一樣 (直接replace，適合拿response來比對)
    • _.map(state.apps, d => (d.app_id === action.data.app_id ? action.data : d)),

方法說明

• _.map(array,callback)

  • 針對array依序做callback的動作回傳，最後return新的array
  • 如果callback放某個key的名字，則會列出”key符合”的item陣列

• _.isEqual

  • 判斷兩個obj的內容是否一樣 (相較於 === ＆ !== 比較寬鬆)
  • if(_.isEqual(<obj1>, <obj2>))

  • const object = { ‘a’: 1 }; const other = { ‘a’: 1 };

    _.isEqual(object, other); // => true

    object === other; // => false

• _.find(array,<相符的物件 or callback>)

  • 找陣列裏相符的obj並回傳
  • _.find(users, function(o) { return o.age < 40; }); _.find(users, { ‘age’: 1, ‘active’: true });

• _.omit(<指定obj>,<要拿掉的key值組成的array>)

  • 從object中濾掉某些值
  • const object = { ‘a’: 1, ‘b’: ‘2’, ‘c’: 3 }; _.omit(object, [‘a’, ‘c’]); // => { ‘b’: ‘2’ }

• _.flatMap

  • 依序對array執行function後再全部concat起來
  • _.flatMap(array, <callback>);
  • function duplicate(n) { return [n, n]; } _.flatMap([1, 2], duplicate); // => [1, 1, 2, 2]

• _.reduce

  • 一個一個執行callback並持續累計至某個值

• _.every vs _.some

• _.cloneDeep

  • 深層的複製某個object

• _.random(15, 20);

  • 產出在這區間隨機一個數字

• _.assign(,,)

  • 擴充object們，有點像concat，但前面會被後面的覆蓋

• _.times(<次數>, );

  • 重複執行x次callback，有點像for迴圈的感覺

• _.keys(