[JavaScript] 함수

함수(Function)란?

-작은 기능의 단위이다

  *계산기 프로그램을 만들기 위해서는 아래 그림과 같이 세분화된 여러가지 기능들이 요구된다. 작은 네모 하나하나가 모두 함수라고 볼 수 있다.

 

 

-함수는 여러 코드들의 묶음이고 반복해서 재사용이 가능하다. 즉 여러 코드들을 캡슐화하여 언제든 실행할 수 있게 만든다. 

  *Procedural programming에서 전체 과정을 나누어 처리하는 단위를 함수라한다. 

-함수 선언식 : function name(parameter) {function body}

-함수 표현식과 할당 : const name = function(parameter) {body};

  *화살표함수 : const name = (parameter) => {body};

    -함수 표현식의 단순 버전이다.  짧고 간결하게 쓸 수 있는 것이 장점임

    - { }과 return은 생략 가능하다. 

-호출 : name(); or name(argument);  (*함수 이름은 pointer임. name만 쓰면 이 함수의 body를 가리킴)

-return : 함수 실행 종료 및 value 반환 (return값이 없으면 undefined 반환)

-사용자 정의 함수와 내장 함수가 있다

-Parameter: 함수를 호출할 때 전달하는 인자의 개수에는 제한이 없으며 함수 내부에서 [arguments] 객체를 통해 접근할 수 있다.   

   -- arguments는 유사배열객체로 length 프로퍼티 값을 알 수 있다.

  -- arguments[0], arguments[1] 등의 형태로 접근할 수 있으며, parameter는 함수 선언시 이들에 미리 이름을 붙인 것과 같다.

  -- 즉 function foo(num1){} 에서 num1 = arguments[0]과 같다. 

    * 매개변수 num1과 arguments[0]는 메모리 공간을 공유하는 것은 아니다.

    * 하나의 인자만 받아 실행하면 arguments[1]는 undefined를 반환한다.

-매개변수와 arguments객체는 환경에 따라 재할당이 다르게 동작한다

    -- 기본 모드 : 매개변수와 arguments객체는 서로를 참조함. (둘 중 하나가 바뀌면 다른 하나도 똑같이 바뀜)

    -- "use strict" 모드 : 서로를 참조하지 않음. (let [num1, num2] = arguments 와 같이 동작함. 처음에만 같고 이후에는 상관 안함)

  *Arguments are passed by value : 매개변수에 인자가 전달될 때 실제 새 메모리 공간에 전달된 값을 '복사'한다. 따라서 함수 외부에서 함수로 전달된 변수는 함수 내부에서 어떤 연산처리에 의한 변형이 일어나지 않는다. 하지만 reference type은 그 주소값이 복사되기 때문에 heap에 저장된 data가 영향을 받게 된다.

(함수에 인자를 전달하여 호출 -> 함수 컨텍스트에서 arguments에 인자 할당-> parameters 변수 할당. 기본값으로 arguments의 각 요소를 할당함)

 

-ES6

  1. Default parameters

// ES5
function sum1(a, b) {
    a = a || 0;
    b = b || 0;
    return a + b;
}

// ES6
function sum2(a=0, b=0) {
    return a + b;
}

sum1(); // 0
sum2(); // 0


// 첫번째 argument를 생략하고 싶을 땐 undefined를 전달한다
sum(undefined, 5); // 5

// 서로의 parameter를 Default value로 사용할 수 있다
// *parameter 또한 JS엔진이 실제로 메모리를 할당하는 '변수'이기 때문. 
function sum3(a=0, b=1+a) { //주의할 점은 선언의 순서이다. (a=1+b, b)는 불가능하다.
    return a+b;
}
sum3(); // 1