📚 Lodash 고차 함수 모음

Lodash - 고차 함수 정리

 

_.forEach()

• 배열, 객체 순회

 

lodash

_(obj).forEach(function(n) {
  console.log(n);
})

_.forEach(obj, function(val, key) {
  console.log(val, key);
});

// 간단한 별칭으로도 쓸 수 있다.
_.each(obj, (value, index, list) => {});

// 배열은 인자마다 순회합니다.
_([1, 2]).forEach(function(n) {
  console.log(n);
})
// 1
// 2


// object는 한개의 value와 키를 순회합니다.
_.forEach({ 'a': 1, 'b': 2 }, function(val, key) {
  console.log(val, key);
});
// 1 "a"
// 2 "b"

 

_.forIn()

• for .. in 문법을 함수로 표현

var users = {
  'a':  1,
  'b':  2,
  'c':  3
};
   
_.forIn(users, function(value, key) {
    if(value > 1) {
        console.log(key, value);
    }
});
// b 2
// c 3

 

_.filter()

• map()과 find()의 융합버젼. find로 찾은 인수들을 모아 map하여 배열로 반환
• 객체를 그대로 인자로 주어서 간편히 filter가 가능하다.
  
  
• 어느 형태의 키:값을 가지고있는 객체를 바로 뽑아쓸때 유용

const users = [
  { 'user': 'barney', 'age': 36, 'active': true },
  { 'user': 'fred', 'age': 40, 'active': false },
  { 'user': 'pebbles', 'age': 1, 'active': true },
  { 'user': 'smith', 'age': 1, 'active': false }
];

// es6의 users.filter()는 인자값이 객체인경우, 이를 풀어서 하나하나 구현해야 하지만, 
// 로다쉬는 파라미터만 쓰면 알아서 된다.

_.filter(users, function(o) { // 고차함수 인자
	return !o.active; 
});
// => [{"user":"fred","age":40,"active":false}, {"user":"smith","age":14,"active":false}]


_.filter(users, { 'age': 1, 'active': true }); // 해당 객체모양을 포함하는 객체 탐색
// => [{"user":"barney","age":1,"active":true}]


_.filter(users, ['active', false]); // {active:false} 탐색. 배열 형태로 써도 된다.
// => [{"user":"fred","age":40,"active":false}, {"user":"smith","age":14,"active":false}]


_.filter(users, 'active'); // {active:true} 탐색. boolean일 경우 그냥 써도 된다.
// => [{"user":"barney","age":36,"active":true}, {"user":"pebbles","age":1,"active":true}]

​

_.map()

• 순회하여 얻은 값들을 모아 배열로 반환
• 배열 뿐만 아니라 썡 객체도 순회 가능
  
  
• 객체의 특정 키의 밸류들을 골라 모아 배열로 만들때 유용
  객체를 객체 배열로 재구성할때 유용
  

var sites = [
  { no: 1, name: 'web' }, 
  { no: 2, name: 'is' }, 
  { no: 3, name: 'free' },
];
 
_.map(sites, 'name'); // 키값이 name인 value를 모아 배열 반환
// [ 'web', 'is', 'free' ]

_.map(sites, 'no'); // 키값이 no인 value를 모아 배열 반환
// [ 1, 2, 3 ]

let obj = { 
	'x': 14, 
    'y': 28 
}
   
let mapped_array = _.map(obj, function square(n) {
  return n * n;
})
// [ 196, 784 ]

const data = {
  a: 20,
  b: 30,
  c: 10,
}

/* 위와같은 데이터를 아래와 같이 변경하고 싶다면? (count순으로 내림차순 정렬되있다.)
const data2 = [
  {
    type: 'b',
    count: 30
  },
  {
    type: 'a',
    count: 20
  },
  {
    type: 'c',
    count: 10
  }
]*/

// 객체를 돌때는 [밸류, 키] 로 받아 사용할 수 있다.
const data2 = _
  .chain(data)
  .map((count, type) => ({ // 객체에 덧붙여서 객체를 반환
    type: type,
    count: count,
  }))
  .orderBy(['count'], ['desc']) // 객체를 count키값 기준으로 내림차순 정렬
  .value() // chain 을 썼을땐 마지막엔 꼭 value()!​

 

_.reduce()

• 배열 뿐만 아니라 객체도 순회 가능.
  
  
• 객체 자체를 순회할수있어서 기존 es6 reduce같이 응용이 많을것 같음

_.reduce([1, 2], function(sum, n) {
  return sum + n;
}, 0);
// => 3

