실행컨텍스트
"현재 실행되는 컨텍스트에서 이 컨텍스트와 관련 없는 실행 코드가 실행되면, 새로운 컨텍스트가 생성되어 스택에 들어가고 제어권이 그 컨텍스트로 이동한다."
실행 컨텍스트 생성 과정
function execute(param1, param2){ var a= 1. b = 2; function func(){ return a-b; } return param1 + param2 + func();}execute(3,4); //6출력1.활성 객체 생성 (실행 컨텍스트가 생성되면 자바스크립트 엔진은 해당 컨텍스트에서 실행에 필요한 여러 가지 정보를 담을 객체를 생성한다.)
2.arguments 객체 생성
3.스코프 정보 생성(현재 컨텍스트의 유효 범위를 나타내는 스코프 정보를 생성한다.)
4.변수 생성(현재 실행 컨텍스트 내부에서 사용되는 지역 변수의 생성이 이루어진다.실제 앞에서 생성된 활성 객체가 변수 객체로 사용 됨. 변수객체 = 활성객체)
5.this 바인딩(this 키워드를 사용하는 값이 할당 됨.)
6.코드 실행
스코프 체인
각각의 함수는 [[scope]] 프로퍼티로 자신이 생성된 실행 컨텍스트의 스코프 체인을 참조한다. 함수가 실행되는 순간 실행 컨텍스트가 만들어지고,이 실행 컨텍스트는 실행된 함수의 [[scope]] 프로퍼티를 기반으로 새로운 스코프 체인을 만든다.
var var1= 1;var var2 = 2;console.log(var1) //1console.log(var2) //2함수선언 안됨 -> 코드 실행 -> 전역 실행 컨텍스트 생성 -> 변수 객체 만듦 ->이 변수 객체의 스코프 체인은 자기 자신만을 가진다(자신이 최상위에 위치하는 변수 객체). 즉 변수 객체의 [[scope]]는 변수 객체 자신을 가리킨다.var var1 = 1;var var2 = 2;function func(){ var var1 = 10; var var2 = 20; console.log(var1); //10 console.log(var2); //20}func();console.log(var1) //1console.log(var2) //2클로저
function outerFunc(){ var x = 10; //자유변수 //클로저 부분 var innerFunc = function(){console.log(x);} return innerFunc;}var inner = outerFunc();inner(); //10setTimeout()에 지정되는 함수의 사용자 정의
function callLater(obj,a,b){ return (function(){ obj["sum"] = a + b; console.log(obj["sum"]); });}var sumObj = { sum : 0}var func = callLater(sumObj, 1, 2);setTimeout(func, 500);클로저란 이미 생명주기가 끝난 외부 함수의 변수를 참조하는 함수를 클로저라고 한다.
function outerfunc(arg1, arg2){ var local = 8; function innerFunc(innerArg){ console.log((arg1+arg2)/(innerArg + local)); } return innerFunc;}var exam1 = outerFunc(2,4);exam1(2);((2+4)/(2+8));function outerFunc(argNum){ var num = argNum; return function(x){ num += x; console.log('num: '+ num); }}var exam = outerFunc(40);exam(5); //num: 45exam(-10); //num: 35하나의 클로저가 여러 함수 객체의 스코프 체인에 들어가 있는 경우도 있다
function func(){ var x = 1; return{ func1 : function(){console.log(++x);} func2 : function(){console.log(-x);} };};var exam = func();exam.func1(); //2exam.func2(); //-2루프 안에서 클로저를 활용할 때는 주의하자
