【JavaScript】Lodashの使い方まとめ

実務のアプリケーション開発でLodashを使っているため、忘備録を兼ねて使い方を記す。

Lodashとは

Lodash(ローダッシュ)は、JavaScriptで使用できる便利なユーティリティライブラリ。このライブラリは、配列、オブジェクト、文字列、関数、その他多くのデータ型に対する多くのヘルパー関数を提供してる。これにより、プログラミングタスクがより効率的かつ簡単になる。

公式ドキュメント:https://lodash.com/

インストール

npm i --save lodash

インポートは2つの方法がある。

1つ目は、_.に関数をつなげて利用する方法。

import _ from 'lodash';

_.map(/** */)

2つ目は、それぞれの関数を独立してインポートして使用する方法。ES6のモジュールシステムを使って、特定の関数だけをインポートすることができる。

import { difference } from 'lodash'

difference(/** */)

ヘルパー関数

uniq

配列内の重複データを排除する(プリミティブな値(数値、文字列、真偽値など)が格納された配列の場合に使用)。

import { uniq } from 'lodash'

const array = [1, 2, 2, 3, 4, 3, 5];
const uniqueArray = uniq(array);

//  [1, 2, 3, 4, 5]
console.log(uniqueArray);

uniqBy

配列内の重複データを排除する(オブジェクトが含まれている場合)。

以下は、特定のプロパティに基づいて重複を排除する例。

import { uniqBy } from 'lodash'

const objectArray = [
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Doe' }
];
const uniqueObjectArray = uniqBy(objectArray, 'id')

/**
 * {id: 1, name: 'John'}
 * {id: 2, name: 'Jane'}
 * {id: 3, name: 'Doe'}
 */
console.log(uniqueObjectArray);

difference

2つの配列を比較してユニークなデータだけを抽出する。

import { difference } from 'lodash'

const array1 = ['aaa', 'bbb', 'ccc'];
const array2 = ['aaa', 'bbb', 'ccc', 'ddd', 'eee'];

// ユニークなデータを抽出
const uniqueArray = difference(array2, array1);

//  ["ddd","eee"]
console.log(uniqueArray);

関連記事

コメント

この記事へのトラックバックはありません。