본문 바로가기

전체 글79

[Javascript] 클로저 Closure 정의 이미 생명 주기가 끝난 외부 함수의 변수를 참조하는 함수를 클로저라고 한다. 최종적으로 반환되는 함수가 외부(부모) 함수의 지역 변수에 접근할 때 발생한다. 함수가 종료되어 외부 함수의 컨텍스트가 반환되더라도 변수 객체는 반환되는 내부 함수의 스코프 체인에 그대로 남아있어야만 접근할 수 있다. 실행이 종료된(사라진) 실행 컨텍스트의 변수 객체를 다른 실행 컨텍스트의 스코프 체인으로 참조되고 있는 것 클로저라는 이름은 함수가 자유 변수에 대해 닫혀있다는 의미인데 의역하면 '자유 변수에 엮여있는 함수'라고 할 수 있다. 과정 외부 함수의 호출이 이루어지고, 이 외부 함수에서 새로운 함수가 반환된다(클로저) 반환된 함수가 클로저이고 이 클로저는 외부 함수의 지역 변수를 사용한다.(자유 변수) 반환된 클로.. 2021. 1. 5.
[Javascript] 스코프 체인 Scopechain 정의 변수와 함수의 유효 범위를 나타내는 스코프가 [[scope]] 프로퍼티로 각 함수 객체 내에서 연결 리스트 형식으로 관리되는데 이를 스코프 체인이라고 한다. ES6 이전에는 함수만이 유효 범위의 유일한 범위였지만 ES6 이후 블록 스코프(let, const)가 추가되었다. 구성 각 실행 컨텍스트의 변수 객체가 구성 요소인 리스트. 3 - ... 2 - 변수 객체 2 1 - 변수 객체 1 0 - 변수 객체 0 각각의 함수는 [[scope]] 프로퍼티로 자신이 생성된 실행 컨텍스트의 스코프 체인을 참조한다. 함수가 실행되는 순간 실행 컨텍스트가 만들어지고, 이 실행 컨텍스트는 실행된 함수(상위 컨텍스트)의 [[scope]] 프로퍼티를 기반으로 새로운 스코프 체인을 만든다. 참고 > 실행 컨텍스트 Exe.. 2021. 1. 4.
[Javascript] 실행 컨텍스트 Execution context 정의 자바스크립트가 실행될 때 생성되는 하나의 실행 단위 실행 가능한 자바스크립트 코드 블록이 실행되는 환경 실행 가능한 코드 블록은 대부분의 경우 함수가 된다. 목적 개발을 할 때 코드의 복잡성을 관리하기 위해 functions, modules, packages등으로 나눠서 사용하는 것처럼 실행 컨텐스트도 자바스크립트 엔진이 코드의 해석과 실행의 복잡성을 관리할 수 있게 해주는 것이다. 생성 아래 3가지의 경우 실행 컨텍스트가 생성된다. 전역 코드 eval() 함수로 실행되는 코드 함수 안의 코드를 실행하는 경우 생성된 실행 컨텍스트는 실행 컨텍스트 스택에 쌓이게 되고 제일 위에 위치하는 실행 컨텍스트가 현재 실행되고 있는 컨텍스트다. 현재 실행되는 컨텍스트에서 이 컨텍스트와 관련 없는 실행 코드가 실.. 2021. 1. 3.
[개념] JWT (JSON Web Token) JWT (JSON Web Token) 데이터가 JSON으로 이루어져 있는 토큰을 의미 두 개체가 서로 안전하게 정보를 주고받을 수 있도록 웹 표준으로 정의된 기술 세션 기반 인증과 토큰 기반 인증의 차이 세션 기반 인증 시스템 서버가 사용자가 로그인 중임을 기억하고 있다는 뜻 세션 기반 인증 시스템 흐름 사용자: 로그인 서버: 세션 저장소에 정보 조회 및 저장 세션 저장소는 주로 메모리, 디스크, 데이터베이스 등을 사용한다 서버: 세션 id 발급, 사용자에게 전달 발급된 세션 id는 주로 브라우저의 쿠키에 저장한다. 사용자: 세션 id와 함께 요청 서버: 세션 조회 서버: 응답 단점 서버를 확장하기가 번거로워질 수 있다. 서버 인스턴스가 여러 개라면 모든 서버끼리 같은 세션을 공유해야 하므로 세션 전용 .. 2021. 1. 2.
[eclipse] tab size 변경 1. Window -> Preferences (or Eclipse -> Preferences) 2. java -> Code Style -> Formatter 3. Active Profile: Eclipse [built-in] -> Edit 4. Indentation -> Tab size 변경 5. 새로운 Profile name 생성 후 OK 출처 www.cis.upenn.edu/~matuszek/cit594-2011/Pages/eclipse-settings.html 2020. 12. 28.
[React] import path에 상대 경로를 절대 경로로 변경하기 src 하위 폴더의 파일에서 상대 경로로 다른 폴더의 파일에 접근할 때 폴더 구조가 복잡하고 깊은 경우 ../../components/A 형태로 ../이 많이 사용되고 가독성이 떨어진다. import A from '../../components/A'; import CommonB from '../../components/common/B'; import commonStyle from '../../lib/styles/common'; 절대 경로를 사용하면 특정 폴더를 기준으로 import path를 설정할 수 있다. 최상위 폴더 아래에 jsconfig.json (typescript인 경우 tsconfig.json) 파일을 생성한다 baseUrl 설정을 추가한다. 아래의.. 2020. 12. 27.