_.reduce({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) {
  // 만일 해당 객체키가 없으면 새로 배열을 반환받고, 있으면 push한다.
  (result[value] || (result[value] = [])).push(key);
  
  return result;
}, {});
// => { '1': ['a', 'c'], '2': ['b'] } (iteration order is not guaranteed)

​

_.include()

• 단순히 배열 원소 있는지 없는지 확인하는 거였지만, 로다쉬에서 기능이 확장됨
• 배열뿐만 아니라, 객체, 문자열도 검사
  

// 배열에 값이 있는지 찾습니다.
_.includes([1, 2, 3], 1); // → true

// index 2에 해당 값 3이 있는지 찾습니다.
_.includes([1, 2, 3], 3, 2); // → true

// 일치하는 값이 있는지 찾습니다.
_.includes({ 'name': 'yhs', 'age': 26 }, 'yhs'); // → true

// 일치하는 값이 문자열 안에 있는지 찾습니다.
_.includes('dontknow', 'ont'); // → true

​

_.remove()

• 배열 내의 조건에 맞는 요소들을 제거한 후 반환
• ES6의 filter()의 반대 버젼이라 보면 된다.

var array = [1, 2, 3, 4];

var evens = _.remove(array, function(n) { // 원본값 array를 업데이트하고 제거된 원소를 반환
  return n % 2 == 0;
});
 
console.log(array); // => [1, 3]
console.log(evens); // => [2, 4]

​

_.reject()

• 콜렉션에서 해당 데이터 또는 콜백 조건에 맞는 데이터를 제외한 콜렉션을 반환한다.
• _.filter()의 반대버젼.
• _.remove()는 배열 원소만 한해 작동하고 _.reject()는 배열 객체에 작동
  
  
• Delete API를 호출 한 뒤 삭제된 결과값을 제외해서 리스트를 갱신하고 싶을 때 유용하다.

var users = [
	{ 'user': 'Rohit', 'age': 25, 'active': false },
	{ 'user': 'Mohit', 'age': 26, 'active': true } 
];

let gfg = _.reject(users, function(o) { 
	return !o.active; // o.active : false인것을 제외하고 반환
});

console.log(gfg);
// [ { user: 'Mohit', age: 26, active: true } ]

var users = [
  { 'employee': 'Rohit', 
    'salary': 50000, 
    'active': false 
  },
  { 'employee': 'Mohit', 
    'salary': 55000, 
    'active': true 
  } 
];
   
let gfg = _.reject(users, { 'salary': 55000, 'active': true }); // 해당 객체 값 모양을 제외하고 반환
  
console.log(gfg);
// [ { employee: Rohit, salary: 50000, active: false } ]

 

_.findIndex()

• 인수로 배열이나 객체를 줘서 해당 값이 있는지 검색하고 인덱스 반환.

const users = [
	 { 'user': 'jace',  'active': false },
	 { 'user': 'fred',    'active': false },
	 { 'user': 'pebbles', 'active': false },
	 { 'user': 'minju',   'active': true },
];

// 처음 일치하는 object의 index 값을 반환합니다.
const idx2 = _.findIndex(users, { 'user': 'fred' });
console.log(idx2) // → 1

​

_.find()

• 조건에 맞는 값을 찾아 그대로 반환 (한개만)
• 여러개 찾고싶다? _.filter()쓰셈
• es6의 find()와는 달리 바로 객체값을 줘서 검색 가능

_.filter()와 차이는 filter은 해당하는 값이 여러개 이여도, 배열로 정리해 반환하지만,
_.find()는 단 한개만 반환

const users = [
  { 'user': 'barney',  'age': 36, 'active': true },
  { 'user': 'fred',    'age': 40, 'active': false },
  { 'user': 'pebbles', 'age': 1,  'active': true }
];
 
 
// 오브젝트 조건으로 결과가 처음으로 true인 오브젝트 반환
_.find(users, { 'age': 1, 'active': true });
// =>  { 'user': 'pebbles', 'age': 1,  'active': true }
 
 
// 배열 조건으로 결과가 처음으로 true인 오브젝트 반환
_.find(users, ['active', false]);
// => { 'user': 'fred', 'age': 40, 'active': false }
 
 
// active가 처음으로 true인 오브젝트 반환
_.find(users, 'active');
// => { 'user': 'barney', 'age': 36, 'active': true }

---

# 참고자료

https://www.geeksforgeeks.org/lodash-introduction/?ref=gcse

https://lodash.com/docs/4.17.15

https://runebook.dev/ko/docs/lodash/-index-