JavaScript - 함수 : 값으로서 함수

 

 

JavaScript에서는 함수도 객체다. 다시 말해서 일종의 값이다. 거의 모든 언어가 함수를 가지고 있다. JavaScript의 함수가 다른 언어의 함수와 다른 점은 함수가 값이 될 수 있다는 점이다. 다음 예제를 통해서 그 의미를 알아보자.

function a(){} //var a=function(){}와 동일함

 

위의 예제에서 함수 a는 변수 a에 담겨진 값이다. 또한 함수는 객체의 값으로 포함될 수 있다. 이렇게 객체의 속성 값으로 담겨진 함수를 메소드(method)라고 부른다.

a = {
    b:function(){
    }
};

변수  a에 객체를 정의함  ( 객체는 중괄호로 시작해서 중괄호로 끝)

객체안에 b라는 key가 있음

key의 값은 function이라는 값(value)이 있음

b(key)는 이 객체 안에서 일종의 변수와 같은 역할을 함 (어떤 값을 저장하고 있기 때문)

이 객체 안에서 어떤 변수의 역할을 하는 것을 속성(property)라고 한다.

그리고 그 속성에 저장되어 있는 값이 함수라고 한다면 그 함수를 메소드(method)라고 한다.

= 함수는 값이고 객체안에 저장될 수 있다.

 

---

 

함수는 값이기 때문에 다른 함수의 인자로 전달 될수도 있다. 아래 예제를 보자.

function cal(func, num){
    return func(num)
}
function increase(num){
    return num+1
}
function decrease(num){
    return num-1
}
alert(cal(increase, 1));
alert(cal(decrease, 1));

 

10행을 실행하면 함수 increase와 값 1이 함수 cal의 인자로 전달된다. 함수 cal은 첫번째 인자로 전달된 increase를 실행하는데 이 때 두번째 인자의 값이 1을 인자로 전달한다. 함수 increase은 계산된 결과를 리턴하고 cal은 다시 그 값을 리턴한다.

 

함수는 함수의 리턴 값으로도 사용할 수 있다.

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

 

당연히 배열의 값으로도 사용할 수 있다.

var process = [
    function(input){ return input + 10;},
    function(input){ return input * input;},
    function(input){ return input / 2;}
];
var input = 1;
for(var i = 0; i < process.length; i++){
    input = process[i](input);
}
alert(input);

즉 함수는  값이기 때문에 값을 저장하는 컨테이너인 배열에도 저장할 수 있다.

 

변수, 함수의 매개변수, 리턴값, 등등 다양한 형태로 저장될 수 있는 데이터를 first-class citizen라고 부른다. 함수는 이에 포함되는 개념이다.

 

---

콜백

처리의 위임

값으로 사용될 수 있는 특성을 이용하면 함수의 인자로 함수로 전달할 수 있다. 값으로 전달된 함수는 호출될 수 있기 때문에 이를 이용하면 함수의 동작을 완전히 바꿀 수 있다. 인자로 전달된 함수 sortNumber의 구현에 따라서 sort의 동작방법이 완전히 바뀌게 된다.

 

function sortNumber(a,b){
    // 위의 예제와 비교해서 a와 b의 순서를 바꾸면 정렬순서가 반대가 된다.
    return b-a;
}
var numbers = [20, 10, 9,8,7,6,5,4,3,2,1];
alert(numbers.sort(sortNumber)); // array, [20,10,9,8,7,6,5,4,3,2,1]

numbers.sort();를 보면 .sort()함수가 있다. 이때 numbers는 무엇일까?

배열 객체이다. 어떠한 함수(sort())가 '.'앞에 무언가 있다면 무언가는 객체이다. 

이런 맥락에서 sort()는 객체에 속해 있기 때문에 함수가 아닌 메소드라고 한다. (내장객체)

 

+)비동기 처리(Ajax)

 

참고-https://www.opentutorials.org/course/743/6508