함수형으로 전환하기

1. 함수형과 객체형의 차이

// 객체형
dog.right(1);
dog.left(1);
duck.right(1);
duck.left(1);

// 함수형
right(dog, 1);
left(dog, 1);
right(duck, 1);
left(duck, 1);

2. 회원목록, map, filter

• 1 일반적인 명령형 코드

var users = [
  { id: 1, name: 'ID', age: 36 },
  { id: 2, name: 'IA', age: 32 },
  { id: 3, name: 'IB', age: 32 },
  { id: 4, name: 'IC', age: 27 },
  { id: 5, name: 'IE', age: 25 },
  { id: 6, name: 'IF', age: 26 },
  { id: 7, name: 'IG', age: 31 },
  { id: 8, name: 'IH', age: 23 },
];

// 1. 명령형 코드
// 1. 30세 이상인 users를 거른다.
var temp_users = [];
for (var 1 = 0; i < users.length; i++) {
  if(users[i].age >= 30) {
    temp_users.push(users[i]);
  }
}
console.log(temp_users);

// 2. 30세 이상인 users의 names를 수집한다.
var names = [];
for (var i = 0; i < temp_users.length; i++) {
  names.push(temp_users[i].name);
}
console.log(names);

// 3. 30세 미만인 users를 거른다.
var temp_users = [];
for (var 1 = 0; i < users.length; i++) {
  if(users[i].age < 30) {
    temp_users.push(users[i]);
  }
}
console.log(temp_users);

// 4. 30세 미만인 users의 ages를 수집한다.
var ages = [];
for ( var i = 0; i< temp_users.length; i++) {
  ages.push(temp_users[i].age);
}
console.log(ages);

• 2 map, filter를 이용한 코드
  filter 응용형 함수, 고차함수
  응용형 함수 : 함수를 인자로 받아서 그 함수를 이용하여 인자를 변경할 때
  고차함수 : 함수를 인자로 받거나 함수를 리턴하거나 인자로 바든 함수를 실행하는 함수

// predicate 어떤 조건일 때 적용할 것인가?
// 1. 30세 이상인 users를 거른다.
function _filter(users, predicate) {
  var new_list = [];
  for(var i = 0; i< users.length; i++) {
    if(predi(users[i])) {
      new_list.push(users[i]);
    }
  }
  return new_list;
}

console.log(
  _filter(users, function(user) { return user.age >= 30; }));

// 재활용성과 다형성이 높은 함수
console.log(
  _filter([1,2,3,4], function(num) { return num % 2; }));


// 2. 30세 이상인 users의 names를 수집한다.
function _map(list, mapper) {
  var new_list = [];
  for (var i = 0; i < list.length; i++) {
    new_list.push(mapper(list[i]));
  }
  return new_list;
}

var over_30 = _filter(users, function(user){
  return user.age >= 30;
}
console.log(over_30);

var names = _map(over_30, function(user) {
  return user.name;
});
console.log(names);

var under_30 = _filter(users, function(user){
  return user.age < 30;
}
console.log(under_30);

var ages = _map(under_30, function(user) { return user.age; });
console.log(ages);

• 3 응용) map -> filter (2번 코드 간소화)

consle.log(
_map(
  _filter(users, function(user) {return user.age >= 30; }),
  function(user) { return user.name; }));

consle.log(
_map(
  _filter(users, function(user) {return user.age < 30; }),
  function(user) { return user.age; }));