함수

[Chapter 4] 함수

- 함수는 실행 문장들의 집합을 감싸고 있다.

- 함수는 코드의 재사용이나 정보의 구성 및 은닉화 등에 사용할 수 있고 객체의 행위를 지정하는데도 사용한다.

01] 함수 객체

- 자바스트립트에서 함수는 객체이기 때문에 다른 값들처럼 사용 할 수 있다.

변수, 객체, 배열 등에 저장될 수 있고, 다른 함수에 전달하는 인수로도, 반환값으로도 사용 할 수 있다.

- 함수를 다른 객체와 구분 짓는 특징은 '호출' 할 수 있다는 점이다.

- 객체는 Object.prototype 에 연결되지만 함수는 Function.prototype 에 연결된다.

 함수객체의 prototype 속성에 함수 자체를 값으로 갖는 생성자(constructor) 속성이 있다.

(생성자는 객체 생성시에 호출되며 메모리 생성과 객체 데이터의 초기화를 한다. 생성자에 대한 자세한건 나중에...)

02] 함수 리터럴

- 함수 리터럴은 표현식이 나올 수 있는 곳이면 어디든지 위치할 수 있다.

- 함수는 다른 함수 내에서도 정의할 수 있다.

- 함수 리터럴로 생성한 함수 객체는 외부 문맥으로의 연결이 있는데 이를 클로저(closure) 라고 한다.

//선언문 방식(반드시 함수명이 정의되어야 함)
function test1( a, b ){

  var r = a + b;
  console.log(r);

}

// 기명함수 호출
test1( 1, 2 );

//표현식 함수선언
var test2 = function( a, b ){

  var r = a + b;
  console.log(r);

}

// 함수 호출
test2( 1, 2 );

- 위의 선언식, 표현식 외에 자바스크립트 함수도 Function() 기본내장 생성자 함수로부터 생성된 '객체' 이기 때문에Function() 생성자 함수로 함수를 생성하는 법이 있다.

//생성자 함수로 함수를 생성
var test3 = new Function ( 'a', 'b', 'return a+b' );

//함수호출
console.log(test3(1,2));

- 함수를 정의함과 동시에 바로 실행하는 즉시 실행 함수도 있다.

//즉시 실행 함수
(function (test){
  console.log(test);
})('test_text');

03] 호출

- 함수 호출에는 네가지 패턴이 있다. (메소드 호출, 함수 호출, 생성자 호출, apply 호출)

- 메소드 호출 패턴 (함수를 객체의 속성에 저장하는 경우, 그 함수는 '메소드' 라 부른다.)

var say = function(something){
    console.log(something);
}

say('hello');

- 생성자, apply 호출 패턴

call과 apply 함수는 자바스크립트만의 독특한 내장 함수로, 

Function 객체에 기본적으로 들어있는 함수이다. (정확히 말하자면 Function.prototype에 들어있는 함수)

apply 호출은 생성자 호출과 비슷하지만 인수들을 배열로 넘겨주는데에 차이가 있다.

var say = function(something){
    console.log(something);
}

say.call(undefined, 'call hello'); // 생성자 호출
say.apply(undefined, ['apply hello']); // apply 호출

- 모든 함수에는 this와 argument라는 추가적인 매개변수 두 개를 받게되는데, 

자바스크립트 에서 this라는 매개변수의 값이 호출하는 패턴에 따라 바뀐다.

위의 네가지 패턴에 따라 this라는 매개변수의 값이 다르게 초기화 된다.

this 바인딩에 대한 이해는 확실하게 공부 후 적겠음 ㅠㅠ

04] 인수 배열(arguments)

- 함수를 호출할 때 this와 같이 추가적으로 매개변수로 arguments 배열을 사용하게 된다.

타 언어와 달리, 자바스크립트에서는 함수를 호출할 때

함수 형식에 맞춰 인자를 넘기지 않더라도 에러가 발생하지 않는데, 

이러한 이유는 암묵적으로 argument 객체가 함수 내부로 전달되기 때문이다.

var test_func = function( num1, num2 ){
    console.log(num1, num2);
};

test_func();        // undefined undefined 출력
test_func(1);       // 1 undefined 출력
test_func(1,2);     // 1 2 출력
test_func(1,2,3);   // 1 2 출력

위 함수를 console.dir(argument) 로 실행해서 보면

함수 호출 시 넘겨진 인자가 배열 형태로 저장되어 있다.

추가적으로 arguments는 length 속성이 있지만 실제 배열이 아닌 객체다. 

(length를 제외한 배열이 가지는 메소드들이 없다.)

05] 반환

- 함수는 몸체를 닫는 } 를 만나면 함수가 끝나면서 함수를 호출한 부분으로 값이 반환된다.

- 함수의 뭄체 안에서 return 문을 사용하면 } 에 도달하기 전에 값을 반환 할 수 있다.

- 반환값을 저장하지 않은 경우에는 undefined가 반환된다.

var test_func = function(){
    return console.log('return text');

    console.log('default text');
}

test_func();   // return text 출력