こんにちは。AG-Boost事業部開発部の意思崎です。現在AG-Boostというサービスのフロント、バックエンドの開発を行っております。

AG-Boost開発部ではサーバーにnodejs , フロントでreactを使って開発しているのでとにかくJavaScriptにお世話になりまくっています。その中でもフロント、サーバーのどちらでもお世話になっているライブラリの「Lodash」について好きな関数となぜ好きなのかを書いていこうと思います。

Lodashとは

A modern JavaScript utility library delivering modularity, performance & extras. と公式では書いていますが、便利な関数をまとめて提供しているライブラリです。object, 配列などの操作が特に多いイメージがあります。

なぜ好きなのか

私はかなり面倒くさがりな人間です。コードの記述量が増えるのが嫌いです。コードたくさん書くと疲れてしまうので。 nullチェックを頑張りたくないです。そりゃ、頑張らなくて良いなら頑張りたくないですよね。

と、言った理由でLodashを使用することにより、上記の問題を解決しています。

とりあえず好きな関数

_.map

returnした内容の配列を返してくれる便利なやつです。使い方は以下な感じ

const list = [
  { name: 'test1', age: 20 },
  { name: 'test2', age: 21 },
  { name: 'test3', age: 22 }
];

 >_.map(list, (item) => { return item.name }); 
[ 'test1', 'test2', 'test3' ]

const obj = { name: 'test1', age: 22, height: 170, weight: 100 };
> _.map(obj, (val, key) => { return key }); 
[ 'name', 'age', 'height', 'weight' ]

Array.prototype.map()でもほぼ同じことができるのですが、nullチェックなどをしないといけませんし、コード記述量が減るので重宝しています。

_.isEmpty

引数が、false, undefined, null, 0, ''の時 !hoge でtrueになるもの及び空オブジェクト、空配列に関してもtrueを返してくれます。

> _.isEmpty(false);
true
> _.isEmpty([]);
true
> _.isEmpty({});
true
> _.isEmpty(undefined);
true
> _.isEmpty(0);
true
> _.isEmpty('');
true
> _.isEmpty({ test: 'aaa '});
false

オブジェクトが空かどうかを調べるのが楽に書けるのが良いですね。実にありがたい。

_.get

オブジェクトや配列の中身を取得するのに使う関数です。存在しないpathの場合は第2引数のdefault値を返してくれます。

const list = [
   { name: 'test1', age: 20 },
   { name: 'test2', age: 21 }, 
   { name: 'test3', age: 22 }
];


> _.get(list, '1.age');
21

> _.get(list, [1, 'age']);
21

> const index = 1;
> _.get(list, [index, 'age']);
21

> _.get(list, [4, 'age'], 99);
99

参照エラーのことを気にせずにコードを書ける点がありがたいです。

> _.get(list, [4, 'age'], 99);
21

の代わりに
(list[4] || {}).age || 99;

と書くこともできますが、_.getを使ったほうが断然見やすいです。

おまけ

_.sample

配列の中から１つランダムに要素を取得します。

const list = [
   { name: 'test1', age: 20 },
   { name: 'test2', age: 21 }, 
   { name: 'test3', age: 22 }
];

> _.sample(list);
{ name: 'test3', age: 22 }
> _.sample(list);
{ name: 'test2', age: 21 } // 毎回違いますね。

そんな頻繁に使うことは無いと思いますが、

list[Math.floor(Math.random() * list.length)];

と書くよりは良いでしょう。

終わりに

lodashを使うとファイルサイズが結構増えるなど言われてますが、それでも面倒なので使い続けると思います。

SO Technologies 開発者ブログ

私は好きですLodash