lodash에 대해 알아보기

안녕하세요. 남산돈가스입니다.

오늘은 Javascript의 유용한 라이브러리인 Lodash에 대해서 알아보려고 합니다.

lodash는 공식문서에 모듈성, 성능 등을 제공하는 모던 자바스크립트 유틸리티 라이브러리로써 array, object, string 등의 데이터를 쉽게 다룰 수 있도록 도와준다고 소개하고 있습니다.

설치

공식문서에 따르면, lodash는 브라우저 / Node.js 환경에서 모두 지원하고 있습니다.

브라우저 :

<script src="lodash.js"></script>

Node.js : 

$ npm i --save lodash    // npm을 이용하여 설치

// lodash 라이브러리 전체 로드
var _ = require('lodash');
// 코어 모듈 로드
var _ = require('lodash/core');

// 메소드 그룹 별 로드
var array = require('lodash/array');
var object = require('lodash/fp/object');
 
// 메소드 별 로드
var at = require('lodash/at');
var curryN = require('lodash/fp/curryN');

유용한 메서드

lodash가 지원하는 기능들은 너무나도 많기 때문에 저는 대표적으로 각 그룹 별 메소드에서 유용하게 쓰일만한 메소드를 소개해드리겠습니다.

더 구체적인 기능들을 원하신다면 Lodash 공식문서에서 확인하실 수 있습니다.

Array

_.fill(array, value, [start=0], [end=array.length])

단어 그대로 입력받은 array에 value을 채워넣는 메소드입니다. start, end는 option이며 입력 시 start - end index에만 value를 fill 합니다. default는 0부터 array.length까지 (즉, array 전체) 입니다.

var array = [1, 2, 3];
 
_.fill(array, 'a');
console.log(array);
// => ['a', 'a', 'a']
 
_.fill(Array(3), 2);
// => [2, 2, 2]
 
_.fill([4, 6, 8, 10], '*', 1, 3);
// => [4, '*', '*', 10]

_.findIndex(array, [predicate=_.identity], [fromIndex=0])

조건을 만족하는 데이터의 첫 번째 인덱스(중복 일 경우)를 반환한다. 만족하는 인덱스를 찾지 못한 경우 -1을 리턴한다.

var users = [
  { 'user': 'barney',  'active': false },
  { 'user': 'fred',    'active': false },
  { 'user': 'pebbles', 'active': true }
];
 
 // 배열 요소인 객체를 접근하여 검색. user가 'barney'인 객체의 인덱스
_.findIndex(users, function(o) { return o.user == 'barney'; });
// => 0
 
_.findIndex(users, { 'user': 'fred', 'active': false });
// => 1

_.findIndex(users, { 'user': 'fred', 'active': false });
// => -1

_.pull(array, values...*)

입력한 array에서 입력한 values 값들을 찾아 제거한 배열을 반환한다.

var array1 = ['a', 'b', 'c', 'a', 'b', 'c'];
_.pull(array1, 'a', 'c');
console.log(array1);
// => ['b', 'b']

var array2 = ['a', 'b', 'c', 'a', 'b', 'c'];
_.pull(array2, 'a', 'b', 'c')
console.log(array2)
// => []

 

_.uniq(array)

입력한 array의 요소들 중 중복값을 제거한 배열을 반환한다.

var array = [1,false,"2", 2, 0, "0", 0 ,1, 2, false]
console.log(_.uniq(array))
// => [ 1, false, '2', 2, 0, '0' ]

Object

_.assign(object, [sources])

object를 할당하는 메소드입니다. 맨 왼쪽 object가 destination이고 right로 오는 object들을 destination에 할당합니다. destination에 이미 값이 있으면 overwrite 됩니다.

var object = _.assign({ b : 1}, { a : 3 }, { b : "hello" } , { b : "hi~"} )
// => { b: 'hi~', a: 3 }

_.has(object, path)

입력받은 path에 해당하는 경로 또는 element가 object에 있는 지 확인합니다. 리턴은 boolean 입니다. 깊이가 있는 object의 경우 path에 기본적으로 javascript에서 제공하는 접근자 . 을 이용하여 경로를 표현할 수 있으며 배열로 표현 시 배열 입력 순서대로 . 으로 join 되어 경로를 확인합니다.

var object = { 'a': { 'b': 2, 'c' : { 'd' : 3 } } };

_.has(object, 'a');
// => true

_.has(object, 'a.b');
// => true

_.has(object, 'a.c.d');
// => true

_.has(object, ['a', 'c', 'd']);
// => true