전체 글 (174) 썸네일형 리스트형 클로저(closure) 1 : 기본 개념, 메모리 누수 위험성 1. 개념자바스크립트에서 클로저란, 자기 외부의 스코프(lecxical scope)를 참조하여 사용하는 함수를 의미한다.여기서 렉시컬 스코프란, 함수가 참조할 수 있는 외부 스코프이며 함수의 선언 시점에 정적으로 결정된다.클로저가 만들어지는 방식은, 다음과 같다. function outer() { const used = 1; return function inner() { console.log(used); }; }함수 outer는 내부의 함수 inner를 반환한다. 이 내부 함수는 outer의 지역 변수인 used를 참조outer의 호출 종료 이후에도 inner가 바라 보는 used는 사라지지 않고 메모리에 보관된다.이처럼 함수 내부에서 선언된 내부.. <통섭 - 애드워드 윌슨>을 제미나이 ai로 정리해봄 수요와 공급의 법칙 같은 고전 경제학의 기본 개념은 인간의 이기적인 본성을 전제로 한다.이기성은 당연한 전제처럼 보이지만 어떤 상황에서는 이런 개념들이 맞지가 않는다. 인간의 본성에 대해 동서를 막론하고 도덕, 철학. 문학과 예술, 사회과학, 경제학은 각자만의 해답을 말했다.그 해답들은 인간 본성에 대해 깊이 탐구하고 인상적인 해석들을 보여주었다. 하지만 그들이 다루는 직관과 경험은 각자의 통념과 상식 아래에서 명확한 근거 없이 변형되는 탓에 인간의 본성은 단편적이고 추상적인 무언가가 되어 버리는 문제가 있다. 그런 측면에서 애드워드 윌슨의 "통섭"은 사회과학의 연구는 인간에 대한 경험적 통념적 대전제 아래에 있으며, 이들은 과학의 환원 연구로 대체됨으로써 더 발전할 수 있다는 이야기는 꽤 유용하다. 인.. 바벨 설정 파일 정리 웹팩을 쓰면서 트랜스 파일러로 바벨을 사용하고 있다.이 때 바벨 사용법과 설정 정보를 정리함. 1. 의존성 설치개발 시 빌드 의존성으로 다음을 설치한다.npm install -D @babel/core @babel/plugin-transform-runtime @babel/preset-env @babel/preset-react babel-loader 런타임 의존성으로 다음을 설치한다.npm install @babel/runtime core-js@babel/coreBabel의 엔진. babelrc를 불러와 트랜스 파일링 작업을 실행하고 코드를 만드는 본체babel-loaderWebpack과 Babel을 연결해주는 중간자.Webpack 실행 시 파일을 babel-loader를 통해 @babel/core에서 실행.. [vite] vite의 기본 타입스크립트 설정에 대해 (tsc composite build) 작성 배경vite 프로젝트를 세팅하고 있었다.vite 홈페이지의 설명을 따라 init을 실행하고 생성된 프로젝트를 실행하니 타입스크립트가 세팅되어 있었다. 여기서 궁금한 게 있었다. 1. package.json에서 npm run build 커맨드는 "tsc -b && vite build" 로 설정되어 있다.그런데 왜 tsc -b 일까.tsc 컴파일링은 "tsc" 만 해도 되는데 말이다.2. 1에 대한 궁금증으로 인해 npm run build 커맨드를 "tsc && vite build" 로 바꿔보았다.그러자 소스 코드에 있던 타입 에러가 나오지 않았다. 왜 이런 차이가 생긴 걸까. 원인 분석tsc -b에 대해tsc -b가 뭘까.콘솔에 $ npx tsc -help 를 입력하면 다음 같이 소개한다. ts.. node 프로젝트의 플래그 변수로 NODE_ENV를 쓰지 않는 걸 추천함 원래 나는 사내 node 프로젝트에서 로컬 환경 실행이나 사내 서버, 운영 서버 등 서로 다른 환경에서 실행하기 위해 NODE_ENV를 플래그 변수로 사용했다.로컬 환경이라면 NODE_ENV='local'사내 테스트 서버라면 NODE_ENV='development'운영 서버라면 NODE_ENV='production' 을 주는 방식이다.그러던 중 프로젝트를 모노 레포로 전환하며 관리 도구로 lerna를 사용했고, 이 과정에서 NODE_ENV 가 문제가 되어 더 이상 노드 런타임 실행의 분기처리에 이 변수를 사용하지 않으려 한다. 1. lerna가 무엇인가?lerna는 모노 레포 프로젝트의 관리 도구이다.모노 레포 프로젝트란 독립적으로 패키지 관리, 빌드 및 실행되는 프로젝트를 하나의 레포지토리로 통합한 것.. 모듈과 컴포넌트의 차이 이해하기 (정적 소스 vs 런타임) 컴포넌트와 모듈은 소스 코드를 리팩토링하고 소프트웨어 아키텍처를 설계할 때 범용적으로 많이 사용되는 용어다. 나는 이 두가지가 표면 상 비슷하여 지금까지 구분 없이 사용했다. 하지만, 최근 설계 업무에 들어가며 이 둘을 구분해 사용하는 글들을 접했다. 그래서 이번 기회에 이 둘이 어떻게 다른지 확인해보려 한다. 인터넷에서 둘의 차이를 설명한 몇 가지 글을 접했는데, 그럼에도 둘의 차이에 대한 막연함을 느꼈다. 그래서 내용을 보충해서 적었다. 모듈과 컴포넌트의 공통점표면 상으로 둘은 코드를 역할, 기능, 의존성에 따라 묶은 것으로 동일해 보인다.여기서 응집성 있는 로직들은 하나로 묶어주고, 결합도를 낮춰야 하는 로직들은 서로 분리한다.모듈이나 컴포넌트나 기능을 추상화하고 분할하는 설계에서의 최소 단위다. .. 클로저(closure) 2: 비동기 작업 클로저 캡처 하기 문제 상황반복문 내 작업을 비동기로 예약하려는 상황이 있었음 그래서 아래처럼 비동기 예약 구문(setTimeout) 내에서 외부 변수를 참조하는 방식으로 코드를 짬 function perfTestLoof(count) { return new Promise((resolve) => { let index = 0; while (true) { if (index { console.log("asyncLoofChunkByCount", index, count); if (index + 1 >= count) resolve(null); }); index++; } else.. 자바스크립트에서 재귀와 반복의 차이, 최적화 방법 재귀와 반복의 차이자바스크립트에서는 반복 작업을 구현하기 위해 재귀 함수나 반복문을 사용할 수 있다.재귀 함수는 함수 내부에서 자기 자신을 재호출하는 방식이고, 반복문은 for, while 예약어를 이용하여 반복문 블럭 내 작업을 반복한다. 둘 다 특정 작업이 일정한 종료 조건에 도달할 때 까지 진행한다는 점에서 유사해 보인다.그러면 차이는 어떤 걸까. 콜 스택 사용 재귀 함수는 호출되는 함수들이 종료 조건에 도달하지 않으면 어떻게 될까?2,3번째 함수들이 콜스택에 쌓인 채로 4,5,6..n번째까지 재귀로 호출되는 함수들은 종료되지 않은 채 다음 함수가 호출되어 콜스택에 추가된다. 종료조건을 만나서 정상적으로 종료되거나 콜스택 초과 에러가 나기 전까지는 계속 콜스택에 함수들이 추가된다. 반면 반복문은 함.. 이전 1 2 3 4 ··· 22 다음