jfmam 개발 블로그

개념 어떤 함수 A에서 선언한 변수 a를 참조하는 내부함수 B를 외부로 전달할 경우 A의 실행 컨텍스트가 종료된 이후에도 변수 a가 사라지지 않는 현상을 말한다. 원리 개념만 놓고 보았을 때 이해가 잘 가지 않음으로 예제를 이용해 설명해 보도록 하겠다. const A = function () { let a = 1; const B = function () { return ++a; } return B; }; const copyA = A(); for (let i = 0; i < 3; i++) { console.log(copyA()); // 2 3 4 } 이전에 실행컨텍스트에 의하면 한번 호출했던 함수의 경우 해당 함수가 종료되면 관련 된 변수들도 같이 GC(가비지 콜렉터)에 의해 소거가 되었었다. 하지만 다음..

var es6이전에는 변수를 선언할 때 var를 이용하여 변수를 선언하였다. var의 경우엔 function 단위의 scope를 가진다. 이는 함수안에서만 선언 될 경우에 scope를 가지는 것을 의미한다. if나 for문안에서 var를 선언할 경우 해당 변수는 scope를 if나 for가 아닌 상위의 함수(없으면 전역)를 scope로 가지게 된다. function func() { var a = 1; // func scope } console.log(a) // error for(var i =0; i

WHY? 자바스크립트를 공부하다 보면 여러 개념에 대해서 배우게 된다. 호이스팅, this 등의 개념을 배우게 되는데 해당 개념들에 대해서 왜 이렇게 동작을 할까? 라는 생각이 든다. 이러한 생각을 정리 해주는 것이 실행컨텍스트에 대한 개념을 공부하면서 해결해 보도록하자. 실행컨텍스트란? 실행컨텍스트는 실행할 코드의 정보들을 모아놓은 객체이다. 실행컨텍스트는 스택의 구조로 이루어져 있다. 그리고 실행할 코드의 정보들을 모아 놓았기 때문에 스택에 쌓이는 데이터는 함수를 호출하는 시점부터 쌓이게 된다. 예제 var a = 1; function outer() { function inner() { console.log(a); // undefiend var a = 2; } inner(); console.log(a..

오늘 알아볼 자바스크립트 개념은 this이다. 일반적으로 this를 사용할 때는 인스턴스를 일반적으로 생각하지만 자바스크립트의 경우 상황에 따라 this가 달라지기 때문에 제대로 원리를 이해하지 못하면 생각대로 코드가 작동하지 않는 경우가 발생한다. 최근에 코드를 작성 했을 때 this가 계속 undefined로 동작했던 경험이 있어 왜 동작이 안되냐고 화를 낸적이 기억이 난다. 상황에 따라 달라지는 this에 대해 공부해보도록 한다. 상황에 따라 달라지는 this 최근 코어자바스크립트의 책을 읽으면서 this는 상황에 따라 달라짐을 알 수 있었다. 정확히 언제 달라지느냐를 설명하자면 실행컨택스트에의해 this가 변하게 되는데 실행컨택스트의 경우 함수를 호출 할 때 결정된다. 즉, 함수를 어떻게 호출하는..