본문 바로가기

Study/VanillaJS

[개념잡기] 컬렉션 중심 프로그래밍 - (1) 수집하기 (map, values, plunk)

[개념잡기] 컬렉션 중심 프로그래밍 - (1) 수집하기 (map, values, plunk)

서론

컬렉션 중심 프로그래밍의 첫번째 수집하기에 대해 알아보도록 하겠다.
수집하기의 기본이 되는 함수는 map 함수이다.

var _map = _curryr((list, mapper) => {
  var new_list = []
  _each(list, (val) => {
    new_list.push(mapper(val))
  })
  return new_list
})

console.log(
    _map(users, user => user.name)
) // (8) ["ID", "QW", "WE", "ER", "RT", "DF", "AS", "IS"]

컬렉션 중심 프로그래밍

values

  • 기대동작 : 오브젝트를 받아 해당 오브젝트의 value 리스트 반환
  • 코드 작성
var _values = function(obj){
    return _map(obj, function(val) {return val})
}

console.log(
  _values(users[0])
)
// (3) [1, "ID", 29]

기대하는 값이 나왔다. keys 함수와 비교하여 출력해 보겠다.

console.log(users[0]) // {id: 1, name: "ID", age: 29}
console.log(_keys(users[0])) // ["id", "name", "age"]
console.log(_values(users[0])) // [1, "ID", 29]
  • 코드 개선
// values (curryr 적용)
var _values = _map(function(val){return val})

// values (identity 적용)
var _values = _map(_identity)

// identity
function _identity(val) {
  return val
}

curryridentity 함수를 이용해 value 함수를 개선해 보았다.

pluck

  • 기대동작 : 객체 배열과 key를 받아 해당 객체의 key에 해당하는 value 들을 리스트로 반환
  • 코드 작성
var _plunk = (data, key) => {
  return _map(data, function(obj){
    return obj[key]
  })
}
  • 코드 개선
var _plunk = (data, key) => {
  return _map(data, _get(key))
}

get 함수를 이용하여 함수 부분을 대체하였다.

마무리

오늘 작성한 함수

// values
var _values = _map(_identity)

// identity
function _identity(val) {
  return  val
}

// plunk
var _plunk = (data, key) => {
  return _map(data, _get(key))
}