[JavaScript] 함수 활용

카테고리 : 프로그래밍 언어
태그: javascript · 고차함수 · 함수구성 · 함수의 활용 · 커링함수

1. 함수 기본형

{
  function greeting(){
    return "굿모닝"
  }

  function printmessage(anfunction){
    console.log(anfunction());
  }

  printmessage(greeting);
}

=> 결과값

[Running] node "/workspaces/codespaces-blank/index.js"
굿모닝

[Done] exited with code=0 in 0.048 seconds

{
  function greeting(){
    return function(){
      return "굿모닝";
    }
  }

  let anFunction = greeting();
  let message = anFunction();

  console.log(message);
}

=>결과값

[Running] node "/workspaces/codespaces-blank/index.js"
굿모닝

[Done] exited with code=0 in 0.183 seconds

2. 고차함수 활용

함수를 매개변수로 받거나 함수를 반환하는 함수

{
  let numbers = [1,2,3,4];
  return console.log(numbers.map(number=>number*10));
}

=>결과값
[Running] node "/workspaces/codespaces-blank/index.js"
[ 10, 20, 30, 40 ]

[Done] exited with code=0 in 0.048 seconds

//Map함수도 number라는 매개변수값을 사용하므로 고차함수

3. 함수구성의 활용 (1)

{
  let username = "   abel  ";

  const trim = name => name.trim(); // username에 공백제거
  const generateMessage = name => `Hello ${name} 굿모닝` //매개변수로 출력

  const convertToUpper = name=> name.toUpperCase(); // 대문자로 변환

  const result = generateMessage(convertToUpper(trim(username)));
  console.log(result);
}

=> 결과값

[Running] node "/workspaces/codespaces-blank/index.js"
Hello ABEL 굿모닝

[Done] exited with code=0 in 0.045 seconds

////단점은 함수가 여러개 존재할 시 복잡한 부모구조를 갖게됨

------------------- 해결방법 -------------------

import compose from 'lodash/fp/compose.js';
import pipe from 'lodash/fp/pipe.js';

{
  let username = "   abel  ";

  const trim = name => name.trim(); // username에 공백제거
  const generateMessage = name => `Hello ${name} 굿모닝` //매개변수로 출력
  const convertToUpper = name=> name.toUpperCase(); // 대문자로 변환

  const newFunc = pipe(trim,convertToUpper,generateMessage);

  //lodash로 왼쪽에서 함수 실행 시 compose , 오른쪽에서 함수 실행 시 pipe
  const result = newFunc(username);
  console.log(result);
}

//lodash를 이용하여 부모구조를 묶음

4. 함수구성의 활용 (2)

커링함수 활용하기

f(a, b, c)처럼 단일 호출로 처리하는 함수를 f(a)(b)(c)와 같이 각각의 인수가 호출 가능한 프로세스로 호출된 후 병합되도록 변환하는 것

커링은 함수를 호출하지 않음. 단지 변환할 뿐.

import compose from 'lodash/fp/compose.js';
import pipe from 'lodash/fp/pipe.js';

{
  let username = "   abel  ";
  let message = "hello"+username.trim()+"굿모닝";

  const trim = (name) => name.trim();
  const generateMessage = message => name => `Hello ${name} ${message}`

  /* generateMessage에 첫번째 매개변수 message로 "굿모닝"을 전달 후 name을 인수로 사용하는 함수를 반환함  */
  const convertToUpper = (name)=> name.toUpperCase();

  const newFunc = pipe(trim,convertToUpper,generateMessage("굿모닝"));


  const result = newFunc(username);
  console.log(result);
}

=> 결과값

[Done] exited with code=1 in 0.113 seconds

[Running] node "/workspaces/codespaces-blank/index.js"
Hello ABEL 굿모닝

[Done] exited with code=0 in 0.257 seconds