2016 자바카페 스파르탄 스터디

INSIDE Java Script 5

JAVACAFE박진현

2016 자바카페 스파르탄 스터디들어가기 앞서 ..

본 슬라이드는 2016 자바카페 스파르탄 스터디를 위해 제작되었습니다 .

본 슬라이드의 대부분의 내용은 인사이드 자바스크립트(2014 송형주 , 고현준 ) 의 내용을 참고하였습니다 .

2016 자바카페 스파르탄 스터디목 차

실행컨텍스트의 개념 활성 객체 (Activation object) 와 변수 객체 (Variable Object) 스코프 체인 클로저

2016 자바카페 스파르탄 스터디실행 컨텍스트 개념

콜스택의 실행정보 한개와 동일 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념

Global code Eval code Function code

자신의 실행컨텍스트와 관련없는 코드가 실행되면 새로운 실행컨텍스트가 생기고 제어권이 해당컨텍스트로 이동

h1 h1h2

h1h2h3

2016 자바카페 스파르탄 스터디실행컨텍스트 생성 과정

활성 객체 해당 컨텍스트 실행에 필요한 여러가지 정보를 담을객체

매개변수 사용자 정의 변수 및 객체 사용자 접근 X, 엔진 접근용

arguments 객체 생성 스코프 정보 생성

현재 컨텍스트의 유효범위를 나타냄 현재 컨텍스트의 변수 및 상위 실행 컨텍스트의 변수도 접근 가능 연결리스트 (Linked List) 와 유사함

2016 자바카페 스파르탄 스터디실행컨텍스트 생성 과정

코드 생성 변수에 값이 할당됨 전역실행 컨텍스트

arguments 가 없음 ( 뭘 넘겨야 받지 !) 변수객체 == 전역 객체

브라우저 : 최상위 코드 == 전역코드 Node.js : 파일단위 모듈화

var a = 10; // 모듈 지역변수 b = 10; // 전역변수 오—염이 되기떄문에 왠만하면 var 를 ..

2016 자바카페 스파르탄 스터디스코프 체인

자바스크립트도 언어야 ! == 스코프 ( 유효범위 ) 가 있음 오직 함수만이 유효범위의 한단위 : for,{},if 문은 유효범위 X 변수와 함수의 유효범위를 나타내는 것 == 스코프체인

각각의 함수는 [[scope]] 로 자신이 생성된 실행컨텍스트의스코프 체인을 참조 함수가 실행되는 순간 만들어짐 현재 실행되는 함수의 [[scope]] 를 기반으로 새로운 스코프 체인을 만듬

전역 실행 컨텍스트 최상위 실행객체 [[scope]] == 나 자신

2016 자바카페 스파르탄 스터디스코프 체인

코드 .. 코드를 보자 ! 함수 객체가 처음생성될 당시실행 컨텍스트에 따라감 사실 앞에 말이랑 좀 햇갈림 함수가 중복함수일때 내부함수가상위 함수의 스코프체인을 이어감 with 구문

스코프 체인을 강제함 왠만하면 쓰지마세양 !

var v = "v1";

function pF(){ var v = "v2"; function pV(){ return v; } console.log(pV()); }

pF();

var v = "v1";

function pF(){ var v = "v2"; console.log(pV()); }

function pV(){ return v;}

pF();

2016 자바카페 스파르탄 스터디클로저

이미 생명주기가 끝난 외부함수의 변수를 참조하는 함수 클로저에서 참조되는 변수를 자유변수라 함 함수형 언어에서 주요하게 사용되는 특성

코드 .. 코드를 보자 ! add5 가 초기화된 시점에서 사실 mA 함수는 실행 끝 하지만 내부적으로 넘어간 x 의 값이 계속 참조 심지어 읽기 쓰기도 됨 ! ( 우와 ! 정말 대단해 !!)

2016 자바카페 스파르탄 스터디클로저 활용

특정함수에 사용자가 정의한 객체의 메서드 연결 정해진 형식의 함수를 콜백해주는 라이브러리에형식이 다른 사용자 정의 함수를 호출할때 유용히 사용됨

함수의 캡슐화 글로벌 객체기에 외부에 노출되어 있음 ( 맘대로 변경가능 ) 클로저를 이용 밖에서 더 이상 변경이 불가능하게 바꿀수 있음

setTimeout 사용자 함수 지정 함수의 인자값을 넘길수 있음

코드로 하나씩 확인해 보아요