주섬주섬 코딩, 소소하지만 꾸준히 쌓아가는 개발 기록...

스코프에 대한 지식이 없다면 먼저 간단히 읽고 오세요. 실행컨텍스트에 대해서 알고 진행해야하기에 실행 컨텍스트 글을 꼭 참고해주세요. 실행 컨텍스트(Execution context) 실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체입니다. 자바스크립트는 어떤 실행 컨텍스트가 활성화되는 시점에 선언된 변수를 위로 끌어올리고(호이스팅, hoisting) 외부 okayoon.tistory.com 클로저(Closure) 여러 함수형 프로그래밍 언어에서 등장하는 보편적인 특성입니다. 클로저는 객체지향과 함수형 프로그래밍에서 매우 중요한 개념입니다. 특성 함수가 선언될 당시의 lexical environment(함수 선언당시 실행 컨텍스트 내의 식별자 정보, 외부환경 정보)의 상호관계에 따른 현상입..

콜 스택(Call stack)과 힙(Heap) 자바스크립트 엔진이 자바스크립트를 실행할 때 원시 타입 및 참조 타입을 저장하는 메모리 구조 콜 스택 : 원시타입 값과 함수 호출의 실행 컨텍스트(Execution Context) 저장 힙 : 객체, 배열, 함수와 같이 크기가 동적으로 변할 수 있는 참조타입 값 저장 동작 원리 이미지 및 코드 출처 : https://github.com/baeharam/Must-Know-About-Frontend/blob/master/Notes/javascript/stack-heap.md let a = 10; let b = 35; let arr = []; function func() { const c = a + b; const obj = { d: c }; return obj;..

모듈 시스템: CommonJS, AMD, UMD, ES6 여러 기능에 관한 코드가 모여있는 하나의 파일 장점 의존성을 줄여주기때문에 유지보수 용이 모듈만의 네임스페이스 화 필요할때마다 재사용 위와 같은 이유로 모듈의 개념이 필요했고, Javascript에서는 여러가지를 시도하였다. CommonJS 서버사이드 및 데스크탑 어플리케이션에서 지원하기 위해 만든 방식으로 Node.js에서 사용 가능하다. require, module.exports를 사용하는 방식이다. 여기서 module.exports의 module은 예약어이며 현재 모듈에 대한 정보를 가지고 있는 객체이다. // search.js const getWord = () => {}; module.exports = { getWord }; // index..

즉시 실행 함수 (IIFE, Immediately-Invoked Function Expression) 즉시 실행하여야하지만 전역 스코프(Global Scope)를 오염시키지 않으려고 할때 사용한다. 함수 리터럴을 ( )로 감싼 뒤 바로 실행하는 형태가 일반적이며 기명도 가능하고 익명도 가능하다. ( )로 감싸주는 이유는 자바스크립트는 function(){ } 키워드를 사용할 경우 파서가 선언문으로 인지한다. 선언문은 해석기에서 실행 후 사라지기에 값으로 존재하지 않는다. 때문에 "함수 표현식"을 통해 명시적으로 나타내줘야한다. ( )를 붙이는 것 외에도 연산자를 앞에 붙일 경우에도 즉시 실행된다. -function(a, b){ return console.log(a + b) })(1,2) // 3 // 즉..