"Life is Full of Possibilities" - Soul, 2020

자바스크립트 4

Lexical Environment (렉시컬 환경)에 대해 알아보자 (+호이스팅, TDZ)

대상 독자자바스크립트 이벤트 루프에 대한 지식이 있는 분렉시컬 스코프와 실행 컨텍스트에 대한 지식이 있는 분호이스팅에 대한 지식이 있는 분    실행 컨텍스트 (Execution Context)Lexical Environment에 대해 알아보기에 앞서, 자바스크립트의 실행은 실행 컨텍스트(Execution Context)에 의해서 일어납니다. 실행 컨텍스트란 실행할 코드에 제공할 환경 정보들을 모아놓은 객체입니다. 즉, 코드를 실행하기 위해 필요한 정보들이 들어가 있는 공간입니다. 이 공간들을 콜 스택에 쌓아 올리면서 자바스크립트를 실행합니다. 실행 컨텍스트를 구성할 수 있는 방법으로는 전역 공간, eval, 함수 등이 있습니다. 우리가 흔히 실행 컨텍스트를 구성하는 방법으로 대표적으로는 함수를 실행하는..

[TIL] export vs export default

바닐라JS로 프로그램을 만들던 중 export에 대한 궁금증이 생겼다. (named) export vs export default export 한 모듈에 여러 개체들, 혹은 특정 개체만을 각각 가져올 수 있음 반드시 지정된 이름으로만 import 해야함import { hello } from './hello.js' export default 해당 모듈에 하나의 개체 (변수, 클래스, 함수 등)만 있다는 의미 ⇒ 해당 모듈의 전체를 export 하는 느낌 원하는 이름으로 import 가능import helloTest from './hello.js' 무엇을 사용해야 될까? airbnb convention에 의하면 내보내기 할 것이 한 가지이면 export default 사용하는 것..

[TIL] Execution context (실행 컨텍스트)

먼저 아래 영상을 보면 이해를 쉽고 빠르게 할 수 있다! 실행 컨텍스트 코드가 실행되는 공간 실행 컨텍스트의 Call stack에는, 환경 레코드, 첫 번째로 실행될 함수, 첫 번째 함수가 종료되기 전 실행할 함수 .. 순서로 stack으로 쌓이게 된다. 후입선출 방식을 사용한다 => 나중에 실행되는 함수가 종료되어야만, 그 앞에 실행된 함수가 종료된다. 따라서 나중에 실행되는 함수에서 변수를 먼저 찾고, 바깥으로 나가며 찾는 방식으로 진행이 된다. 환경 레코드 : 실행 컨텍스트에 있는 변수들을 저장하는 공간 function greeting() { sayHi(); } function sayHi() { return "Hi!"; } greeting(); 시작 상태 call stack : [] 위 코드에서, ..

[TIL] Local Storage vs. Session Storage (vs. Cookie)

Web Storage : Local Storage, Session Storage 1. Local Storage - 로컬에 저장됨 - 시간제한이 없고, 브라우저가 꺼져도 사라지지 않는다. => 데이터를 지우기 위해서는 직접 지워주어야 함! - 데이터가 문자열이어야 하고, 다른 자료형 입력 시 문자열로 자동 변환됨. 2. Session Storage - 세션이 종료될 때까지 유지됨 - 세션이 종료된다? => 브라우저, 프로세스, 탭이 종료된다 - 세션이 종료되면 데이터가 사라짐 - 브라우저마다, 탭마다 다른 session 3. Cookie - 용량, 시간, 개수 제한이 있음 - 특정 기간 동안 저장 가능. - 만료 날짜가 지나거나 브라우저 종료 시 자동으로 사라짐. - 자동로그인, 다시 보지 않기, 장바구니..