function

function 오브젝트의 저장 형태는 {  key : value } 형태로 저장된다.

 

function foo(){} // {foo : {..}} 의 형태로 저장

 

위와 같이 인식을 하기 때문에 js에서는 오버 로딩이 이 없다

 

함수가  실행될 환경을 알아야 맞춰서 실행할 수 있기에 함수 실행 환경 인식이 필요하다

 

function 키워드를 만나 object를 만나는 시점이 실행 환경 설정 시점이다.

여기서 실행 영역을 설정하게 된다. (단 한 번만 스코프만 만들면 된다.)

 

함수 코드의 해석 순서.

함수 안에 함수 선언문을 해석한다.

변수를 초기화한다.

코드를 실행한다.

 

함수 정의 형태

 

함수 표현식 

var foo = function(){}

 

함수 선언식

function foo(){}

 

함수를 해석할 때 변수를 초기화했고 그다음 실행하기 때문에  js가 foo()를 실행할 때 first를 해석했지만 그 값을 알 수 없다는 것을 알 수 있다.  

function foo(){
    console.log(first); //디버그 해보면 first의 값은 undefined
    var first = 1;
}
foo();

undefined는 js에서 만은 변수를 만드는 존재이다.

그렇기 때문에 이것을 방지하기 위해 es6에서  let과 const가 사용되고 권장되는 것이다.

function foo(){
    console.log(first); //Cannot access 'first' before initialization
    let first = 1; 
}

foo();

 

함수는 참조에 의한 호출과 값에 의한 호출이 있다.

//값에 의한 호출

let foo = 1;

function a(x){
    return x = x+1
}

console.log(a(foo), foo);// 2, 1

위 코드를 실행시키면 a(x)에서 foo의 복사본이 인자 x에 할당된다. 이때 foo와 x는 다른 영역의 메모리에 위치하게 된다.

그래서 x값을 바꾸더라도 foo의 값은 변하지 않는다. 이것을 값에 의한 호출이라 한다.

 

//참조에 의한 호출
let foo = {x: 1, y: 2};

function a(q){
    q.x = q.x+1;
    q.y = q.y+1;
    return q; 
}

console.log(a(foo),foo); // {x: 2, y: 3}, {x: 2, y: 3}

위 코드를 실행시키면 a(foo)를 통해 foo에 복사본이 인자 q에 할당된다. 이부분까지는 값의 전달과 같다. 하지만 foo에 객체가 참조 하는 형태가 되어있으며 이 참조값(객체)을 인자q에 전달하게 된다. 결국 foo와 q는 똑같은 객체를 참조하기에 같은 결과가 나오게 된다.