익명의 개발노트

this 본문

프로그래밍/javascript

this

캡틴.JS 2019. 2. 26. 15:47
반응형

execution contexts (실행컨텍스트)



1) 정의 : 프로그램이 실행될때, 빌드업 하는 과정에서 메모리 안에 스코프 구조들을 excution context라고 부른다.


2) 어떤 함수가 호출되면 실행 컨텍스트 execution context가 만들어진다.(call stack에 push, 함수 벗어나면 pop됨)

  • 함수가 실행되면 실행컨텍스트가 생성되고 => 매개변수의 정보를 가지는 활성객체를 생성(arguments, 유사배열)하고, 함수가 생성될 때 상용된 인자(parameter)를 넣는다. => 활성객체 안에 실행 컨텍스트의 스코프 체인을생성 => 함수가 가지고 있는 변수 및 객체 정보를 담을변수객체 생성한다. 이때의 값은 아직 할당하지 않았으므로, undefined이다.  => this에 대한 정보를 저장하고 변수객체에 bind한다. bind 대상없으면 window 객체에 바인딩한다. => 코드 실행 => 실행 후 컨텍스트 파기.

3) scope 별로 생성


4) 여기에 담겨있는 것은? 

   

   (1) scope 내 변수 및 함수(local, global)

   

   (2) arguments 


   (3) caller

 

   (4) this  : 모든 함수 scope 내에서 자동으로 설정되는 특수한 identifier, execution context의 구성요소 중 하나로, 

    함수가 실행되는 동안 이용할 수 있다.


아버지 : 나는 몸이 아프다 (나 = 아버지)

할머니 : 나는 몸이 아프다 (나 = 할머니)


이렇게 나를 가르키는 것임. 어디에 사용되냐에 따라 가르키는 곳이 바뀜. 거의 모든상황에서 객체임. 예외도 있음.



※ in-memory scope = excution context , 

   lexical scope = code에서 scope를 통상 지칭함. 같은 뜻인데 다르게 사용하는 용어라 혼란 금지...



This의 5가지 바인딩 패턴.  외워두면 헷갈릴 일 없다.


1) Global Reference : ex) log(this);  // window 


2) Fee Function Invocation : ex) fun(); // window  or `use strict`모드에서는 undefined


3) .call or .apply Invocation : ex) fun.call(obj); or fun.apply(obj); // call, apply의 첫 번째 argument로 명시된 object


4) Construction Mode : new fun();  // 새로생성된 객체


5) Method Invocation : 90% 이것만 사용함.  ex) obj.mtd();   //부모 object




반응형

'프로그래밍 > javascript' 카테고리의 다른 글

Arguments  (0) 2019.02.28
IIFE( Immediately Invoked Function Expression)  (0) 2019.02.27
Closure  (0) 2019.02.26
Scope  (0) 2019.02.26
[디버깅] 크롬을 활용한 디버깅하는 법  (0) 2019.02.22
Comments