코린이 탈출기

클로저 개념 클로저는 내부함수가 외부함수의 맥락(Context)에 접근할 수 있는 것을 가리킵니다. 클로저는 자바스크립트를 이용한 고난도 테크닉을 구사하는 데에 필수적인 개념으로 활용되므로 중요합니다. 흔히, 함수 내에서 함수를 정의하고 사용하면 클로저라고 합니다. 클로저 안에 정의된 함수는 만들어진 환경을 기억한다는 특징이 있습니다. var base = 'Hello, '; function sayHelloTo(name) { var text = base + name; return function() { console.log(text); }; } var hello1 = sayHelloTo('A'); var hello2 = sayHelloTo('B'); var hello3 = sayHelloTo('C'); h..

호이스팅의 개념 함수 안에 있는 선언들을 모두 끌어 올려서 해당 함수 유효범위의 최상단에 선언하는 것을 의미합니다. 자바스크립트 Parser가 함수 실행 전에 해당 함수를 한번 훑고, 이 함수 안에 존재하는 변수/함수 선언에 대한 정보를 기억하고 있다가 실행하는 것입니다. 이 때 유효범위의 의미는 함수 블록 {} 입니다. 즉, 함수 내에서 아래쪽에서 선언되어지는 부분을 미리 다 선언해놓는 것이죠. 실제로 코드가 끌어올려지는 것은 아니고, 자바스크립트 Parser가 내부적으로 끌어올려서 처리하는 것입니다. 호이스팅의 대상 var 변수 선언과 함수 선언문에서만 호이스팅이 일어납니다. var 변수/함수선언만 위로 끌어올려지고, 할당은 끌어올려지지 않습니다. let/const 변수선언과 함수표현식에서는 호이스팅..

이번에는 자바스크립트의 실행 컨텍스트에 대해서 정리해보려 합니다. 실행 컨텍스트를 간단히 설명해보자면, 실행 가능한 코드를 형상화하고 구분하는 추상적인 개념이라고 할 수 있습니다. 자바스크립트 엔진에서 코드를 실행하기 위해서는 실행에 필요한 정보들을 알고 있어야 하는데, 이 정보의 종류로는, - 변수: 전역 변수, 지역 변수, 매개 변수, 객체의 프로퍼티 - 함수선언 - 변수의 유효범위 - this 가 있습니다. 이와 같이, 실행에 필요한 정보를 형상화하고 구분하기 위해서 자바스크립트 엔진은 실행 컨텍스트를 물리적인 객체 형태로 관리합니다. 먼저 실행 컨텍스트의 종류에 대해서 알아봅시다! Global Context(전역 컨텍스트) 함수 안에서 실행되는 코드가 아니라면, 모든 스크립트는 전역 컨텍스트에서 ..

저번 시간에 자바스크립트의 비동기 흐름에 대해 알아보았습니다. 이번에는 자바스크립트에서 비동기 흐름을 제어할 수 있는 여러 방법에 대해 알아보도록 하겠습니다 ~ Callback 자바스크립트는 이벤트 중심의 언어입니다. 즉, 자바스크립트는 이벤트 값이 반환될 때까지 기다리지 않고 다음 이벤트를 계속 실행하게 되죠. function func1(){ console.log('first'); func2(); } function func2(){ setTimeout(function(){ console.log('second'); }, 0); func3(); } function func3(){ console.log('third'); } func1(); //출력값 // first -> third -> second 저번시간..

동기(Synchronous) 동기는 순차적, 직렬적으로 태스크를 수행하는 것을 의미합니다. 마치 큐(Queue)의 수행과정처럼, 선입선출의 코드 실행 처리 순서를 동기방식이라고 부릅니다. function func1(){ console.log('first'); func2(); } function func2(){ console.log('second'); func3(); } function func3(){ console.log('third'); } func1(); //출력값 // first -> second -> third 비동기(Asynchronous) 비동기 처리는 왜 필요한 것일까요? 대부분의 웹서비스는 사용자의 요청을 받아 DB에 접근하여 데이터를 가져와서 보여주는 형태를 가지는데, 이를 동기적으로 구..

이번 달에 친구들과 함께 새로운 프로젝트를 하게됐다. 공개 SW 개발자 대회에 참가하면서 시작한 프로젝트인데, 간단히 설명하자면 책이나 강의자료 pdf를 text로 변환하고 이를 text rank 알고리즘을 통해 중요문장과 keyword를 추출해낸다. 추출된 문장과 키워드로 빈칸문제를 출제하여 방대한 양의 암기과목을 공부하는 대학생들에게 도움이 될만한 자동 문제 출제 서비스를 구현하려고 한다. 프론트엔드에서는 Ajax를 통해 비동기적으로 웹 제작을 하려고 한다. 특정 페이지의 데이터 변화가 존재할 때 페이지를 refresh 해야하는데, 데이터의 변화가 잦다면 새로고침을 계속 수행해주어야하고 불필요한 트래픽이 증가하여 비효율적인 로딩이 많아지게 된다. 이러한 문제를 Ajax를 통해 해결할 수 있다. 데이터..