javascript - 콜백(1)

김동하·2020년 9월 18일
0

javascript

목록 보기
11/58

자바스크립트에서 함수도 객체다. 함수는 값이다.

function a(){}

함수 a는 변수 a에 담겨진 값이다.

a = {
  b : function(){
    
  }
}

또한 함수는 객체의 값으로 포함될 수 있다. b는 객체 안에서 변수 역할을 하는 것을 속성(property)라고 한다. property에서 저장된 값이 함수면 즉, 객체의 속성을 값으로 존재하는 함수를 메소드(method)라고 한다.

함수는 값이기 때문에 다른 함수의 인자로도 전달 가능하다.

function cal(mode){
     const funcs = {
    
        'plus' : function(left, right){
        return left + right
        },
        
        'minus' : function(left, right){
        return left - right
        }
    }
    return funcs[mode];
}

console.log(cal("plus")(2,1))  // 3
console.log(cal("minus")(2,1)) // 1

함수 cal은 mode라는 파라메터를 가지고 있다. 내부에는 변수 funcs가 있고 변수 funcs는 객체로 "plus"와 "minus"라는 키(프로퍼티)를 가지고 있다. 각 프로퍼티는 함수를 가지고 있는데 각 함수(메서드)의 파라메터로 left와 right가 있다. 각 메서드는 파라메터를 더하거나 뺀 값을 리턴한다.

최종적으로 함수 cal은 funcs[mode]를 리턴하는데 이것은 객체 funcs의 프로퍼티의 메서드의 리턴값임을 알 수 있다.

첫 번째 console.log에서 "plus"와 (2,1)이 arument로 cal에 부여됐다. funcs의 프로퍼티 "plus"에 메서드에 2와 1이 인자로 전달되어 리턴은 3이 된다.

배열의 값으로 함수

const process = [
      function(input) {
        return input + 10
      },
      function(input) {
        return input + input
      },
      function(input) {
        return input / 2
      }
];

let input = 1;

for(let i =0; i < process.length; i++){
  input = process[i](input)
}
 
console.log(input)  // 11

배열 process는 input을 파라메터로 받고 파라메터에 숫자놀음을 리턴하는 함수 3개를 가지고 있다.

배열 밖에서 input을 정의하고 for문을 가동시키면 input은 11, 22, 11로 함수에 따라 변하게 되어 최종적으로 11을 출력한다.

변수, 매개변수, 리턴값 등 다양한 형태로 사용되는 데이터를 first-class-object. 자바스크립트에서 함수 역시.

출처 : https://www.inflearn.com/course/%EC%A7%80%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%96%B8%EC%96%B4-%EA%B8%B0%EB%B3%B8/lecture/2530?tab=note

profile
프론트엔드 개발

0개의 댓글