→ 모듈성, 성능 및 추가 기능을 제공하는 최신 JavaScript 유틸리티 라이브러리이다
→ 라이센스는 MIT 라이센스로 Object, Array 등의 데이터 구조를 쉽게 변환하는 기능을 제공해준다.
설치
npm i -g lodash
import
import _ from "lodash"
※ 기본적으로 _ 로 명시해주나, _가 아닌 다른 이름으로 하여도 됨.
1. defaultTo
기본값 설정 값이 있으면 해당 값을 저장, 값이 비어있으면(null or undefined) 일 경우 기본값을 저장
사용법
let a = 100;
a = _.defaultTo(a, 1);
console.log("100 default :", a);
a = undefined;
a = _.defaultTo(a, 1);
console.log("undefined default :", a);
a = "";
a = _.defaultTo(a, 1);
console.log('"" default :', a);
a = null;
a = _.defaultTo(a, 1);
console.log("null :", a);
결과
100 default : 100
undefined default : 1
"" default :
null : 1
2. uniqBy와 unionBy
중복된 값이 있을 때 중복된 값을 제거
사용법
const fruit1 = [
{ id: 1, name: "apple" },
{ id: 2, name: "banana" },
{ id: 3, name: "cherry" },
];
const fruit2 = [
{ id: 2, name: "orange" },
{ id: 4, name: "apple" },
];
// 두개 배열 병합
const fruit = fruit1.concat(fruit2);
// 중복 제거
const uniqBy = _.uniqBy(fruit, "id");
// 병합 후 중복제거
const unionBy = _.unionBy(fruit1, fruit2, "id");
console.log("fruit1:", fruit1);
console.log("fruit2:", fruit2);
console.log("fruit:", fruit);
console.log("fruit uniqBy:", uniqBy);
console.log("fruit unionBy:", unionBy);
한개의 배열에서 중복을 제거할 때는 uniqBy 두개 이상의 배열을 병합 시 중복제거 할 때는 unionBy를 사용한다.
결과
fruit1: (3) [{…}, {…}, {…}]
0: {id: 1, name: 'apple'}
1: {id: 2, name: 'banana'}
2: {id: 3, name: 'cherry'}
length: 3[[Prototype]]: Array(0)
fruit2: (2) [{…}, {…}]
0: {id: 2, name: 'orange'}
1: {id: 4, name: 'apple'}
length: 2[[Prototype]]: Array(0)
fruit:
(5) [{…}, {…}, {…}, {…}, {…}]
0:{id: 1, name: 'apple'}
1:{id: 2, name: 'banana'}
2:{id: 3, name: 'cherry'}
3:{id: 2, name: 'orange'}
4:{id: 4, name: 'apple'}
length: 5[[Prototype]]:Array(0)
fruit uniqBy:
(4) [{…}, {…}, {…}, {…}]
0:{id: 1, name: 'apple'}
1:{id: 2, name: 'banana'}
2:{id: 3, name: 'cherry'}
3:{id: 4, name: 'apple'}
length:4[[Prototype]]:Array(0)
fruit unionBy:
(4) [{…}, {…}, {…}, {…}]
0: {id: 1, name: 'apple'}
1: {id: 2, name: 'banana'}
2: {id: 3, name: 'cherry'}
3: {id: 4, name: 'apple'}
length: 4[[Prototype]]: Array(0)
3. find, findIndex
배열 내에 조건에 해당하는 데이터 찾기 또는 데이터의 인덱스 찾기
사용법
console.log("fruit find :", _.find(uniqBy, { id: 2 }));
console.log("fruit findIndex :", _.findIndex(uniqBy, { id: 2 }));
결과
fruit find : {id: 2, name: 'banana'}
fruit findIndex : 1
4. remove
배열의 조건에 해당하는 데이터 삭제
사용법
_.remove(uniqBy, { id: 2 });
console.log("fruit remove :", uniqBy);
결과
fruit remove : (3) [{…}, {…}, {…}]
0:{id: 1, name: 'apple'}
1:{id: 3, name: 'cherry'}
2:{id: 4, name: 'apple'}
length:3[[Prototype]]:Array(0)
5. shuffle, sortBy, sortBy revers
배열의 순서 랜덤으로 섞기, 배열의 오름차순, 내림차순정렬
사용법
const shuffle = _.shuffle(fruit);
console.log("fruit shuffle :", shuffle);
const sort = _.sortBy(shuffle, "id");
console.log("fruit sortBy :", sort);
const reverse = sort.reverse();
console.log("fruit sortBy revers:", reverse);
결과
fruit shuffle :(5) [{…}, {…}, {…}, {…}, {…}]
0:{id: 2, name: 'banana'}
1:{id: 2, name: 'orange'}
2:{id: 4, name: 'apple'}
3:{id: 1, name: 'apple'}
4:{id: 3, name: 'cherry'}
length:5[[Prototype]]:Array(0)
fruit sortBy :(5) [{…}, {…}, {…}, {…}, {…}]
0:{id: 1, name: 'apple'}
1:{id: 2, name: 'banana'}
2:{id: 2, name: 'orange'}
3:{id: 3, name: 'cherry'}
4:{id: 4, name: 'apple'}
length:5[[Prototype]]:Array(0)
sortBy revers:(5) [{…}, {…}, {…}, {…}, {…}]
0:{id: 4, name: 'apple'}
1:{id: 3, name: 'cherry'}
2:{id: 2, name: 'orange'}
3:{id: 2, name: 'banana'}
4:{id: 1, name: 'apple'}
length:5[[Prototype]]:Array(0)