12월 21일 복기

function getDomain(email) {
  return email.split('@')[1].split('.')[0];
}

function getUserId(email) {
  return email.split('@')[0];
}

let output = callbackOnly(getDomain, {
  status: 'success',
  data: 'mike@codestates.com',
});
console.log(output); // --> codestate

output = callbackOnly(getUserId, {
  status: 'success',
  data: 'mike@codestates.com',
});
console.log(output); // --> mike

output = callbackOnly(getUserId, {
  status: 'fail',
  data: 'mike@codestates.com',
});
console.log(output); // --> 'Something went wrong!'

function callbackOnly(callback, response) {
  if (response.status === 'success') {
    return callback(response.data)
  }

  else if (response.status === 'fail') {
    return 'Something went wrong!';
  }
}

function square(num) {
  return Math.pow(num, 2);
}

function mul10(num) {
  return num * 10;
}

let output = mapCallback(square, [2, 4, 7]);
console.log(output); // --> [4, 16, 49]

output = mapCallback(mul10, [2, 4, 7]);
console.log(output); // --> [20, 40, 70]

output = mapCallback(square, []);
console.log(output); // --> []

function mapCallback(func, arr) {
  let newArr=[];
  for (let i =0 ; i <arr.length ; i++) {
    newArr.push(func(arr[i]))
  }
  return newArr;
}

09_filterCallback

함수와 배열을 입력받아 배열의 각 요소에 함수를 적용했을 때 그 결과가 참인 요소만을 갖는 새로운 배열을 리턴해야 합니다.

function isOdd(num) {
  if (num % 2) {
    return true;
  } else {
    return false;
  }
}
filteredArray([1, 2, 3], isOdd); // [1, 3]

function filterCallback(func, arr) {
  let newArr =[];

  for(let i =0; i<arr.length ; i++) {
    if(func(arr[i])) {
      newArr.push(arr[i])
    }
  }
  return newArr;
}

Built-in higher order functions

// 아래 코드에서 '짝수'와 '길이 5 이하'는 문법 오류(syntax error)에 해당합니다.
// 의미만 이해하도록 합니다.
let arr = [1, 2, 3, 4];
let output = arr.filter(짝수);
console.log(output); // ->> [2, 4]

arr = ['hello', 'code', 'states', 'happy', 'hacking'];
output = arr.filter(길이 5 이하)
console.log(output); // ->> ['hello', 'code', 'happy']

// 아래 코드는 정확한 표현 방식은 아닙니다.
// 의미만 이해하도록 합니다.

let arr = [1, 2, 3];
// 배열의 filter 메소드는 함수를 인자로 받는 고차 함수입니다.
// arr.filter를 실행하면 내부적으로 arr에 접근할 수 있다고 생각해도 됩니다.
arr.filter = function (arr, func) {
  const newArr = [];
  for (let i = 0; i < arr.length; i++) {
    // filter에 인자로 전달된 콜백 함수는 arr의 각 요소를 전달받아 호출됩니다.
    // 콜백 함수가 true를 리턴하는 경우에만 새로운 배열에 추가됩니다.
    if (func(arr[i]) === true) {
      newArr.push(this[i]);
    }
  }
  // 콜백 함수의 결과가 true인 요소들만 저장된 배열을 리턴합니다.
  return newArr;
};

// 보다 정확한 정의
// Immersive 과정에서 프로토 타입과 this를 학습하신 후에
// 아래 코드를 이해하시기 바랍니다.
// Array.prototype.filter = function(func) {
//   const arr = this;
//   const newArr = []
//   for(let i = 0; i < arr.length; i++) {
//     if (func(arr[i]) === true) {
//       newArr.push(this[i])
//     }
//   }
//   return newArr;
// }

filter

const cartoons = [
  {
    id: 1,
    bookType: 'cartoon',
    title: '식객',
    subtitle: '어머니의 쌀',
    createdAt: '2003-09-09',
    genre: '요리',
    artist: '허영만',
    averageScore: 9.66,
  },
  {
    id: 2,
    // .. 이하 생략
  },
  // ... 이하 생략
]; // 단행본의 모음

const isCreatedAt2003 = function (cartoon) {
  const fullYear = new Date(cartoon.createdAt).getFullYear()
  return fullYear === 2003;
}; // 단행본 한 권의 출판판년도가 2003인지 확인하는 함수

const filteredCartoons = cartoons.filter(isCreatedAt2003); // 출판년도가 2003년인 책의 모음

const cartoons = [
  {
    id: 1,
    bookType: 'cartoon',
    title: '식객',
    subtitle: '어머니의 쌀',
    createdAt: '2003-09-09',
    genre: '요리',
    artist: '허영만',
    averageScore: 9.66,
  },
  {
    id: 2,
    // .. 이하 생략
  },
  // ... 이하 생략
]; // 단행본의 모음

const scoreReducer = function (sum, cartoon) {
  return sum + cartoon.averageScore;
}; // 단행본 한 권의 평점을 누적값에 더한다.

let initialValue = 0 // 숫자의 형태로 평점을 누적한다.
const cartoonsAvgScore = cartoons.reduce(scoreReducer, initialValue) / cartoons.length; 
// 모든 책의 평점을 누적한 평균을 구한다.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

고차 함수에 대한 설명 중 바른 것을 모두 고르시오.

정답:
고차 함수와 콜백 함수는 각각 다른 의미를 가지고 있다.

고차 함수는 일급 객체이다.

설명:
A. 고차 함수는 함수이기 때문에 일급 객체입니다. "고차"라는 단어가 헷갈릴 수는 있지만, 일급 객체에서 벗어나지 않습니다.



B. 변수명으로 써도 되고, 그 자리에서 함수를 작성해도 됩니다.



예시 ) 

const foo = function(a) {

   return a;

};



function(foo); //이런 식으로 작성해도 되고,

function(function(a) { return a; }); //이렇게 작성해도 됩니다.



C. 고차 함수는 함수를 인자로 받거나 함수를 리턴하는 함수를 말하고, 콜백 함수는 함수의 인자로 전달되는 함수를 말합니다.



D. 고차 함수는 다른 함수를 인자로 받을 수 있고, 함수를 리턴할 수도 있습니다. 두 개 다 하는 것도 가능합니다.



E. 함수를 리턴할 때 ()를 붙인다면 실행이 되어 값으로 반환되기 때문에, ()를 빼고 써야 합니다.