lodash란? ( 유사 underscore )
javascript를 확장하여, 편리하게 코드를 작성하거나 웹표준에 효율적으로 맞출 수 있게 해주는 Node.js 패키지
( 기본 javascript보다 실행속도가 빠르거나 느릴 수 있다. - 편리한 코드작성을 위한 것이므로 )
lodash 설치하기
npm install lodash
lodash 사용하기
// javascript 환경에서 사용하기 ( 아래 명령어는 둘다 같은 역할 )
import _ from 'lodash';
var _ = require('lodash');
// html 스크립트에 추가할 때
<script src="lodash.js"></script>
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.20/lodash.min.js
배열에서 첫 번째 요소 가져오기 (_.head)
// _.head(배열) 형식으로 사용
_.head([1, 2, 3]);
// => 1
_.head([]);
// => undefined
배열에서 마지막 요소 가져오기 (_.last)
// _.last(배열) 형식으로 사용
_.last([1, 2, 3]);
// => 3
랜덤 값 만들기 (_.sample)
// _.sample(배열) 형식으로 사용
_.sample([1, 2, 3, 4]);
// => 2
배열 요소끼리 연결하기(_.join)
// _.join( 배열, 연결하고 싶은 것 ) 형식으로 사용
_.join(['1', '2', '3'], '/')
// => 1/2/3
경로상의 object에서 값을 가져오기 (_.get)
var object = { 'a': [{ 'b' : { 'c' : 3 } }] };
// _get( object, path, [defaultValue] ) 형식으로 사용
_.get(object, 'a[0].b.c');
// => 3
_.get(object, ['a', '0', 'b', 'c']);
// => 3
_.get(object, 'a.b.c', 'default');
// => 'default
정보 하나하나 마다 함수 적용하고 출력하기 (_.each / _.forEach)
// _.each( 적용 대상, 함수 ) 형식으로 사용
_.each([1, 2], function(value){
console.log(value);
});
// => '1' '2'
_forEach({'a':1, 'b':2}, function(value, key){
console.log(key);
});
// => 'a' 'b'
경로상의 object에서 값을 가져오기 (_.partition)
var cards = [
{suit: 'clubs', val: '1', desc: 'ace'},
{suit: 'spades', val: '11', desc: 'jack'},
{suit: 'hearts', val: '5', desc: '5'},
{suit: 'hearts', val: '6', desc: '6'},
{suit: 'diamonds', val: '7', desc: '7'},
{suit: 'clubs', val: '13', desc: 'king'},
{suit: 'hearts', val: '12', desc: 'queen'},
];
let i = 0;
// _.partition( object, path, [defaultValue] ) 형식으로 사용한다
_.each(_.partition(cards,
// path
function(card){
// val값이 11보다 높은 카드 반환
return card.val >= 11;
}),
// each 적용함수 (partition 리턴값을 part로 사용)
function(part){
console.log('** part: ' + i + ' **');
// 또 다른 each 사용
_.each(part, function(card){
console.log(card.desc);
}
);
i += 1;
});
/* 출력
** part: 0 **
jack
king
queen
** part: 1 **
ace
5
6
7
*/
정보 하나하나 마다 함수 적용하고 배열로 만들기 (_.map)
function square(n) {
return n * n;
}
// _.map( 적용 대상, 함수 ) 형식으로 사용한다.
_.map([4, 8], square);
// => [16, 64]
_.map({'a':4, 'b':8}, square);
// => [16, 64] ( 순서 랜덤 ?? )
var users = [
{ 'user': 'barney' }
{ 'user': 'fred' }
];
_.map(users, 'user');
// => ['barney', 'fred']
반응형